@mittwald/flow-react-components 1.6.0-next.4 → 1.6.0-next.41

package/dist/js/packages/components/src/lib/controller/overlay/OverlayController.mjs

@@ -1,70 +1,22 @@
 "use client"
 /* */
+import { OverlayState } from "../../../../../components-base/src/overlay/OverlayState.mjs";
+import "../../../../../components-base/src/index.mjs";
 import useSelector from "../../mobx/useSelector.mjs";
 import { useStatic } from "../../hooks/useStatic.mjs";
 import { useCloseOverlayConfirmationController } from "./useCloseOverlayConfirmationController.mjs";
 import { useEffect, useRef } from "react";
-import { action, computed, makeObservable, observable, runInAction } from "mobx";
 //#region src/lib/controller/overlay/OverlayController.ts
-var OverlayController = class OverlayController {
-	isOpen = false;
-	isContentSuspended = false;
-	onOpenHandlers = /* @__PURE__ */ new Set();
-	onCloseHandlers = /* @__PURE__ */ new Set();
-	onOpenChangeHandlers = /* @__PURE__ */ new Set();
-	showConfirmationModal = false;
-	closeIsConfirmed = false;
-	confirmOnCloseFromOptions;
-	/**
-	* Every mounted component that has an opinion on close confirmation
-	* contributes one entry here – e.g. a `Modal` with a `confirmOnClose` prop
-	* and a `Form` tracking its dirty state. Combining them instead of assigning
-	* a single flag keeps them from overwriting each other.
-	*/
-	confirmOnCloseSources = observable.map();
-	/**
-	* Active grants that allow closing without a confirmation. Each entry is
-	* scoped to an ongoing operation that legitimately closes the overlay – e.g.
-	* a `Form` submit – and is dropped again when that operation has finished, so
-	* an operation that does _not_ close the overlay leaves the confirmation
-	* armed.
-	*/
-	closeWithoutConfirmationGrants = /* @__PURE__ */ new Set();
-	/**
-	* The open state a `setOpen` call is currently applying. Handlers run before
-	* `isOpen` is assigned, so a handler that calls `setOpen` again would not be
-	* caught by the equality check at the top and would recurse.
-	*/
-	openStateInFlight;
-	constructor(options = {}) {
-		makeObservable(this, {
-			isOpen: observable,
-			isContentSuspended: observable,
-			showConfirmationModal: observable,
-			confirmOnCloseEnabled: computed,
-			open: action.bound,
-			close: action.bound,
-			toggle: action.bound,
-			setOpen: action.bound,
-			syncOpen: action.bound,
-			setIsContentSuspended: action.bound,
-			confirmClose: action.bound,
-			cancelConfirmation: action.bound
-		});
-		const { isDefaultOpen = false, confirmOnClose = false } = options;
-		this.isOpen = isDefaultOpen;
-		this.confirmOnCloseFromOptions = confirmOnClose;
-	}
-	/** Whether closing this overlay currently requires a confirmation. */
-	get confirmOnCloseEnabled() {
-		if (this.confirmOnCloseSources.size === 0) return this.confirmOnCloseFromOptions;
-		return Array.from(this.confirmOnCloseSources.values()).some(Boolean);
-	}
+/**
+* The state is `OverlayState` from `@mittwald/flow-components-base`, shared
+* with every remote binding; this adds the hooks.
+*/
+var OverlayController = class OverlayController extends OverlayState {
 	useUpdateOptions(options = {}) {
 		const { onOpen, onClose, onOpenChange, confirmOnClose } = options;
-		this.useOnHandler(onOpen, (h) => this.addOpenStateHandler(h, this.onOpenHandlers));
-		this.useOnHandler(onClose, (h) => this.addOpenStateHandler(h, this.onCloseHandlers));
-		this.useOnHandler(onOpenChange, (h) => this.addOpenStateHandler(h, this.onOpenChangeHandlers));
+		this.useOnHandler(onOpen, (h) => this.addOnOpen(h));
+		this.useOnHandler(onClose, (h) => this.addOnClose(h));
+		this.useOnHandler(onOpenChange, (h) => this.addOnOpenChange(h));
 		this.useConfirmOnCloseSource(confirmOnClose);
 	}
 	/**
@@ -86,12 +38,6 @@ var OverlayController = class OverlayController {
 			confirmOnClose
 		]);
 	}
-	setConfirmOnCloseSource(source, confirmOnClose) {
-		runInAction(() => this.confirmOnCloseSources.set(source, confirmOnClose));
-	}
-	removeConfirmOnCloseSource(source) {
-		runInAction(() => this.confirmOnCloseSources.delete(source));
-	}
 	/**
 	* Can be used to execute a callback when the Overlay has unmounted – means
 	* after any closing animation.
@@ -119,81 +65,9 @@ var OverlayController = class OverlayController {
 		controller.useUpdateOptions(options);
 		return controller;
 	}
-	addOpenStateHandler(handler, handlersSet) {
-		handlersSet.add(handler);
-		return () => {
-			handlersSet.delete(handler);
-		};
-	}
 	useOnHandler(handler, addHandlerFn) {
 		useEffect(() => handler ? addHandlerFn(handler) : void 0, [handler, this]);
 	}
-	executeHandlers(isOpen, handlers) {
-		return Array.from(handlers).map((handler) => handler(isOpen)).some((result) => result === false);
-	}
-	executeOnClose() {
-		return this.executeHandlers(false, this.onCloseHandlers);
-	}
-	executeOnOpen() {
-		return this.executeHandlers(true, this.onOpenHandlers);
-	}
-	executeOnOpenChange(isOpen) {
-		return this.executeHandlers(isOpen, this.onOpenChangeHandlers);
-	}
-	addOnClose(handler) {
-		return this.addOpenStateHandler(handler, this.onCloseHandlers);
-	}
-	addOnOpen(handler) {
-		return this.addOpenStateHandler(handler, this.onOpenHandlers);
-	}
-	addOnOpenChange(handler) {
-		return this.addOpenStateHandler(handler, this.onOpenChangeHandlers);
-	}
-	open() {
-		this.setOpen(true);
-	}
-	close(options) {
-		this.setOpen(false, options);
-	}
-	toggle() {
-		this.setOpen(!this.isOpen);
-	}
-	setOpen(toOpen, options = {}) {
-		if (this.isOpen === toOpen || this.openStateInFlight === toOpen) return;
-		this.openStateInFlight = toOpen;
-		try {
-			this.applyOpenState(toOpen, options);
-		} finally {
-			this.openStateInFlight = void 0;
-		}
-	}
-	/**
-	* Sets the open state without running any handler. Use it to mirror a
-	* controlled `isOpen` prop, whose change comes from the consumer – notifying
-	* them of their own state would echo it back.
-	*/
-	syncOpen(toOpen) {
-		this.isOpen = toOpen;
-	}
-	applyOpenState(toOpen, options) {
-		const { bypassConfirmation = false } = options;
-		if (toOpen === false) {
-			const closeIsConfirmed = this.closeIsConfirmed;
-			this.closeIsConfirmed = false;
-			if (this.confirmOnCloseEnabled && !closeIsConfirmed && this.closeWithoutConfirmationGrants.size === 0 && !bypassConfirmation) {
-				this.showConfirmationModal = true;
-				return;
-			}
-		}
-		let aborted;
-		if (toOpen) aborted = this.executeOnOpen();
-		else aborted = this.executeOnClose();
-		if (!aborted) aborted = this.executeOnOpenChange(toOpen);
-		if (!aborted) this.isOpen = toOpen;
-	}
-	setIsContentSuspended(to) {
-		this.isContentSuspended = to;
-	}
 	useIsOpen() {
 		return useSelector(() => this.isOpen);
 	}
@@ -209,28 +83,6 @@ var OverlayController = class OverlayController {
 	useConfirmationController() {
 		return useCloseOverlayConfirmationController(this);
 	}
-	/**
-	* Allows closing this overlay without a confirmation until the returned
-	* disposer is called. Use it around an operation that may legitimately close
-	* the overlay – e.g. a `Form` submit, where a "discard unsaved changes?"
-	* prompt would be nonsense – and dispose it as soon as that operation has
-	* finished. An operation that ends without closing the overlay therefore
-	* leaves the confirmation armed (#2775).
-	*/
-	grantCloseWithoutConfirmation() {
-		const grant = {};
-		this.closeWithoutConfirmationGrants.add(grant);
-		return () => {
-			this.closeWithoutConfirmationGrants.delete(grant);
-		};
-	}
-	confirmClose() {
-		this.closeIsConfirmed = true;
-		this.showConfirmationModal = false;
-	}
-	cancelConfirmation() {
-		this.showConfirmationModal = false;
-	}
 };
 //#endregion
 export { OverlayController };

package/dist/js/packages/components/src/lib/controller/overlay/OverlayController.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"OverlayController.mjs","names":[],"sources":["../../../../../../../../src/lib/controller/overlay/OverlayController.ts"],"sourcesContent":["import {\n  action,\n  computed,\n  makeObservable,\n  observable,\n  runInAction,\n} from \"mobx\";\nimport useSelector from \"@/lib/mobx/useSelector\";\nimport { useStatic } from \"@/lib/hooks/useStatic\";\nimport { useEffect, useRef, type DependencyList } from \"react\";\nimport { useCloseOverlayConfirmationController } from \"@/lib/controller/overlay/useCloseOverlayConfirmationController\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\n\nexport type OverlayOpenHandler = () => unknown;\nexport type OverlayCloseHandler = () => unknown;\nexport type OverlayOpenStateHandler = (isOpen: boolean) => unknown;\ntype AnyOverlayOpenStateHandler =\n  OverlayOpenHandler | OverlayCloseHandler | OverlayOpenStateHandler;\n\ntype DisposerFn = () => void;\n\nexport interface CloseOverlayOptions {\n  /**\n   * The overlay to close. Omitted, the nearest enclosing overlay is closed –\n   * the same thing `closeOverlay={true}` means.\n   */\n  overlay?: FlowComponentName | OverlayController;\n  bypassConfirmation?: boolean;\n}\n\nexport interface OnOverlayClosedOptions {\n  dependencies?: DependencyList;\n}\n\nexport type CloseModalOptions = Omit<CloseOverlayOptions, \"overlay\">;\n\n/**\n * Every way an action can point at an overlay: by the Flow component name it\n * registers under, by controller, by options, or with `true` – the nearest\n * enclosing overlay, whatever its name.\n */\nexport type OverlayReference =\n  FlowComponentName | OverlayController | CloseOverlayOptions | true;\n\ntype CloseOptions = CloseOverlayOptions | CloseModalOptions;\n\nexport interface OverlayControllerOptions {\n  isDefaultOpen?: boolean;\n  onOpen?: OverlayOpenHandler;\n  onClose?: OverlayCloseHandler;\n  onOpenChange?: OverlayOpenStateHandler;\n  /**\n   * Whether closing the overlay must be confirmed. `undefined` means \"no\n   * opinion\": the value is not contributed at all, so other sources (e.g. a\n   * `Modal`'s `confirmOnClose` prop or a dirty `Form`) still decide.\n   */\n  confirmOnClose?: boolean;\n}\n\ntype ConstructorOptions = Pick<\n  OverlayControllerOptions,\n  \"isDefaultOpen\" | \"confirmOnClose\"\n>;\n\nexport class OverlayController {\n  public isOpen = false;\n  public isContentSuspended = false;\n  private onOpenHandlers = new Set<OverlayOpenHandler>();\n  private onCloseHandlers = new Set<OverlayCloseHandler>();\n  private onOpenChangeHandlers = new Set<OverlayOpenStateHandler>();\n\n  public showConfirmationModal = false;\n  public closeIsConfirmed = false;\n  private readonly confirmOnCloseFromOptions: boolean;\n  /**\n   * Every mounted component that has an opinion on close confirmation\n   * contributes one entry here – e.g. a `Modal` with a `confirmOnClose` prop\n   * and a `Form` tracking its dirty state. Combining them instead of assigning\n   * a single flag keeps them from overwriting each other.\n   */\n  private confirmOnCloseSources = observable.map<object, boolean>();\n  /**\n   * Active grants that allow closing without a confirmation. Each entry is\n   * scoped to an ongoing operation that legitimately closes the overlay – e.g.\n   * a `Form` submit – and is dropped again when that operation has finished, so\n   * an operation that does _not_ close the overlay leaves the confirmation\n   * armed.\n   */\n  private closeWithoutConfirmationGrants = new Set<object>();\n  /**\n   * The open state a `setOpen` call is currently applying. Handlers run before\n   * `isOpen` is assigned, so a handler that calls `setOpen` again would not be\n   * caught by the equality check at the top and would recurse.\n   */\n  private openStateInFlight: boolean | undefined;\n\n  public constructor(options: ConstructorOptions = {}) {\n    makeObservable(this, {\n      isOpen: observable,\n      isContentSuspended: observable,\n      showConfirmationModal: observable,\n      confirmOnCloseEnabled: computed,\n      open: action.bound,\n      close: action.bound,\n      toggle: action.bound,\n      setOpen: action.bound,\n      syncOpen: action.bound,\n      setIsContentSuspended: action.bound,\n      confirmClose: action.bound,\n      cancelConfirmation: action.bound,\n    });\n    const { isDefaultOpen = false, confirmOnClose = false } = options;\n    this.isOpen = isDefaultOpen;\n    this.confirmOnCloseFromOptions = confirmOnClose;\n  }\n\n  /** Whether closing this overlay currently requires a confirmation. */\n  public get confirmOnCloseEnabled(): boolean {\n    if (this.confirmOnCloseSources.size === 0) {\n      return this.confirmOnCloseFromOptions;\n    }\n    return Array.from(this.confirmOnCloseSources.values()).some(Boolean);\n  }\n\n  public useUpdateOptions(options: OverlayControllerOptions = {}): void {\n    const { onOpen, onClose, onOpenChange, confirmOnClose } = options;\n\n    this.useOnHandler(onOpen, (h) =>\n      this.addOpenStateHandler(h, this.onOpenHandlers),\n    );\n    this.useOnHandler(onClose, (h) =>\n      this.addOpenStateHandler(h, this.onCloseHandlers),\n    );\n    this.useOnHandler(onOpenChange, (h) =>\n      this.addOpenStateHandler(h, this.onOpenChangeHandlers),\n    );\n\n    this.useConfirmOnCloseSource(confirmOnClose);\n  }\n\n  /**\n   * Registers the calling component as a close confirmation source for as long\n   * as it is mounted. `undefined` contributes nothing at all.\n   */\n  private useConfirmOnCloseSource(confirmOnClose: boolean | undefined): void {\n    const source = useStatic((): object => ({}));\n\n    useEffect(() => {\n      if (confirmOnClose === undefined) {\n        this.removeConfirmOnCloseSource(source);\n        return;\n      }\n      this.setConfirmOnCloseSource(source, confirmOnClose);\n      return () => this.removeConfirmOnCloseSource(source);\n    }, [this, source, confirmOnClose]);\n  }\n\n  private setConfirmOnCloseSource(source: object, confirmOnClose: boolean) {\n    runInAction(() => this.confirmOnCloseSources.set(source, confirmOnClose));\n  }\n\n  private removeConfirmOnCloseSource(source: object) {\n    runInAction(() => this.confirmOnCloseSources.delete(source));\n  }\n\n  /**\n   * Can be used to execute a callback when the Overlay has unmounted – means\n   * after any closing animation.\n   *\n   * NOTICE: This hook only works inside the corresponding Overlay!\n   */\n  public useOnClosed(\n    callback: () => unknown,\n    options: OnOverlayClosedOptions = {},\n  ) {\n    const { dependencies = [] } = options;\n    const isOpen = this.useIsOpen();\n    const wasOpen = useRef(this.isOpen);\n\n    this.useUpdateOptions({\n      onOpen: () => {\n        wasOpen.current = true;\n      },\n    });\n\n    useEffect(() => {\n      return () => {\n        if (!isOpen && wasOpen.current) {\n          wasOpen.current = false;\n          callback();\n        }\n      };\n    }, [isOpen, ...dependencies]);\n  }\n\n  public static useNew(\n    options: OverlayControllerOptions = {},\n  ): OverlayController {\n    const controller = useStatic(() => new OverlayController(options));\n    controller.useUpdateOptions(options);\n    return controller;\n  }\n\n  private addOpenStateHandler<T extends AnyOverlayOpenStateHandler>(\n    handler: T,\n    handlersSet: Set<T>,\n  ): DisposerFn {\n    handlersSet.add(handler);\n    return () => {\n      handlersSet.delete(handler);\n    };\n  }\n\n  private useOnHandler<T extends AnyOverlayOpenStateHandler>(\n    handler: T | undefined,\n    addHandlerFn: (handler: T) => DisposerFn,\n  ) {\n    useEffect(\n      () => (handler ? addHandlerFn(handler) : undefined),\n      [handler, this],\n    );\n  }\n\n  private executeHandlers(\n    isOpen: boolean,\n    handlers: Set<\n      OverlayOpenHandler | OverlayCloseHandler | OverlayOpenStateHandler\n    >,\n  ): boolean {\n    const handlerResult = Array.from(handlers).map((handler) =>\n      handler(isOpen),\n    );\n    return handlerResult.some((result) => result === false);\n  }\n\n  private executeOnClose(): boolean {\n    return this.executeHandlers(false, this.onCloseHandlers);\n  }\n\n  private executeOnOpen(): boolean {\n    return this.executeHandlers(true, this.onOpenHandlers);\n  }\n\n  private executeOnOpenChange(isOpen: boolean): boolean {\n    return this.executeHandlers(isOpen, this.onOpenChangeHandlers);\n  }\n\n  public addOnClose(handler: OverlayCloseHandler) {\n    return this.addOpenStateHandler(handler, this.onCloseHandlers);\n  }\n\n  public addOnOpen(handler: OverlayOpenHandler) {\n    return this.addOpenStateHandler(handler, this.onOpenHandlers);\n  }\n\n  public addOnOpenChange(handler: OverlayOpenStateHandler) {\n    return this.addOpenStateHandler(handler, this.onOpenChangeHandlers);\n  }\n\n  public open(): void {\n    this.setOpen(true);\n  }\n\n  public close(options?: CloseOptions): void {\n    this.setOpen(false, options);\n  }\n\n  public toggle(): void {\n    this.setOpen(!this.isOpen);\n  }\n\n  public setOpen(toOpen: boolean, options: CloseOptions = {}): void {\n    if (this.isOpen === toOpen || this.openStateInFlight === toOpen) {\n      return;\n    }\n\n    this.openStateInFlight = toOpen;\n    try {\n      this.applyOpenState(toOpen, options);\n    } finally {\n      this.openStateInFlight = undefined;\n    }\n  }\n\n  /**\n   * Sets the open state without running any handler. Use it to mirror a\n   * controlled `isOpen` prop, whose change comes from the consumer – notifying\n   * them of their own state would echo it back.\n   */\n  public syncOpen(toOpen: boolean): void {\n    this.isOpen = toOpen;\n  }\n\n  private applyOpenState(toOpen: boolean, options: CloseOptions): void {\n    const { bypassConfirmation = false } = options;\n\n    if (toOpen === false) {\n      // The confirmation is a one-shot permission for exactly this close\n      // attempt – consume it here instead of only when a close succeeds, so it\n      // cannot survive an aborted close and disarm later attempts.\n      const closeIsConfirmed = this.closeIsConfirmed;\n      this.closeIsConfirmed = false;\n\n      if (\n        this.confirmOnCloseEnabled &&\n        !closeIsConfirmed &&\n        this.closeWithoutConfirmationGrants.size === 0 &&\n        !bypassConfirmation\n      ) {\n        this.showConfirmationModal = true;\n        return;\n      }\n    }\n\n    let aborted: boolean;\n    if (toOpen) {\n      aborted = this.executeOnOpen();\n    } else {\n      aborted = this.executeOnClose();\n    }\n    if (!aborted) {\n      aborted = this.executeOnOpenChange(toOpen);\n    }\n\n    if (!aborted) {\n      this.isOpen = toOpen;\n    }\n  }\n\n  public setIsContentSuspended(to: boolean): void {\n    this.isContentSuspended = to;\n  }\n\n  public useIsOpen() {\n    return useSelector(() => this.isOpen);\n  }\n\n  public useIsContentSuspended() {\n    return useSelector(() => this.isContentSuspended);\n  }\n\n  public useShowConfirmationModal() {\n    return useSelector(() => this.showConfirmationModal);\n  }\n\n  public useConfirmOnCloseEnabled() {\n    return useSelector(() => this.confirmOnCloseEnabled);\n  }\n\n  public useConfirmationController() {\n    return useCloseOverlayConfirmationController(this);\n  }\n\n  /**\n   * Allows closing this overlay without a confirmation until the returned\n   * disposer is called. Use it around an operation that may legitimately close\n   * the overlay – e.g. a `Form` submit, where a \"discard unsaved changes?\"\n   * prompt would be nonsense – and dispose it as soon as that operation has\n   * finished. An operation that ends without closing the overlay therefore\n   * leaves the confirmation armed (#2775).\n   */\n  public grantCloseWithoutConfirmation(): DisposerFn {\n    const grant = {};\n    this.closeWithoutConfirmationGrants.add(grant);\n    return () => {\n      this.closeWithoutConfirmationGrants.delete(grant);\n    };\n  }\n\n  public confirmClose(): void {\n    this.closeIsConfirmed = true;\n    this.showConfirmationModal = false;\n  }\n\n  public cancelConfirmation(): void {\n    this.showConfirmationModal = false;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"OverlayController.mjs","names":[],"sources":["../../../../../../../../src/lib/controller/overlay/OverlayController.ts"],"sourcesContent":["import {\n  OverlayState,\n  type AnyOverlayOpenStateHandler,\n  type DisposerFn,\n  type OverlayCloseHandler,\n  type OverlayCloseOptions,\n  type OverlayOpenHandler,\n  type OverlayOpenStateHandler,\n} from \"@mittwald/flow-components-base\";\nimport useSelector from \"@/lib/mobx/useSelector\";\nimport { useStatic } from \"@/lib/hooks/useStatic\";\nimport { useEffect, useRef, type DependencyList } from \"react\";\nimport { useCloseOverlayConfirmationController } from \"@/lib/controller/overlay/useCloseOverlayConfirmationController\";\nimport type { FlowComponentName } from \"@/components/propTypes\";\n\nexport type {\n  OverlayCloseHandler,\n  OverlayOpenHandler,\n  OverlayOpenStateHandler,\n} from \"@mittwald/flow-components-base\";\n\nexport interface CloseOverlayOptions extends OverlayCloseOptions {\n  /**\n   * The overlay to close. Omitted, the nearest enclosing overlay is closed –\n   * the same thing `closeOverlay={true}` means.\n   */\n  overlay?: FlowComponentName | OverlayController;\n}\n\nexport interface OnOverlayClosedOptions {\n  dependencies?: DependencyList;\n}\n\nexport type CloseModalOptions = Omit<CloseOverlayOptions, \"overlay\">;\n\n/**\n * Every way an action can point at an overlay: by the Flow component name it\n * registers under, by controller, by options, or with `true` – the nearest\n * enclosing overlay, whatever its name.\n */\nexport type OverlayReference =\n  FlowComponentName | OverlayController | CloseOverlayOptions | true;\n\ntype CloseOptions = CloseOverlayOptions | CloseModalOptions;\n\nexport interface OverlayControllerOptions {\n  isDefaultOpen?: boolean;\n  onOpen?: OverlayOpenHandler;\n  onClose?: OverlayCloseHandler;\n  onOpenChange?: OverlayOpenStateHandler;\n  /**\n   * Whether closing the overlay must be confirmed. `undefined` means \"no\n   * opinion\": the value is not contributed at all, so other sources (e.g. a\n   * `Modal`'s `confirmOnClose` prop or a dirty `Form`) still decide.\n   */\n  confirmOnClose?: boolean;\n}\n\n/**\n * The state is `OverlayState` from `@mittwald/flow-components-base`, shared\n * with every remote binding; this adds the hooks.\n */\nexport class OverlayController extends OverlayState<CloseOptions> {\n  public useUpdateOptions(options: OverlayControllerOptions = {}): void {\n    const { onOpen, onClose, onOpenChange, confirmOnClose } = options;\n\n    this.useOnHandler(onOpen, (h) => this.addOnOpen(h));\n    this.useOnHandler(onClose, (h) => this.addOnClose(h));\n    this.useOnHandler(onOpenChange, (h) => this.addOnOpenChange(h));\n\n    this.useConfirmOnCloseSource(confirmOnClose);\n  }\n\n  /**\n   * Registers the calling component as a close confirmation source for as long\n   * as it is mounted. `undefined` contributes nothing at all.\n   */\n  private useConfirmOnCloseSource(confirmOnClose: boolean | undefined): void {\n    const source = useStatic((): object => ({}));\n\n    useEffect(() => {\n      if (confirmOnClose === undefined) {\n        this.removeConfirmOnCloseSource(source);\n        return;\n      }\n      this.setConfirmOnCloseSource(source, confirmOnClose);\n      return () => this.removeConfirmOnCloseSource(source);\n    }, [this, source, confirmOnClose]);\n  }\n\n  /**\n   * Can be used to execute a callback when the Overlay has unmounted – means\n   * after any closing animation.\n   *\n   * NOTICE: This hook only works inside the corresponding Overlay!\n   */\n  public useOnClosed(\n    callback: () => unknown,\n    options: OnOverlayClosedOptions = {},\n  ) {\n    const { dependencies = [] } = options;\n    const isOpen = this.useIsOpen();\n    const wasOpen = useRef(this.isOpen);\n\n    this.useUpdateOptions({\n      onOpen: () => {\n        wasOpen.current = true;\n      },\n    });\n\n    useEffect(() => {\n      return () => {\n        if (!isOpen && wasOpen.current) {\n          wasOpen.current = false;\n          callback();\n        }\n      };\n    }, [isOpen, ...dependencies]);\n  }\n\n  public static useNew(\n    options: OverlayControllerOptions = {},\n  ): OverlayController {\n    const controller = useStatic(() => new OverlayController(options));\n    controller.useUpdateOptions(options);\n    return controller;\n  }\n\n  private useOnHandler<T extends AnyOverlayOpenStateHandler>(\n    handler: T | undefined,\n    addHandlerFn: (handler: T) => DisposerFn,\n  ) {\n    useEffect(\n      () => (handler ? addHandlerFn(handler) : undefined),\n      [handler, this],\n    );\n  }\n\n  public useIsOpen() {\n    return useSelector(() => this.isOpen);\n  }\n\n  public useIsContentSuspended() {\n    return useSelector(() => this.isContentSuspended);\n  }\n\n  public useShowConfirmationModal() {\n    return useSelector(() => this.showConfirmationModal);\n  }\n\n  public useConfirmOnCloseEnabled() {\n    return useSelector(() => this.confirmOnCloseEnabled);\n  }\n\n  public useConfirmationController() {\n    return useCloseOverlayConfirmationController(this);\n  }\n}\n"],"mappings":";;;;;;;;;;;;;AA8DA,IAAa,oBAAb,MAAa,0BAA0B,aAA2B;CAChE,iBAAwB,UAAoC,CAAC,GAAS;EACpE,MAAM,EAAE,QAAQ,SAAS,cAAc,mBAAmB;EAE1D,KAAK,aAAa,SAAS,MAAM,KAAK,UAAU,CAAC,CAAC;EAClD,KAAK,aAAa,UAAU,MAAM,KAAK,WAAW,CAAC,CAAC;EACpD,KAAK,aAAa,eAAe,MAAM,KAAK,gBAAgB,CAAC,CAAC;EAE9D,KAAK,wBAAwB,cAAc;CAC7C;;;;;CAMA,wBAAgC,gBAA2C;EACzE,MAAM,SAAS,iBAAyB,CAAC,EAAE;EAE3C,gBAAgB;GACd,IAAI,mBAAmB,KAAA,GAAW;IAChC,KAAK,2BAA2B,MAAM;IACtC;GACF;GACA,KAAK,wBAAwB,QAAQ,cAAc;GACnD,aAAa,KAAK,2BAA2B,MAAM;EACrD,GAAG;GAAC;GAAM;GAAQ;EAAc,CAAC;CACnC;;;;;;;CAQA,YACE,UACA,UAAkC,CAAC,GACnC;EACA,MAAM,EAAE,eAAe,CAAC,MAAM;EAC9B,MAAM,SAAS,KAAK,UAAU;EAC9B,MAAM,UAAU,OAAO,KAAK,MAAM;EAElC,KAAK,iBAAiB,EACpB,cAAc;GACZ,QAAQ,UAAU;EACpB,EACF,CAAC;EAED,gBAAgB;GACd,aAAa;IACX,IAAI,CAAC,UAAU,QAAQ,SAAS;KAC9B,QAAQ,UAAU;KAClB,SAAS;IACX;GACF;EACF,GAAG,CAAC,QAAQ,GAAG,YAAY,CAAC;CAC9B;CAEA,OAAc,OACZ,UAAoC,CAAC,GAClB;EACnB,MAAM,aAAa,gBAAgB,IAAI,kBAAkB,OAAO,CAAC;EACjE,WAAW,iBAAiB,OAAO;EACnC,OAAO;CACT;CAEA,aACE,SACA,cACA;EACA,gBACS,UAAU,aAAa,OAAO,IAAI,KAAA,GACzC,CAAC,SAAS,IAAI,CAChB;CACF;CAEA,YAAmB;EACjB,OAAO,kBAAkB,KAAK,MAAM;CACtC;CAEA,wBAA+B;EAC7B,OAAO,kBAAkB,KAAK,kBAAkB;CAClD;CAEA,2BAAkC;EAChC,OAAO,kBAAkB,KAAK,qBAAqB;CACrD;CAEA,2BAAkC;EAChC,OAAO,kBAAkB,KAAK,qBAAqB;CACrD;CAEA,4BAAmC;EACjC,OAAO,sCAAsC,IAAI;CACnD;AACF"}

package/dist/js/packages/components/src/lib/controller/overlay/useCloseOverlayConfirmationController.mjs

@@ -13,6 +13,7 @@ var useCloseOverlayConfirmationController = (parentController) => {
 	});
 	useEffect(() => {
 		if (showConfirmationModal) confirmationModalController.open();
+		else confirmationModalController.close();
 	}, [confirmationModalController, showConfirmationModal]);
 	if (parentController.confirmClose) return {
 		controller: confirmationModalController,

package/dist/js/packages/components/src/lib/controller/overlay/useCloseOverlayConfirmationController.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useCloseOverlayConfirmationController.mjs","names":[],"sources":["../../../../../../../../src/lib/controller/overlay/useCloseOverlayConfirmationController.ts"],"sourcesContent":["import type { OverlayController } from \"@/lib/controller/overlay/OverlayController\";\nimport { useModalController } from \"@/lib/controller/overlay/useModalController\";\nimport { useEffect } from \"react\";\n\nexport const useCloseOverlayConfirmationController = (\n  parentController: OverlayController,\n) => {\n  const showConfirmationModal = parentController.useShowConfirmationModal();\n\n  const confirmationModalController = useModalController({\n    reuseControllerFromContext: false,\n    onClose: () => {\n      if (showConfirmationModal) {\n        parentController.cancelConfirmation();\n      }\n    },\n  });\n\n  useEffect(() => {\n    if (showConfirmationModal) {\n      confirmationModalController.open();\n    }\n  }, [confirmationModalController, showConfirmationModal]);\n\n  if (parentController.confirmClose) {\n    return {\n      controller: confirmationModalController,\n      cancel: () => parentController.cancelConfirmation(),\n      confirm: () => {\n        parentController.confirmClose();\n        parentController.close();\n      },\n    } as const;\n  }\n};\n"],"mappings":";;;;;AAIA,IAAa,yCACX,qBACG;CACH,MAAM,wBAAwB,iBAAiB,yBAAyB;CAExE,MAAM,8BAA8B,mBAAmB;EACrD,4BAA4B;EAC5B,eAAe;GACb,IAAI,uBACF,iBAAiB,mBAAmB;EAExC;CACF,CAAC;CAED,gBAAgB;EACd,IAAI,uBACF,4BAA4B,KAAK;CAErC,GAAG,CAAC,6BAA6B,qBAAqB,CAAC;CAEvD,IAAI,iBAAiB,cACnB,OAAO;EACL,YAAY;EACZ,cAAc,iBAAiB,mBAAmB;EAClD,eAAe;GACb,iBAAiB,aAAa;GAC9B,iBAAiB,MAAM;EACzB;CACF;AAEJ"}
+{"version":3,"file":"useCloseOverlayConfirmationController.mjs","names":[],"sources":["../../../../../../../../src/lib/controller/overlay/useCloseOverlayConfirmationController.ts"],"sourcesContent":["import type { OverlayController } from \"@/lib/controller/overlay/OverlayController\";\nimport { useModalController } from \"@/lib/controller/overlay/useModalController\";\nimport { useEffect } from \"react\";\n\nexport const useCloseOverlayConfirmationController = (\n  parentController: OverlayController,\n) => {\n  const showConfirmationModal = parentController.useShowConfirmationModal();\n\n  const confirmationModalController = useModalController({\n    reuseControllerFromContext: false,\n    onClose: () => {\n      if (showConfirmationModal) {\n        parentController.cancelConfirmation();\n      }\n    },\n  });\n\n  useEffect(() => {\n    if (showConfirmationModal) {\n      confirmationModalController.open();\n    } else {\n      confirmationModalController.close();\n    }\n  }, [confirmationModalController, showConfirmationModal]);\n\n  if (parentController.confirmClose) {\n    return {\n      controller: confirmationModalController,\n      cancel: () => parentController.cancelConfirmation(),\n      confirm: () => {\n        parentController.confirmClose();\n        parentController.close();\n      },\n    } as const;\n  }\n};\n"],"mappings":";;;;;AAIA,IAAa,yCACX,qBACG;CACH,MAAM,wBAAwB,iBAAiB,yBAAyB;CAExE,MAAM,8BAA8B,mBAAmB;EACrD,4BAA4B;EAC5B,eAAe;GACb,IAAI,uBACF,iBAAiB,mBAAmB;EAExC;CACF,CAAC;CAED,gBAAgB;EACd,IAAI,uBACF,4BAA4B,KAAK;OAEjC,4BAA4B,MAAM;CAEtC,GAAG,CAAC,6BAA6B,qBAAqB,CAAC;CAEvD,IAAI,iBAAiB,cACnB,OAAO;EACL,YAAY;EACZ,cAAc,iBAAiB,mBAAmB;EAClD,eAAe;GACb,iBAAiB,aAAa;GAC9B,iBAAiB,MAAM;EACzB;CACF;AAEJ"}

package/dist/js/packages/components/src/lib/hooks/dom/useVirtualKeyboardVisible.mjs

@@ -11,12 +11,15 @@ var isVirtualKeyboardVisible = (layoutViewportHeight, visualViewportHeight, thre
 * VisualViewport API. On iOS and Android the layout viewport stays while the
 * visual viewport shrinks by the keyboard height. Returns `false` where
 * VisualViewport is unavailable (SSR, very old browsers).
+*
+* Reading the viewport height forces a synchronous layout, so the hook neither
+* reads nor listens while `isEnabled` is `false`, and returns `false` then.
 */
-var useVirtualKeyboardVisible = () => {
+var useVirtualKeyboardVisible = (isEnabled = true) => {
 	const [visible, setVisible] = useState(false);
 	useEffect(() => {
 		const viewport = window.visualViewport;
-		if (!viewport) return;
+		if (!isEnabled || !viewport) return;
 		const update = () => {
 			setVisible(isVirtualKeyboardVisible(window.innerHeight, viewport.height));
 		};
@@ -26,9 +29,10 @@ var useVirtualKeyboardVisible = () => {
 		return () => {
 			viewport.removeEventListener("resize", update);
 			viewport.removeEventListener("scroll", update);
+			setVisible(false);
 		};
-	}, []);
-	return visible;
+	}, [isEnabled]);
+	return isEnabled && visible;
 };
 //#endregion
 export { isVirtualKeyboardVisible, useVirtualKeyboardVisible };

package/dist/js/packages/components/src/lib/hooks/dom/useVirtualKeyboardVisible.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useVirtualKeyboardVisible.mjs","names":[],"sources":["../../../../../../../../src/lib/hooks/dom/useVirtualKeyboardVisible.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/**\n * Minimum shrinkage (px) of the visual viewport relative to the layout viewport\n * that we treat as \"the on-screen keyboard is open\". Filters out the much\n * smaller changes caused by mobile browser chrome (e.g. the address bar).\n */\nexport const VIRTUAL_KEYBOARD_MIN_HEIGHT = 150;\n\n/**\n * Pure predicate: the visual viewport is at least `threshold` px shorter than\n * the layout viewport (i.e. the on-screen keyboard is open).\n */\nexport const isVirtualKeyboardVisible = (\n  layoutViewportHeight: number,\n  visualViewportHeight: number,\n  threshold: number = VIRTUAL_KEYBOARD_MIN_HEIGHT,\n): boolean => layoutViewportHeight - visualViewportHeight > threshold;\n\n/**\n * Tracks whether the on-screen (virtual) keyboard is currently open, using the\n * VisualViewport API. On iOS and Android the layout viewport stays while the\n * visual viewport shrinks by the keyboard height. Returns `false` where\n * VisualViewport is unavailable (SSR, very old browsers).\n */\nexport const useVirtualKeyboardVisible = (): boolean => {\n  const [visible, setVisible] = useState(false);\n\n  useEffect(() => {\n    const viewport = window.visualViewport;\n    if (!viewport) {\n      return;\n    }\n    const update = (): void => {\n      setVisible(isVirtualKeyboardVisible(window.innerHeight, viewport.height));\n    };\n    update();\n    viewport.addEventListener(\"resize\", update);\n    viewport.addEventListener(\"scroll\", update);\n    return () => {\n      viewport.removeEventListener(\"resize\", update);\n      viewport.removeEventListener(\"scroll\", update);\n    };\n  }, []);\n\n  return visible;\n};\n"],"mappings":";;;;;;;AAaA,IAAa,4BACX,sBACA,sBACA,YAAA,QACY,uBAAuB,uBAAuB;;;;;;;AAQ5D,IAAa,kCAA2C;CACtD,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAE5C,gBAAgB;EACd,MAAM,WAAW,OAAO;EACxB,IAAI,CAAC,UACH;EAEF,MAAM,eAAqB;GACzB,WAAW,yBAAyB,OAAO,aAAa,SAAS,MAAM,CAAC;EAC1E;EACA,OAAO;EACP,SAAS,iBAAiB,UAAU,MAAM;EAC1C,SAAS,iBAAiB,UAAU,MAAM;EAC1C,aAAa;GACX,SAAS,oBAAoB,UAAU,MAAM;GAC7C,SAAS,oBAAoB,UAAU,MAAM;EAC/C;CACF,GAAG,CAAC,CAAC;CAEL,OAAO;AACT"}
+{"version":3,"file":"useVirtualKeyboardVisible.mjs","names":[],"sources":["../../../../../../../../src/lib/hooks/dom/useVirtualKeyboardVisible.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/**\n * Minimum shrinkage (px) of the visual viewport relative to the layout viewport\n * that we treat as \"the on-screen keyboard is open\". Filters out the much\n * smaller changes caused by mobile browser chrome (e.g. the address bar).\n */\nexport const VIRTUAL_KEYBOARD_MIN_HEIGHT = 150;\n\n/**\n * Pure predicate: the visual viewport is at least `threshold` px shorter than\n * the layout viewport (i.e. the on-screen keyboard is open).\n */\nexport const isVirtualKeyboardVisible = (\n  layoutViewportHeight: number,\n  visualViewportHeight: number,\n  threshold: number = VIRTUAL_KEYBOARD_MIN_HEIGHT,\n): boolean => layoutViewportHeight - visualViewportHeight > threshold;\n\n/**\n * Tracks whether the on-screen (virtual) keyboard is currently open, using the\n * VisualViewport API. On iOS and Android the layout viewport stays while the\n * visual viewport shrinks by the keyboard height. Returns `false` where\n * VisualViewport is unavailable (SSR, very old browsers).\n *\n * Reading the viewport height forces a synchronous layout, so the hook neither\n * reads nor listens while `isEnabled` is `false`, and returns `false` then.\n */\nexport const useVirtualKeyboardVisible = (isEnabled = true): boolean => {\n  const [visible, setVisible] = useState(false);\n\n  useEffect(() => {\n    const viewport = window.visualViewport;\n    if (!isEnabled || !viewport) {\n      return;\n    }\n    const update = (): void => {\n      setVisible(isVirtualKeyboardVisible(window.innerHeight, viewport.height));\n    };\n    update();\n    viewport.addEventListener(\"resize\", update);\n    viewport.addEventListener(\"scroll\", update);\n    return () => {\n      viewport.removeEventListener(\"resize\", update);\n      viewport.removeEventListener(\"scroll\", update);\n      setVisible(false);\n    };\n  }, [isEnabled]);\n\n  return isEnabled && visible;\n};\n"],"mappings":";;;;;;;AAaA,IAAa,4BACX,sBACA,sBACA,YAAA,QACY,uBAAuB,uBAAuB;;;;;;;;;;AAW5D,IAAa,6BAA6B,YAAY,SAAkB;CACtE,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAE5C,gBAAgB;EACd,MAAM,WAAW,OAAO;EACxB,IAAI,CAAC,aAAa,CAAC,UACjB;EAEF,MAAM,eAAqB;GACzB,WAAW,yBAAyB,OAAO,aAAa,SAAS,MAAM,CAAC;EAC1E;EACA,OAAO;EACP,SAAS,iBAAiB,UAAU,MAAM;EAC1C,SAAS,iBAAiB,UAAU,MAAM;EAC1C,aAAa;GACX,SAAS,oBAAoB,UAAU,MAAM;GAC7C,SAAS,oBAAoB,UAAU,MAAM;GAC7C,WAAW,KAAK;EAClB;CACF,GAAG,CAAC,SAAS,CAAC;CAEd,OAAO,aAAa;AACtB"}

package/dist/js/packages/components/src/views/DatePickerView.mjs

@@ -0,0 +1,16 @@
+"use client"
+/* */
+import { viewComponentContext } from "../lib/viewComponentContext/viewComponentContext.mjs";
+import { DatePicker } from "../components/DatePicker/DatePicker.mjs";
+import { memo, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/views/DatePickerView.tsx
+var DatePickerView = memo((props) => {
+	const View = useContext(viewComponentContext)["DatePicker"] ?? DatePicker;
+	return /* @__PURE__ */ jsx(View, { ...props });
+});
+DatePickerView.displayName = "DatePickerView";
+//#endregion
+export { DatePickerView as default };
+
+//# sourceMappingURL=DatePickerView.mjs.map

package/dist/js/packages/components/src/views/DatePickerView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePickerView.mjs","names":[],"sources":["../../../../../../src/views/DatePickerView.tsx"],"sourcesContent":["/* prettier-ignore */\n/* This file is auto-generated with the remote-components-generator */\nimport React, { memo, type FC, useContext } from \"react\";\nimport {\n  DatePicker,\n  type DatePickerProps,\n} from \"@/components/DatePicker/DatePicker\";\nimport { viewComponentContext } from \"@/lib/viewComponentContext/viewComponentContext\";\n\nconst DatePickerView: FC<DatePickerProps> = memo((props) => {\n  const View = useContext(viewComponentContext)[\"DatePicker\"] ?? DatePicker;\n  return <View {...props} />;\n});\nDatePickerView.displayName = \"DatePickerView\";\n\nexport default DatePickerView;\n"],"mappings":";;;;;;;AASA,IAAM,iBAAsC,MAAM,UAAU;CAC1D,MAAM,OAAO,WAAW,oBAAoB,CAAC,CAAC,iBAAiB;CAC/D,OAAO,oBAAC,MAAD,EAAM,GAAI,MAAQ,CAAA;AAC3B,CAAC;AACD,eAAe,cAAc"}

package/dist/js/packages/components/src/views/LabelView.mjs

@@ -0,0 +1,16 @@
+"use client"
+/* */
+import { viewComponentContext } from "../lib/viewComponentContext/viewComponentContext.mjs";
+import { Label } from "../components/Label/Label.mjs";
+import { memo, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/views/LabelView.tsx
+var LabelView = memo((props) => {
+	const View = useContext(viewComponentContext)["Label"] ?? Label;
+	return /* @__PURE__ */ jsx(View, { ...props });
+});
+LabelView.displayName = "LabelView";
+//#endregion
+export { LabelView as default };
+
+//# sourceMappingURL=LabelView.mjs.map

package/dist/js/packages/components/src/views/LabelView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LabelView.mjs","names":[],"sources":["../../../../../../src/views/LabelView.tsx"],"sourcesContent":["/* prettier-ignore */\n/* This file is auto-generated with the remote-components-generator */\nimport React, { memo, type FC, useContext } from \"react\";\nimport { Label, type LabelProps } from \"@/components/Label/Label\";\nimport { viewComponentContext } from \"@/lib/viewComponentContext/viewComponentContext\";\n\nconst LabelView: FC<LabelProps> = memo((props) => {\n  const View = useContext(viewComponentContext)[\"Label\"] ?? Label;\n  return <View {...props} />;\n});\nLabelView.displayName = \"LabelView\";\n\nexport default LabelView;\n"],"mappings":";;;;;;;AAMA,IAAM,YAA4B,MAAM,UAAU;CAChD,MAAM,OAAO,WAAW,oBAAoB,CAAC,CAAC,YAAY;CAC1D,OAAO,oBAAC,MAAD,EAAM,GAAI,MAAQ,CAAA;AAC3B,CAAC;AACD,UAAU,cAAc"}

package/dist/js/packages/components/src/views/TimeFieldView.mjs

@@ -0,0 +1,16 @@
+"use client"
+/* */
+import { viewComponentContext } from "../lib/viewComponentContext/viewComponentContext.mjs";
+import { TimeField } from "../components/TimeField/TimeField.mjs";
+import { memo, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/views/TimeFieldView.tsx
+var TimeFieldView = memo((props) => {
+	const View = useContext(viewComponentContext)["TimeField"] ?? TimeField;
+	return /* @__PURE__ */ jsx(View, { ...props });
+});
+TimeFieldView.displayName = "TimeFieldView";
+//#endregion
+export { TimeFieldView as default };
+
+//# sourceMappingURL=TimeFieldView.mjs.map

package/dist/js/packages/components/src/views/TimeFieldView.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeFieldView.mjs","names":[],"sources":["../../../../../../src/views/TimeFieldView.tsx"],"sourcesContent":["/* prettier-ignore */\n/* This file is auto-generated with the remote-components-generator */\nimport React, { memo, type FC, useContext } from \"react\";\nimport {\n  TimeField,\n  type TimeFieldProps,\n} from \"@/components/TimeField/TimeField\";\nimport { viewComponentContext } from \"@/lib/viewComponentContext/viewComponentContext\";\n\nconst TimeFieldView: FC<TimeFieldProps> = memo((props) => {\n  const View = useContext(viewComponentContext)[\"TimeField\"] ?? TimeField;\n  return <View {...props} />;\n});\nTimeFieldView.displayName = \"TimeFieldView\";\n\nexport default TimeFieldView;\n"],"mappings":";;;;;;;AASA,IAAM,gBAAoC,MAAM,UAAU;CACxD,MAAM,OAAO,WAAW,oBAAoB,CAAC,CAAC,gBAAgB;CAC9D,OAAO,oBAAC,MAAD,EAAM,GAAI,MAAQ,CAAA;AAC3B,CAAC;AACD,cAAc,cAAc"}

package/dist/js/packages/components-base/src/index.mjs

@@ -4,8 +4,10 @@ import "./lib/array.mjs";
 import { getListColumn } from "./list/ListModelContext.mjs";
 import "./list/filter/ListFilterValue.mjs";
 import { ListFilter } from "./list/filter/ListFilter.mjs";
-import "./list/filter/dateRange.mjs";
+import { resolveListDateRange } from "./list/filter/dateRange.mjs";
 import { ListDateRangeFilter } from "./list/filter/ListDateRangeFilter.mjs";
+import { formatListDateRange } from "./list/filter/formatDateRange.mjs";
+import { getListDateTimeRangeUpdate, isListDateTimeRangeEndBeforeStart, listDateTimeRangeFieldsFromValue, toListCalendarDate, toListTime } from "./list/filter/dateTimeRangeFields.mjs";
 import "./list/item/ListItem.mjs";
 import { ListItemCollection } from "./list/item/ListItemCollection.mjs";
 import { ListLoaderState } from "./list/loading/ListLoaderState.mjs";
@@ -15,4 +17,5 @@ import { ListSearch } from "./list/search/ListSearch.mjs";
 import { ListSorting, mergeHiddenSorting } from "./list/sorting/ListSorting.mjs";
 import { ListTable } from "./list/table/ListTable.mjs";
 import { ListViewMode } from "./list/viewMode/ListViewMode.mjs";
-export { ActionState, ListBatchesController, ListDateRangeFilter, ListFilter, ListItemCollection, ListLoaderState, ListSearch, ListSorting, ListTable, ListViewMode, actionStateDurations, getListColumn, getListDataLoaderOptions, mergeHiddenSorting };
+import { OverlayState } from "./overlay/OverlayState.mjs";
+export { ActionState, ListBatchesController, ListDateRangeFilter, ListFilter, ListItemCollection, ListLoaderState, ListSearch, ListSorting, ListTable, ListViewMode, OverlayState, actionStateDurations, formatListDateRange, getListColumn, getListDataLoaderOptions, getListDateTimeRangeUpdate, isListDateTimeRangeEndBeforeStart, listDateTimeRangeFieldsFromValue, mergeHiddenSorting, resolveListDateRange, toListCalendarDate, toListTime };

package/dist/js/packages/components-base/src/list/filter/ListDateRangeFilter.mjs

@@ -21,6 +21,7 @@ var ListDateRangeFilter = class extends ListFilter {
 	}
 	setValue(range) {
 		this.getTableColumn().setFilterValue(range);
+		this.notifyFilterUpdated(range ? [range] : []);
 	}
 };
 //#endregion

package/dist/js/packages/components-base/src/list/filter/ListDateRangeFilter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListDateRangeFilter.mjs","names":[],"sources":["../../../../../../../../components-base/src/list/filter/ListDateRangeFilter.ts"],"sourcesContent":["import { ListFilter } from \"./ListFilter\";\nimport {\n  applyDateRangeColumnDef,\n  isListDateRange,\n  type ListDateRange,\n} from \"./dateRange\";\nimport type { PropertyName } from \"../types\";\nimport type { ColumnDef } from \"@tanstack/table-core\";\n\n/**\n * A filter over a span of days rather than over a set of values.\n *\n * Everything except the control that picks the range: the table column, the\n * comparison and the stored value are the same in every binding, and what a\n * calendar looks like is not. A binding subclasses this to add its own calendar\n * options.\n */\nexport class ListDateRangeFilter<\n  T = never,\n  TProp extends PropertyName<T> = never,\n  TRendered = unknown,\n> extends ListFilter<T, TProp, never, TRendered> {\n  public override updateTableColumnDef(def: ColumnDef<T>): void {\n    applyDateRangeColumnDef(def);\n  }\n\n  public override getValue(): ListDateRange | null {\n    const value = super.getValue();\n    return isListDateRange(value) ? value : null;\n  }\n\n  public setValue(range: ListDateRange | null): void {\n    this.getTableColumn().setFilterValue(range);\n  }\n}\n\nexport default ListDateRangeFilter;\n"],"mappings":";;;;;;;;;;;;;AAiBA,IAAa,sBAAb,cAIU,WAAuC;CAC/C,qBAAqC,KAAyB;EAC5D,wBAAwB,GAAG;CAC7B;CAEA,WAAiD;EAC/C,MAAM,QAAQ,MAAM,SAAS;EAC7B,OAAO,gBAAgB,KAAK,IAAI,QAAQ;CAC1C;CAEA,SAAgB,OAAmC;EACjD,KAAK,eAAe,CAAC,CAAC,eAAe,KAAK;CAC5C;AACF"}
+{"version":3,"file":"ListDateRangeFilter.mjs","names":[],"sources":["../../../../../../../../components-base/src/list/filter/ListDateRangeFilter.ts"],"sourcesContent":["import { ListFilter } from \"./ListFilter\";\nimport {\n  applyDateRangeColumnDef,\n  isListDateRange,\n  type ListDateRange,\n} from \"./dateRange\";\nimport type { PropertyName } from \"../types\";\nimport type { ColumnDef } from \"@tanstack/table-core\";\n\n/**\n * A filter over a span of days rather than over a set of values.\n *\n * Everything except the control that picks the range: the table column, the\n * comparison and the stored value are the same in every binding, and what a\n * calendar looks like is not. A binding subclasses this to add its own calendar\n * options.\n */\nexport class ListDateRangeFilter<\n  T = never,\n  TProp extends PropertyName<T> = never,\n  TRendered = unknown,\n> extends ListFilter<T, TProp, never, TRendered> {\n  public override updateTableColumnDef(def: ColumnDef<T>): void {\n    applyDateRangeColumnDef(def);\n  }\n\n  public override getValue(): ListDateRange | null {\n    const value = super.getValue();\n    return isListDateRange(value) ? value : null;\n  }\n\n  public setValue(range: ListDateRange | null): void {\n    this.getTableColumn().setFilterValue(range);\n    this.notifyFilterUpdated(range ? [range] : []);\n  }\n}\n\nexport default ListDateRangeFilter;\n"],"mappings":";;;;;;;;;;;;;AAiBA,IAAa,sBAAb,cAIU,WAAuC;CAC/C,qBAAqC,KAAyB;EAC5D,wBAAwB,GAAG;CAC7B;CAEA,WAAiD;EAC/C,MAAM,QAAQ,MAAM,SAAS;EAC7B,OAAO,gBAAgB,KAAK,IAAI,QAAQ;CAC1C;CAEA,SAAgB,OAAmC;EACjD,KAAK,eAAe,CAAC,CAAC,eAAe,KAAK;EAC1C,KAAK,oBAAoB,QAAQ,CAAC,KAAK,IAAI,CAAC,CAAC;CAC/C;AACF"}

package/dist/js/packages/components-base/src/list/filter/ListFilter.mjs

@@ -166,7 +166,10 @@ var ListFilter = class {
 		this.callOnChangedHandlers(updatedValue);
 	}
 	callOnChangedHandlers(newValue) {
-		const values = toArray(newValue).map((v) => v?.value);
+		this.notifyFilterUpdated(toArray(newValue).map((v) => v?.value));
+	}
+	/** Tells the listeners — the list resetting its batches among them. */
+	notifyFilterUpdated(values) {
 		this.onFilterChangeCallbacks.forEach((cb) => cb(values));
 	}
 	hasChanges() {

package/dist/js/packages/components-base/src/list/filter/ListFilter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListFilter.mjs","names":[],"sources":["../../../../../../../../components-base/src/list/filter/ListFilter.ts"],"sourcesContent":["import { toArray } from \"../../lib/array\";\nimport { getListColumn, type ListModelContext } from \"../ListModelContext\";\nimport type { ListSettingsOperationOptions } from \"../settings/types\";\nimport { customPropertyPrefix } from \"../types\";\nimport type { PropertyName, PropertyValueRenderMethod } from \"../types\";\nimport { ListFilterValue } from \"./ListFilterValue\";\nimport type {\n  FilterMatcher,\n  FilterMode,\n  FilterUpdatedCallback,\n  ListFilterShape,\n} from \"./types\";\nimport type {\n  Column,\n  ColumnDef,\n  ColumnFilter,\n  InitialTableState,\n} from \"@tanstack/table-core\";\nimport { getProperty } from \"dot-prop\";\nimport { difference, unique } from \"remeda\";\n\nconst equalsPropertyMatcher: FilterMatcher<unknown, never, never> = (\n  filterValue,\n  propertyValue,\n) => filterValue === propertyValue;\n\n/** From how many values on a multiple-choice filter offers \"Select all\". */\nconst selectAllMinValueCount = 6;\n\nconst stringCastRenderMethod: PropertyValueRenderMethod<unknown, never> = (\n  value,\n) => String(value) as never;\n\n/** What `storeFilters` needs of a filter, and nothing more. */\ninterface StorableFilter {\n  readonly storageKey: string;\n  getArrayValue(): { id: string }[];\n}\n\n/**\n * One filter of a list: its values, which of them are on, and how that is\n * persisted.\n *\n * Framework-free apart from one thing, which is why `TRendered` exists: a\n * filter value has to be _shown_, and what \"shown\" is belongs to the binding.\n * React's `Filter` fills it with `ReactNode`; the default is `unknown`, so the\n * core can be read without deciding.\n *\n * The selected values live in the TanStack table's column filter, not here.\n * This translates: ids to values, values to a predicate, a toggle to a new\n * column filter.\n */\nexport class ListFilter<\n  T = never,\n  TProp extends PropertyName<T> = never,\n  TMatchValue = never,\n  TRendered = unknown,\n> {\n  private _values?: ListFilterValue<TRendered>[] | undefined;\n  private valuesFromTableState?: {\n    facets: Map<unknown, number>;\n    values: ListFilterValue<TRendered>[];\n  };\n  public readonly context: ListModelContext<T>;\n  public readonly property: TProp;\n  public readonly mode: FilterMode;\n  public readonly matcher: FilterMatcher<T, never, never>;\n  public readonly renderItem: PropertyValueRenderMethod<TMatchValue, TRendered>;\n  public readonly name?: string;\n  public readonly autosave: boolean;\n  public readonly manualSave: boolean;\n  private readonly onFilterChangeCallbacks = new Set<FilterUpdatedCallback>();\n  private readonly defaultSelectedValues?: ListFilterValue<TRendered>[];\n  public readonly priority: \"primary\" | \"secondary\";\n  public readonly storageKey: string;\n\n  public constructor(\n    context: ListModelContext<T>,\n    shape: ListFilterShape<T, TProp, TMatchValue, TRendered>,\n  ) {\n    const {\n      autosave = context.settingsDefaults?.filters?.autosave ?? false,\n      manualSave = context.settingsDefaults?.filters?.manualSave ?? true,\n      property,\n      mode = \"some\",\n      values,\n      matcher = equalsPropertyMatcher,\n      renderItem = stringCastRenderMethod as PropertyValueRenderMethod<\n        TMatchValue,\n        TRendered\n      >,\n      priority = \"primary\",\n      name,\n      defaultSelected,\n      onChange,\n    } = shape;\n\n    this.context = context;\n    this.autosave = autosave;\n    this.manualSave = manualSave;\n    this.property = property;\n    this.storageKey = String(property);\n    this.mode = mode;\n    this._values = values?.map((v) => ListFilterValue.create(this, v));\n    this.matcher = matcher;\n    this.renderItem = renderItem;\n    this.name = name;\n    this.priority = priority;\n    this.defaultSelectedValues = defaultSelected?.map((v) =>\n      ListFilterValue.create(this, v),\n    );\n    if (onChange) {\n      this.onFilterChangeCallbacks.add(onChange);\n    }\n  }\n\n  public updateInitialState(initialState: InitialTableState): void {\n    const initialIds = this.getInitialSelectedIds();\n\n    if (initialIds?.length) {\n      initialState.columnFilters = [\n        ...(initialState.columnFilters ?? []),\n        {\n          id: this.property as string,\n          value: initialIds,\n        },\n      ];\n    }\n  }\n\n  private getInitialSelectedIds(): string[] | undefined {\n    return (\n      this.getStoredSelectedIds({\n        autosave: this.autosave,\n        manualSave: this.manualSave,\n      }) ?? this.defaultSelectedValues?.map((v) => v.id)\n    );\n  }\n\n  private getStoredSelectedIds(\n    options: ListSettingsOperationOptions,\n  ): string[] | undefined {\n    return this.context.settings?.get(\"activeFilters\", options)?.[\n      this.storageKey\n    ];\n  }\n\n  private getStoredSelectedValues(\n    options: ListSettingsOperationOptions,\n  ): ListFilterValue<TRendered>[] | undefined {\n    return this.getStoredSelectedIds(options)\n      ?.map((id) => this.values.find((v) => v.id === id))\n      .filter((v): v is ListFilterValue<TRendered> => v !== undefined);\n  }\n\n  /**\n   * Writes every filter's selection in one go — they share a settings key.\n   *\n   * Takes the two members it reads rather than a `ListFilter<any, …>`: a\n   * `Table<never>` is not assignable to a `Table<any>` (a row model sits in a\n   * contravariant position deep inside), so a list of concrete filters would\n   * not go in.\n   */\n  public static storeFilters<T>(\n    context: ListModelContext<T>,\n    filters: StorableFilter[],\n    options: ListSettingsOperationOptions,\n  ): void {\n    const data = Object.fromEntries(\n      filters.map((filter) => [\n        filter.storageKey,\n        filter.getArrayValue().map((v) => v.id),\n      ]),\n    );\n\n    context.settings?.store(\"activeFilters\", data, options);\n  }\n\n  public updateTableColumnDef(def: ColumnDef<T>): void {\n    def.enableColumnFilter = true;\n    def.filterFn = this.getTableFilterFn();\n  }\n\n  private getTableFilterFn(): ColumnDef<T>[\"filterFn\"] {\n    return (row, _, filterValue) => {\n      const propertyAsString = this.property as string;\n\n      /*\n       * A custom property is not on the item, so the matcher gets the item\n       * itself and decides.\n       */\n      const filterBy = propertyAsString.startsWith(customPropertyPrefix)\n        ? row.original\n        : getProperty(row.original as object, propertyAsString);\n\n      return this.checkFilterMatches(filterBy, filterValue);\n    };\n  }\n\n  private checkFilterMatches(\n    property: unknown,\n    filterValueInput: unknown,\n  ): boolean {\n    if (filterValueInput === null) {\n      return true;\n    }\n\n    const predicate = (filterValue: ListFilterValue<TRendered>) =>\n      this.matcher(filterValue.value as never, property as never);\n\n    const toFilterValue = (something: unknown) =>\n      ListFilterValue.create(this, something);\n\n    if (this.mode === \"all\") {\n      return toArray(filterValueInput).map(toFilterValue).every(predicate);\n    } else if (this.mode === \"some\") {\n      const filterArr = toArray(filterValueInput);\n      return (\n        filterArr.length === 0 || filterArr.map(toFilterValue).some(predicate)\n      );\n    } else if (this.mode === \"one\") {\n      const oneValue = Array.isArray(filterValueInput)\n        ? filterValueInput[0]\n        : filterValueInput;\n      return predicate(toFilterValue(oneValue));\n    }\n\n    throw new Error(`Unknown filter mode '${this.mode}'`);\n  }\n\n  protected getTableColumnFilter(): ColumnFilter | undefined {\n    return this.context.dataTable\n      .getState()\n      .columnFilters.find((f) => f.id === this.property);\n  }\n\n  protected getTableColumn(): Column<T> {\n    return getListColumn(this.context.dataTable, this.property);\n  }\n\n  public getValue(): unknown {\n    return this.getTableColumnFilter()?.value ?? null;\n  }\n\n  /*\n   * Rebuilt only when TanStack hands out a new map: it memoizes the faceted\n   * values and replaces the map when the data changes. Without this, every\n   * row the filter function checks re-hashes every value — `getArrayValue()`\n   * resolves each stored id through `values`.\n   */\n  private getValuesFromTableState(): ListFilterValue<TRendered>[] {\n    const facets = this.getTableColumn().getFacetedUniqueValues();\n\n    if (this.valuesFromTableState?.facets !== facets) {\n      this.valuesFromTableState = {\n        facets,\n        values: unique(\n          Array.from(facets.keys())\n            .flatMap((v) => v)\n            .filter((v) => v !== undefined && v !== null),\n        ).map((v) => ListFilterValue.create(this, v)),\n      };\n    }\n\n    return this.valuesFromTableState.values;\n  }\n\n  private checkIfValueIsUnknown(value: ListFilterValue<TRendered>): boolean {\n    return !this.values.some((v) => v.id === value.id);\n  }\n\n  /**\n   * Drops a selection the data no longer offers — a stored filter value whose\n   * item is gone would otherwise filter everything away with no way to undo\n   * it.\n   */\n  public deleteUnknownFilterValues(): void {\n    /* Values the data offers are by definition known. */\n    if (this._values === undefined) {\n      return;\n    }\n\n    for (const currentValues of this.getArrayValue()) {\n      if (this.checkIfValueIsUnknown(currentValues)) {\n        this.deactivateValue(currentValues);\n      }\n    }\n  }\n\n  /**\n   * The values the filter offers — the ones it was given, or the ones the data\n   * has.\n   *\n   * Follows the table, not a snapshot. A binding that keeps one filter instance\n   * for the list's lifetime would otherwise hold the answer from before the\n   * first batch arrived: an async loader gives the header an empty menu and\n   * never fills it. The values are cached per faceted-values map, which\n   * TanStack replaces when the data changes.\n   */\n  public get values(): ListFilterValue<TRendered>[] {\n    return this._values ?? this.getValuesFromTableState();\n  }\n\n  public getArrayValue(): ListFilterValue<TRendered>[] {\n    const value = this.getValue();\n    return value === null\n      ? []\n      : toArray(value).map((v) => ListFilterValue.create(this, v));\n  }\n\n  public isValueActive(value: ListFilterValue<TRendered>): boolean {\n    return this.getArrayValue().some((v) => v.equals(value));\n  }\n\n  public isActive(): boolean {\n    return this.getArrayValue().length > 0;\n  }\n\n  public deactivateValue(value: ListFilterValue<TRendered>): void {\n    const currentValueAsArray = this.getArrayValue();\n\n    const updatedValue =\n      this.mode === \"all\" || this.mode === \"some\"\n        ? currentValueAsArray.filter((v) => !v.equals(value))\n        : null;\n\n    this.getTableColumn().setFilterValue(updatedValue);\n    this.callOnChangedHandlers(updatedValue);\n  }\n\n  private callOnChangedHandlers(\n    newValue: ListFilterValue<TRendered>[] | ListFilterValue<TRendered> | null,\n  ): void {\n    const values = toArray(newValue).map((v) => v?.value);\n    this.onFilterChangeCallbacks.forEach((cb) => cb(values));\n  }\n\n  public hasChanges(): boolean {\n    const currentIds = this.getArrayValue().map((v) => v.id);\n\n    const defaultIds =\n      this.getStoredSelectedIds({ autosave: false }) ??\n      this.defaultSelectedValues?.map((v) => v.id) ??\n      [];\n\n    return (\n      currentIds.length !== defaultIds.length ||\n      difference(currentIds, defaultIds).length > 0\n    );\n  }\n\n  public isStoringAvailable(): boolean {\n    return !!this.context.settings && this.manualSave;\n  }\n\n  public resetValues(): void {\n    const storedValues =\n      this.getStoredSelectedValues({ autosave: false }) ??\n      this.defaultSelectedValues;\n\n    const resetTo =\n      storedValues ?? (this.mode === \"all\" || this.mode === \"some\" ? [] : null);\n\n    this.getTableColumn().setFilterValue(resetTo);\n    this.callOnChangedHandlers(resetTo);\n  }\n\n  public clear(): void {\n    this.getTableColumn().setFilterValue(null);\n    this.callOnChangedHandlers(null);\n  }\n\n  public toggleValue(newValue: ListFilterValue<TRendered>): void {\n    const currentValueAsArray = this.getArrayValue();\n\n    let updatedValue:\n      ListFilterValue<TRendered>[] | ListFilterValue<TRendered> | null;\n\n    if (this.mode === \"all\" || this.mode === \"some\") {\n      updatedValue = newValue.isActive\n        ? currentValueAsArray.filter((v) => !v.equals(newValue))\n        : [...currentValueAsArray, newValue];\n    } else {\n      updatedValue = newValue.isActive ? null : newValue;\n    }\n\n    this.getTableColumn().setFilterValue(updatedValue);\n    this.callOnChangedHandlers(updatedValue);\n  }\n\n  /**\n   * Whether the filter offers \"Select all\" — a `some` filter with enough\n   * values.\n   */\n  public get isSelectAllAvailable(): boolean {\n    return this.mode === \"some\" && this.values.length >= selectAllMinValueCount;\n  }\n\n  public isEveryValueActive(): boolean {\n    return this.values.every((v) => v.isActive);\n  }\n\n  public selectAll(): void {\n    this.setArrayValue(this.values);\n  }\n\n  /** Makes exactly these values active — what a multiple-selection menu reports. */\n  public setActiveValueIds(ids: Iterable<unknown>): void {\n    const idSet = new Set(ids);\n    this.setArrayValue(this.values.filter((v) => idSet.has(v.id)));\n  }\n\n  public deselectAll(): void {\n    this.setArrayValue([]);\n  }\n\n  private setArrayValue(value: ListFilterValue<TRendered>[]): void {\n    this.getTableColumn().setFilterValue(value);\n    this.callOnChangedHandlers(value);\n  }\n\n  public onFilterUpdated(cb: () => unknown): void {\n    this.onFilterChangeCallbacks.add(cb);\n  }\n}\n\nexport default ListFilter;\n"],"mappings":"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"}
+{"version":3,"file":"ListFilter.mjs","names":[],"sources":["../../../../../../../../components-base/src/list/filter/ListFilter.ts"],"sourcesContent":["import { toArray } from \"../../lib/array\";\nimport { getListColumn, type ListModelContext } from \"../ListModelContext\";\nimport type { ListSettingsOperationOptions } from \"../settings/types\";\nimport { customPropertyPrefix } from \"../types\";\nimport type { PropertyName, PropertyValueRenderMethod } from \"../types\";\nimport { ListFilterValue } from \"./ListFilterValue\";\nimport type {\n  FilterMatcher,\n  FilterMode,\n  FilterUpdatedCallback,\n  ListFilterShape,\n} from \"./types\";\nimport type {\n  Column,\n  ColumnDef,\n  ColumnFilter,\n  InitialTableState,\n} from \"@tanstack/table-core\";\nimport { getProperty } from \"dot-prop\";\nimport { difference, unique } from \"remeda\";\n\nconst equalsPropertyMatcher: FilterMatcher<unknown, never, never> = (\n  filterValue,\n  propertyValue,\n) => filterValue === propertyValue;\n\n/** From how many values on a multiple-choice filter offers \"Select all\". */\nconst selectAllMinValueCount = 6;\n\nconst stringCastRenderMethod: PropertyValueRenderMethod<unknown, never> = (\n  value,\n) => String(value) as never;\n\n/** What `storeFilters` needs of a filter, and nothing more. */\ninterface StorableFilter {\n  readonly storageKey: string;\n  getArrayValue(): { id: string }[];\n}\n\n/**\n * One filter of a list: its values, which of them are on, and how that is\n * persisted.\n *\n * Framework-free apart from one thing, which is why `TRendered` exists: a\n * filter value has to be _shown_, and what \"shown\" is belongs to the binding.\n * React's `Filter` fills it with `ReactNode`; the default is `unknown`, so the\n * core can be read without deciding.\n *\n * The selected values live in the TanStack table's column filter, not here.\n * This translates: ids to values, values to a predicate, a toggle to a new\n * column filter.\n */\nexport class ListFilter<\n  T = never,\n  TProp extends PropertyName<T> = never,\n  TMatchValue = never,\n  TRendered = unknown,\n> {\n  private _values?: ListFilterValue<TRendered>[] | undefined;\n  private valuesFromTableState?: {\n    facets: Map<unknown, number>;\n    values: ListFilterValue<TRendered>[];\n  };\n  public readonly context: ListModelContext<T>;\n  public readonly property: TProp;\n  public readonly mode: FilterMode;\n  public readonly matcher: FilterMatcher<T, never, never>;\n  public readonly renderItem: PropertyValueRenderMethod<TMatchValue, TRendered>;\n  public readonly name?: string;\n  public readonly autosave: boolean;\n  public readonly manualSave: boolean;\n  private readonly onFilterChangeCallbacks = new Set<FilterUpdatedCallback>();\n  private readonly defaultSelectedValues?: ListFilterValue<TRendered>[];\n  public readonly priority: \"primary\" | \"secondary\";\n  public readonly storageKey: string;\n\n  public constructor(\n    context: ListModelContext<T>,\n    shape: ListFilterShape<T, TProp, TMatchValue, TRendered>,\n  ) {\n    const {\n      autosave = context.settingsDefaults?.filters?.autosave ?? false,\n      manualSave = context.settingsDefaults?.filters?.manualSave ?? true,\n      property,\n      mode = \"some\",\n      values,\n      matcher = equalsPropertyMatcher,\n      renderItem = stringCastRenderMethod as PropertyValueRenderMethod<\n        TMatchValue,\n        TRendered\n      >,\n      priority = \"primary\",\n      name,\n      defaultSelected,\n      onChange,\n    } = shape;\n\n    this.context = context;\n    this.autosave = autosave;\n    this.manualSave = manualSave;\n    this.property = property;\n    this.storageKey = String(property);\n    this.mode = mode;\n    this._values = values?.map((v) => ListFilterValue.create(this, v));\n    this.matcher = matcher;\n    this.renderItem = renderItem;\n    this.name = name;\n    this.priority = priority;\n    this.defaultSelectedValues = defaultSelected?.map((v) =>\n      ListFilterValue.create(this, v),\n    );\n    if (onChange) {\n      this.onFilterChangeCallbacks.add(onChange);\n    }\n  }\n\n  public updateInitialState(initialState: InitialTableState): void {\n    const initialIds = this.getInitialSelectedIds();\n\n    if (initialIds?.length) {\n      initialState.columnFilters = [\n        ...(initialState.columnFilters ?? []),\n        {\n          id: this.property as string,\n          value: initialIds,\n        },\n      ];\n    }\n  }\n\n  private getInitialSelectedIds(): string[] | undefined {\n    return (\n      this.getStoredSelectedIds({\n        autosave: this.autosave,\n        manualSave: this.manualSave,\n      }) ?? this.defaultSelectedValues?.map((v) => v.id)\n    );\n  }\n\n  private getStoredSelectedIds(\n    options: ListSettingsOperationOptions,\n  ): string[] | undefined {\n    return this.context.settings?.get(\"activeFilters\", options)?.[\n      this.storageKey\n    ];\n  }\n\n  private getStoredSelectedValues(\n    options: ListSettingsOperationOptions,\n  ): ListFilterValue<TRendered>[] | undefined {\n    return this.getStoredSelectedIds(options)\n      ?.map((id) => this.values.find((v) => v.id === id))\n      .filter((v): v is ListFilterValue<TRendered> => v !== undefined);\n  }\n\n  /**\n   * Writes every filter's selection in one go — they share a settings key.\n   *\n   * Takes the two members it reads rather than a `ListFilter<any, …>`: a\n   * `Table<never>` is not assignable to a `Table<any>` (a row model sits in a\n   * contravariant position deep inside), so a list of concrete filters would\n   * not go in.\n   */\n  public static storeFilters<T>(\n    context: ListModelContext<T>,\n    filters: StorableFilter[],\n    options: ListSettingsOperationOptions,\n  ): void {\n    const data = Object.fromEntries(\n      filters.map((filter) => [\n        filter.storageKey,\n        filter.getArrayValue().map((v) => v.id),\n      ]),\n    );\n\n    context.settings?.store(\"activeFilters\", data, options);\n  }\n\n  public updateTableColumnDef(def: ColumnDef<T>): void {\n    def.enableColumnFilter = true;\n    def.filterFn = this.getTableFilterFn();\n  }\n\n  private getTableFilterFn(): ColumnDef<T>[\"filterFn\"] {\n    return (row, _, filterValue) => {\n      const propertyAsString = this.property as string;\n\n      /*\n       * A custom property is not on the item, so the matcher gets the item\n       * itself and decides.\n       */\n      const filterBy = propertyAsString.startsWith(customPropertyPrefix)\n        ? row.original\n        : getProperty(row.original as object, propertyAsString);\n\n      return this.checkFilterMatches(filterBy, filterValue);\n    };\n  }\n\n  private checkFilterMatches(\n    property: unknown,\n    filterValueInput: unknown,\n  ): boolean {\n    if (filterValueInput === null) {\n      return true;\n    }\n\n    const predicate = (filterValue: ListFilterValue<TRendered>) =>\n      this.matcher(filterValue.value as never, property as never);\n\n    const toFilterValue = (something: unknown) =>\n      ListFilterValue.create(this, something);\n\n    if (this.mode === \"all\") {\n      return toArray(filterValueInput).map(toFilterValue).every(predicate);\n    } else if (this.mode === \"some\") {\n      const filterArr = toArray(filterValueInput);\n      return (\n        filterArr.length === 0 || filterArr.map(toFilterValue).some(predicate)\n      );\n    } else if (this.mode === \"one\") {\n      const oneValue = Array.isArray(filterValueInput)\n        ? filterValueInput[0]\n        : filterValueInput;\n      return predicate(toFilterValue(oneValue));\n    }\n\n    throw new Error(`Unknown filter mode '${this.mode}'`);\n  }\n\n  protected getTableColumnFilter(): ColumnFilter | undefined {\n    return this.context.dataTable\n      .getState()\n      .columnFilters.find((f) => f.id === this.property);\n  }\n\n  protected getTableColumn(): Column<T> {\n    return getListColumn(this.context.dataTable, this.property);\n  }\n\n  public getValue(): unknown {\n    return this.getTableColumnFilter()?.value ?? null;\n  }\n\n  /*\n   * Rebuilt only when TanStack hands out a new map: it memoizes the faceted\n   * values and replaces the map when the data changes. Without this, every\n   * row the filter function checks re-hashes every value — `getArrayValue()`\n   * resolves each stored id through `values`.\n   */\n  private getValuesFromTableState(): ListFilterValue<TRendered>[] {\n    const facets = this.getTableColumn().getFacetedUniqueValues();\n\n    if (this.valuesFromTableState?.facets !== facets) {\n      this.valuesFromTableState = {\n        facets,\n        values: unique(\n          Array.from(facets.keys())\n            .flatMap((v) => v)\n            .filter((v) => v !== undefined && v !== null),\n        ).map((v) => ListFilterValue.create(this, v)),\n      };\n    }\n\n    return this.valuesFromTableState.values;\n  }\n\n  private checkIfValueIsUnknown(value: ListFilterValue<TRendered>): boolean {\n    return !this.values.some((v) => v.id === value.id);\n  }\n\n  /**\n   * Drops a selection the data no longer offers — a stored filter value whose\n   * item is gone would otherwise filter everything away with no way to undo\n   * it.\n   */\n  public deleteUnknownFilterValues(): void {\n    /* Values the data offers are by definition known. */\n    if (this._values === undefined) {\n      return;\n    }\n\n    for (const currentValues of this.getArrayValue()) {\n      if (this.checkIfValueIsUnknown(currentValues)) {\n        this.deactivateValue(currentValues);\n      }\n    }\n  }\n\n  /**\n   * The values the filter offers — the ones it was given, or the ones the data\n   * has.\n   *\n   * Follows the table, not a snapshot. A binding that keeps one filter instance\n   * for the list's lifetime would otherwise hold the answer from before the\n   * first batch arrived: an async loader gives the header an empty menu and\n   * never fills it. The values are cached per faceted-values map, which\n   * TanStack replaces when the data changes.\n   */\n  public get values(): ListFilterValue<TRendered>[] {\n    return this._values ?? this.getValuesFromTableState();\n  }\n\n  public getArrayValue(): ListFilterValue<TRendered>[] {\n    const value = this.getValue();\n    return value === null\n      ? []\n      : toArray(value).map((v) => ListFilterValue.create(this, v));\n  }\n\n  public isValueActive(value: ListFilterValue<TRendered>): boolean {\n    return this.getArrayValue().some((v) => v.equals(value));\n  }\n\n  public isActive(): boolean {\n    return this.getArrayValue().length > 0;\n  }\n\n  public deactivateValue(value: ListFilterValue<TRendered>): void {\n    const currentValueAsArray = this.getArrayValue();\n\n    const updatedValue =\n      this.mode === \"all\" || this.mode === \"some\"\n        ? currentValueAsArray.filter((v) => !v.equals(value))\n        : null;\n\n    this.getTableColumn().setFilterValue(updatedValue);\n    this.callOnChangedHandlers(updatedValue);\n  }\n\n  private callOnChangedHandlers(\n    newValue: ListFilterValue<TRendered>[] | ListFilterValue<TRendered> | null,\n  ): void {\n    this.notifyFilterUpdated(toArray(newValue).map((v) => v?.value));\n  }\n\n  /** Tells the listeners — the list resetting its batches among them. */\n  protected notifyFilterUpdated(values: unknown[]): void {\n    this.onFilterChangeCallbacks.forEach((cb) => cb(values));\n  }\n\n  public hasChanges(): boolean {\n    const currentIds = this.getArrayValue().map((v) => v.id);\n\n    const defaultIds =\n      this.getStoredSelectedIds({ autosave: false }) ??\n      this.defaultSelectedValues?.map((v) => v.id) ??\n      [];\n\n    return (\n      currentIds.length !== defaultIds.length ||\n      difference(currentIds, defaultIds).length > 0\n    );\n  }\n\n  public isStoringAvailable(): boolean {\n    return !!this.context.settings && this.manualSave;\n  }\n\n  public resetValues(): void {\n    const storedValues =\n      this.getStoredSelectedValues({ autosave: false }) ??\n      this.defaultSelectedValues;\n\n    const resetTo =\n      storedValues ?? (this.mode === \"all\" || this.mode === \"some\" ? [] : null);\n\n    this.getTableColumn().setFilterValue(resetTo);\n    this.callOnChangedHandlers(resetTo);\n  }\n\n  public clear(): void {\n    this.getTableColumn().setFilterValue(null);\n    this.callOnChangedHandlers(null);\n  }\n\n  public toggleValue(newValue: ListFilterValue<TRendered>): void {\n    const currentValueAsArray = this.getArrayValue();\n\n    let updatedValue:\n      ListFilterValue<TRendered>[] | ListFilterValue<TRendered> | null;\n\n    if (this.mode === \"all\" || this.mode === \"some\") {\n      updatedValue = newValue.isActive\n        ? currentValueAsArray.filter((v) => !v.equals(newValue))\n        : [...currentValueAsArray, newValue];\n    } else {\n      updatedValue = newValue.isActive ? null : newValue;\n    }\n\n    this.getTableColumn().setFilterValue(updatedValue);\n    this.callOnChangedHandlers(updatedValue);\n  }\n\n  /**\n   * Whether the filter offers \"Select all\" — a `some` filter with enough\n   * values.\n   */\n  public get isSelectAllAvailable(): boolean {\n    return this.mode === \"some\" && this.values.length >= selectAllMinValueCount;\n  }\n\n  public isEveryValueActive(): boolean {\n    return this.values.every((v) => v.isActive);\n  }\n\n  public selectAll(): void {\n    this.setArrayValue(this.values);\n  }\n\n  /** Makes exactly these values active — what a multiple-selection menu reports. */\n  public setActiveValueIds(ids: Iterable<unknown>): void {\n    const idSet = new Set(ids);\n    this.setArrayValue(this.values.filter((v) => idSet.has(v.id)));\n  }\n\n  public deselectAll(): void {\n    this.setArrayValue([]);\n  }\n\n  private setArrayValue(value: ListFilterValue<TRendered>[]): void {\n    this.getTableColumn().setFilterValue(value);\n    this.callOnChangedHandlers(value);\n  }\n\n  public onFilterUpdated(cb: () => unknown): void {\n    this.onFilterChangeCallbacks.add(cb);\n  }\n}\n\nexport default ListFilter;\n"],"mappings":"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"}

package/dist/js/packages/components-base/src/list/filter/dateRange.mjs

@@ -1,27 +1,52 @@
 "use client"
 /* */
-import { CalendarDate } from "@internationalized/date";
+import { CalendarDate, CalendarDateTime, ZonedDateTime } from "@internationalized/date";
 import { DateTime } from "luxon";
 //#region ../components-base/src/list/filter/dateRange.ts
 /** A range needs both ends present to be one, even if either may be unset. */
 var isListDateRange = (value) => !!value && typeof value === "object" && "start" in value && "end" in value;
-var startOfDay = (date) => DateTime.fromObject({
+var hasTime = (date) => "hour" in date;
+/**
+* The date as a local point in time. A `ZonedDateTime` is the instant it names;
+* anything else is read field by field, since after crossing the remote
+* boundary a `CalendarDate` is a plain object.
+*/
+var listDateToDateTime = (date) => date instanceof ZonedDateTime ? DateTime.fromJSDate(date.toDate()) : DateTime.fromObject({
 	year: date.year,
 	month: date.month,
-	day: date.day
+	day: date.day,
+	...hasTime(date) ? {
+		hour: date.hour,
+		minute: date.minute,
+		second: date.second
+	} : {}
 });
 /**
+* Resolves a range 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 resolveListDateRange = (range) => {
+	const unit = (date) => hasTime(date) ? "minute" : "day";
+	return {
+		start: range.start ? listDateToDateTime(range.start).startOf(unit(range.start)).toJSDate() : void 0,
+		end: range.end ? listDateToDateTime(range.end).endOf(unit(range.end)).toJSDate() : void 0
+	};
+};
+/**
 * The cell's value as a point in time, or `undefined` when the filter does not
 * treat it as a date.
 *
-* Three shapes count, each on its own terms: a luxon `DateTime` and an ISO 8601
-* string are compared as the instant they name — a date-only string as the
-* start of its day — and a `CalendarDate` as its day. Anything else, a plain `{
-* year, month, day }` object included, is not a date here.
+* A luxon `DateTime` and an ISO 8601 string are compared as the instant they
+* name — a date-only string as the start of its day. A `CalendarDate` counts as
+* the start of its day, a `CalendarDateTime` as its local time and a
+* `ZonedDateTime` as its instant. Anything else, a plain `{ year, month, day }`
+* object included, is not a date here.
 */
 var toDateTime = (value) => {
 	if (value instanceof DateTime) return value;
-	if (value instanceof CalendarDate) return startOfDay(value);
+	if (value instanceof CalendarDate || value instanceof CalendarDateTime || value instanceof ZonedDateTime) return listDateToDateTime(value);
 	if (typeof value === "string") return DateTime.fromISO(value);
 };
 /**
@@ -35,10 +60,9 @@ var dateRangeFilterFn = (row, columnId, range) => {
 	if (!range) return true;
 	const dateValue = toDateTime(row.getValue(columnId));
 	if (!dateValue) return true;
-	const startDate = range.start ? startOfDay(range.start) : void 0;
-	const endDate = range.end ? startOfDay(range.end).endOf("day") : void 0;
-	if (startDate && dateValue < startDate) return false;
-	return !(endDate && dateValue > endDate);
+	const { start, end } = resolveListDateRange(range);
+	if (start && dateValue.toMillis() < start.getTime()) return false;
+	return !(end && dateValue.toMillis() > end.getTime());
 };
 /** Turns the column into one a date range filters. */
 var applyDateRangeColumnDef = (def) => {
@@ -46,6 +70,6 @@ var applyDateRangeColumnDef = (def) => {
 	def.filterFn = dateRangeFilterFn;
 };
 //#endregion
-export { applyDateRangeColumnDef, dateRangeFilterFn, isListDateRange };
+export { applyDateRangeColumnDef, dateRangeFilterFn, isListDateRange, listDateToDateTime, resolveListDateRange };
 
 //# sourceMappingURL=dateRange.mjs.map