DynamicLoader

Pro class that owns range caching, preloading, debounce, and in-flight coordination for range-based event loading. It fetches events through injected transport code and dispatches provide-data batches back to the store. Constructing a loader makes it active; the boolean config form is not an enable/disable switch.

Usage

class DynamicLoader {
	constructor(config: DynamicLoadingConfig, infra: DynamicLoaderInfra);
	request(requestData: RequestDataAction): Promise<void>;
}

type DynamicLoadingConfig =
	| boolean
	| {
			debounce?: number;
			reset?: boolean;
			cache?: boolean | number;
			preload?: false | "day" | "month" | "year";
	  };

type DynamicLoaderInfra = {
	fetch(range: { startDate: Date; endDate: Date }): Promise<CalendarEvent[]>;
	dispatch(action: {
		data: { events: CalendarEvent[] };
		reset?: boolean;
	}): unknown;
};

true is shorthand for all defaults.

Option	Type	Default	Behavior
debounce	number	0	Delay processing and collapse a burst of ranges to its latest one.
reset	boolean	false	Add reset: true to every dispatched provide-data payload.
cache	boolean | number	true	true: no expiry; false: evict before every request; number: TTL in seconds.
preload	false | "day" | "month" | "year"	false	Widen both range edges to the local day, month, or year boundary before cache checks.

infra.fetch returns the events for a range; infra.dispatch pushes a provide-data payload. request() resolves once the range has been processed.

Example

<script setup>
  import { Calendar, DynamicLoader } from "@svar-ui/vue-calendar";

  function init(api) {
    const loader = new DynamicLoader(
      { preload: "month", cache: 300 },
      {
        fetch: ({ startDate, endDate }) => fetchEvents(startDate, endDate),
        dispatch: data => api.exec("provide-data", data),
      }
    );

    api.on("request-data", data => loader.request(data));
  }
</script>

<template>
  <Calendar :events="[]" :init="init" />
</template>

Related articles

• Dynamic Loading — the full range-loading pipeline and transport options.
• provide-data — the action the loader dispatches.
• request-data — the range notification the loader consumes.
• RestDataProvider — a transport adapter that accepts a loader.