@octabits-io/nuxt-ui-kit 0.2.0

package/dist/ai/index.js

@@ -0,0 +1,389 @@
+import { computed, onMounted, onScopeDispose, ref, shallowRef, toValue, watch } from "vue";
+//#region src/ai/types.ts
+const TERMINAL_STATUSES = [
+	"completed",
+	"failed",
+	"cancelled"
+];
+function isTerminalStatus(status) {
+	return TERMINAL_STATUSES.includes(status);
+}
+function isActiveStatus(status) {
+	return status === "pending" || status === "running";
+}
+//#endregion
+//#region src/ai/interval.ts
+/**
+* Minimal pausable interval — avoids a @vueuse/core peer for one helper.
+* Not auto-disposed; callers pause it in their own teardown.
+*/
+function createPausableInterval(fn, ms) {
+	let timer;
+	const isActive = ref(false);
+	function resume() {
+		if (timer) return;
+		isActive.value = true;
+		timer = setInterval(() => void fn(), ms);
+	}
+	function pause() {
+		if (timer) {
+			clearInterval(timer);
+			timer = void 0;
+		}
+		isActive.value = false;
+	}
+	return {
+		pause,
+		resume,
+		isActive
+	};
+}
+//#endregion
+//#region src/ai/useAiWorkflow.ts
+/**
+* Poll-driven AI-workflow state: `start(pollFn)` fetches immediately and then
+* polls until the workflow reaches a terminal status, firing the matching
+* callback. The poll function is injected — the engine is transport-agnostic.
+*/
+function useAiWorkflow(options = {}) {
+	const { interval = 2e3, onCompleted, onFailed, onCancelled } = options;
+	const workflow = shallowRef(null);
+	const isLoading = ref(false);
+	let activePollFn = null;
+	const status = computed(() => workflow.value?.status ?? null);
+	const isCompleted = computed(() => status.value === "completed");
+	const isFailed = computed(() => status.value === "failed");
+	const isCancelled = computed(() => status.value === "cancelled");
+	const isTerminal = computed(() => status.value != null && isTerminalStatus(status.value));
+	const isActive = computed(() => status.value != null && isActiveStatus(status.value));
+	const output = computed(() => workflow.value?.output ?? null);
+	const error = computed(() => workflow.value?.error ?? null);
+	const progress = computed(() => {
+		if (!workflow.value || workflow.value.totalSteps === 0) return 0;
+		return workflow.value.completedSteps / workflow.value.totalSteps;
+	});
+	async function poll() {
+		if (!activePollFn) return;
+		try {
+			const data = await activePollFn();
+			if (!data) return;
+			workflow.value = data;
+			if (isTerminalStatus(data.status)) {
+				stopPolling();
+				if (data.status === "completed") onCompleted?.(data);
+				else if (data.status === "failed") onFailed?.(data);
+				else if (data.status === "cancelled") onCancelled?.(data);
+			}
+		} catch {}
+	}
+	const { pause: stopPolling, resume: resumePolling, isActive: isPolling } = createPausableInterval(poll, interval);
+	function start(pollFn) {
+		activePollFn = pollFn;
+		isLoading.value = true;
+		pollFn().then((data) => {
+			if (data) workflow.value = data;
+			isLoading.value = false;
+			if (!data || !isTerminalStatus(data.status)) resumePolling();
+			else if (data.status === "completed") onCompleted?.(data);
+			else if (data.status === "failed") onFailed?.(data);
+			else if (data.status === "cancelled") onCancelled?.(data);
+		}).catch(() => {
+			isLoading.value = false;
+		});
+	}
+	function stop() {
+		stopPolling();
+		activePollFn = null;
+	}
+	async function cancel(cancelFn) {
+		try {
+			await cancelFn();
+			await poll();
+		} catch {}
+	}
+	async function refresh() {
+		if (activePollFn) {
+			isLoading.value = true;
+			try {
+				await poll();
+			} finally {
+				isLoading.value = false;
+			}
+		}
+	}
+	function setWorkflow(data) {
+		workflow.value = data;
+	}
+	onScopeDispose(() => {
+		stop();
+	});
+	return {
+		workflow,
+		isLoading,
+		isPolling,
+		status,
+		progress,
+		isCompleted,
+		isFailed,
+		isCancelled,
+		isTerminal,
+		isActive,
+		output,
+		error,
+		start,
+		stop,
+		cancel,
+		refresh,
+		setWorkflow
+	};
+}
+//#endregion
+//#region src/ai/useAiWorkflowGuard.ts
+/**
+* useAiWorkflow plus a mount-time re-hydration check (resume polling a
+* workflow that is already running) and a `trigger` that refuses to start a
+* duplicate while one is active. All transport is injected.
+*/
+function useAiWorkflowGuard(options) {
+	const { checkFn, pollFn, ...workflowOptions } = options;
+	const ai = useAiWorkflow(workflowOptions);
+	const isChecking = ref(true);
+	onMounted(async () => {
+		try {
+			const existing = await checkFn();
+			if (existing && isActiveStatus(existing.status)) {
+				ai.setWorkflow(existing);
+				ai.start(pollFn);
+			} else if (existing) ai.setWorkflow(existing);
+		} catch {} finally {
+			isChecking.value = false;
+		}
+	});
+	/**
+	* Trigger a new workflow. Calls the provided trigger function,
+	* then starts polling with the configured pollFn.
+	* Returns false if a workflow is already active.
+	*/
+	async function trigger(triggerFn) {
+		if (ai.isActive.value) return false;
+		try {
+			await triggerFn();
+			ai.start(pollFn);
+			return true;
+		} catch {
+			return false;
+		}
+	}
+	return {
+		...ai,
+		isChecking,
+		trigger
+	};
+}
+//#endregion
+//#region src/ai/progressCore.ts
+/**
+* Cross-page AI-workflow progress tracking — the setup body of an app's
+* progress store (`defineStore('ai-progress', () => createAiProgressCore(…))`).
+* Tracks triggered workflows, polls the active ones through the injected
+* fetch, and exposes `completionSignal` / `appliedSignal` counters pages watch
+* to refresh their data. The dialog-request channel is generic over the app's
+* request shape (typically `{ definition, entityId?, entityRef?, workflowId? }`).
+*/
+function createAiProgressCore(options) {
+	const intervalMs = options.intervalMs ?? 3e3;
+	const trackedWorkflows = ref([]);
+	const dialogRequest = ref(null);
+	/** Bumps whenever a tracked workflow transitions to terminal status. Watch this to refresh history. */
+	const completionSignal = ref(0);
+	/** Bumps whenever workflow results are applied (from float or sidebar). Watch this to reload page data. */
+	const appliedSignal = ref(0);
+	const activeWorkflows = computed(() => trackedWorkflows.value.filter((w) => !w.dismissed));
+	const hasActive = computed(() => trackedWorkflows.value.some((w) => !isTerminalStatus(w.status)));
+	function track(workflowId, workflowType, entityRef, entityId) {
+		if (trackedWorkflows.value.some((w) => w.workflowId === workflowId)) return;
+		trackedWorkflows.value.push({
+			workflowId,
+			workflowType,
+			entityRef,
+			entityId,
+			status: "pending",
+			progress: 0,
+			totalSteps: 0,
+			completedSteps: 0,
+			dismissed: false
+		});
+	}
+	function dismiss(workflowId) {
+		const w = trackedWorkflows.value.find((w) => w.workflowId === workflowId);
+		if (w) w.dismissed = true;
+	}
+	/** Mark a workflow as applied and signal listeners to reload data. */
+	function markApplied(workflowId) {
+		dismiss(workflowId);
+		appliedSignal.value++;
+	}
+	function untrack(workflowId) {
+		trackedWorkflows.value = trackedWorkflows.value.filter((w) => w.workflowId !== workflowId);
+	}
+	/** Find a tracked workflow by entityRef (for inline status display) */
+	function getByEntityRef(entityRef) {
+		return trackedWorkflows.value.find((w) => w.entityRef === entityRef && !w.dismissed);
+	}
+	async function pollActive() {
+		const active = trackedWorkflows.value.filter((w) => !isTerminalStatus(w.status));
+		if (active.length === 0) return;
+		for (const tracked of active) try {
+			const workflow = await options.fetchWorkflowStatus(tracked.workflowId);
+			if (!workflow) continue;
+			const wasActive = !isTerminalStatus(tracked.status);
+			tracked.status = workflow.status;
+			tracked.totalSteps = workflow.totalSteps;
+			tracked.completedSteps = workflow.completedSteps;
+			tracked.progress = workflow.totalSteps > 0 ? workflow.completedSteps / workflow.totalSteps * 100 : 0;
+			if (wasActive && isTerminalStatus(workflow.status)) completionSignal.value++;
+		} catch {}
+	}
+	const { pause, resume } = createPausableInterval(pollActive, intervalMs);
+	watch(hasActive, (active) => {
+		if (active) resume();
+		else pause();
+	});
+	watch(trackedWorkflows, () => {
+		if (hasActive.value) resume();
+	}, { deep: true });
+	function openDialog(request) {
+		dialogRequest.value = request;
+	}
+	function closeDialog() {
+		dialogRequest.value = null;
+	}
+	function reset() {
+		trackedWorkflows.value = [];
+		completionSignal.value = 0;
+		appliedSignal.value = 0;
+		dialogRequest.value = null;
+		pause();
+	}
+	return {
+		trackedWorkflows,
+		activeWorkflows,
+		hasActive,
+		completionSignal,
+		appliedSignal,
+		dialogRequest,
+		track,
+		dismiss,
+		markApplied,
+		untrack,
+		getByEntityRef,
+		openDialog,
+		closeDialog,
+		pollActive,
+		reset
+	};
+}
+//#endregion
+//#region src/ai/useAiCardState.ts
+/**
+* Shared state machine for AI trigger/suggestion cards. Derives the card
+* phase from the workflow tracked in the (injected) progress store for the
+* given entityRef.
+*/
+function useAiCardState(store, entityRef, hasActiveWorkflow) {
+	const trackedWorkflow = computed(() => store.getByEntityRef(toValue(entityRef)));
+	const cardState = computed(() => {
+		const tracked = trackedWorkflow.value;
+		if (tracked) {
+			if (isActiveStatus(tracked.status)) return "active";
+			if (tracked.status === "failed") return "failed";
+		}
+		if (toValue(hasActiveWorkflow)) return "active";
+		return "idle";
+	});
+	const failedWorkflow = computed(() => {
+		const tracked = trackedWorkflow.value;
+		return tracked?.status === "failed" ? tracked : null;
+	});
+	function dismissFailure() {
+		if (failedWorkflow.value) store.dismiss(failedWorkflow.value.workflowId);
+	}
+	return {
+		trackedWorkflow,
+		cardState,
+		failedWorkflow,
+		dismissFailure
+	};
+}
+//#endregion
+//#region src/ai/useActiveAiWorkflowProbe.ts
+/**
+* "Is something already running for this entity?" probe: checks on mount and
+* whenever the entity changes, then polls while active so trigger buttons can
+* disable themselves. Transport is injected.
+*/
+function useActiveAiWorkflowProbe(options) {
+	const hasActive = ref(false);
+	const isChecking = ref(false);
+	async function refresh() {
+		const ref_ = toValue(options.entityRef);
+		if (!ref_) return;
+		isChecking.value = true;
+		try {
+			const result = await options.fetchHasActive(ref_);
+			if (result !== null) hasActive.value = result;
+		} catch {} finally {
+			isChecking.value = false;
+		}
+	}
+	const { pause, resume } = createPausableInterval(refresh, options.intervalMs ?? 3e3);
+	watch(hasActive, (active) => {
+		if (active) resume();
+		else pause();
+	});
+	watch(() => toValue(options.entityRef), () => {
+		hasActive.value = false;
+		refresh();
+	});
+	onMounted(() => {
+		refresh();
+	});
+	onScopeDispose(() => {
+		pause();
+	});
+	return {
+		hasActive,
+		isChecking,
+		refresh
+	};
+}
+//#endregion
+//#region src/ai/registry.ts
+function createWorkflowRegistry(options = {}) {
+	const registry = /* @__PURE__ */ new Map();
+	function register(definition) {
+		registry.set(definition.type, definition);
+	}
+	function get(type) {
+		return registry.get(type);
+	}
+	function getAll() {
+		return Array.from(registry.values());
+	}
+	/** Human label for a type: definition labelKey → extra fallback key → raw type. */
+	function getLabel(type, t) {
+		const def = registry.get(type);
+		if (def) return t(def.labelKey);
+		const extraKey = options.extraLabelKeys?.[type];
+		if (extraKey) return t(extraKey);
+		return type;
+	}
+	return {
+		register,
+		get,
+		getAll,
+		getLabel
+	};
+}
+//#endregion
+export { createAiProgressCore, createWorkflowRegistry, isActiveStatus, isTerminalStatus, useActiveAiWorkflowProbe, useAiCardState, useAiWorkflow, useAiWorkflowGuard };

package/dist/dates/index.d.ts

@@ -0,0 +1,42 @@
+import { Ref } from "vue";
+//#region src/dates/index.d.ts
+/** ISO (`YYYY-MM-DD`) date range. Whether `end` is inclusive is the caller's convention. */
+interface Period {
+  start: string;
+  end: string;
+}
+/**
+ * Number of days in a period, **inclusive** of both endpoints.
+ * Example: `{ start: "2025-01-01", end: "2025-01-03" }` → 3 days.
+ */
+declare function calculateDays(period: Period): number;
+/** Shift an ISO date string by n days; `''` stays `''`. */
+declare function shiftIso(iso: string, days: number): string;
+/**
+ * Converts between ISO date strings (start/end) and Date arrays.
+ * Useful for bridging separate start/end date inputs with range picker components.
+ */
+declare function useDateRangeInput(startRef: Ref<string | undefined>, endRef: Ref<string | undefined>): {
+  dateRange: import("vue").WritableComputedRef<Date[], Date[]>;
+  dayCount: import("vue").ComputedRef<number>;
+};
+interface DateFormatterOptions {
+  /** Read the active locale code (e.g. from vue-i18n's `locale.value`). */
+  getLocale: () => string;
+}
+/**
+ * Locale-aware date/time/currency formatting — the engine of an app-side
+ * `useDateFormat()` composable (`createDateFormatter({ getLocale: () =>
+ * locale.value })`). Inject the locale getter; no i18n dependency here.
+ */
+declare function createDateFormatter(options: DateFormatterOptions): {
+  formatDate: (dateStr: string) => string;
+  formatDateMedium: (dateStr: string) => string;
+  formatDateTime: (dateStr: string) => string;
+  formatCheckoutDate: (endDate: string, checkOutNextDay?: boolean) => string;
+  formatTimeFromString: (timeStr: string) => string;
+  formatCurrency: (amount: number, currencyCode: string) => string;
+};
+type DateFormatter = ReturnType<typeof createDateFormatter>;
+//#endregion
+export { DateFormatter, DateFormatterOptions, Period, calculateDays, createDateFormatter, shiftIso, useDateRangeInput };

package/dist/dates/index.js

@@ -0,0 +1,108 @@
+import { computed } from "vue";
+import { addDays, differenceInDays, eachDayOfInterval, format, parseISO } from "date-fns";
+//#region src/dates/index.ts
+/**
+* Number of days in a period, **inclusive** of both endpoints.
+* Example: `{ start: "2025-01-01", end: "2025-01-03" }` → 3 days.
+*/
+function calculateDays(period) {
+	return differenceInDays(new Date(period.end), new Date(period.start)) + 1;
+}
+/** Shift an ISO date string by n days; `''` stays `''`. */
+function shiftIso(iso, days) {
+	if (!iso || days === 0) return iso;
+	try {
+		return format(addDays(parseISO(iso), days), "yyyy-MM-dd");
+	} catch {
+		return iso;
+	}
+}
+/**
+* Converts between ISO date strings (start/end) and Date arrays.
+* Useful for bridging separate start/end date inputs with range picker components.
+*/
+function useDateRangeInput(startRef, endRef) {
+	const dateRange = computed({
+		get() {
+			if (!startRef.value || !endRef.value) return [];
+			try {
+				return eachDayOfInterval({
+					start: parseISO(startRef.value),
+					end: parseISO(endRef.value)
+				});
+			} catch {
+				return [];
+			}
+		},
+		set(dates) {
+			if (!dates || dates.length === 0) {
+				startRef.value = void 0;
+				endRef.value = void 0;
+				return;
+			}
+			const sorted = [...dates].sort((a, b) => a.getTime() - b.getTime());
+			startRef.value = format(sorted[0], "yyyy-MM-dd");
+			endRef.value = format(sorted[sorted.length - 1], "yyyy-MM-dd");
+		}
+	});
+	return {
+		dateRange,
+		dayCount: computed(() => dateRange.value.length)
+	};
+}
+/**
+* Locale-aware date/time/currency formatting — the engine of an app-side
+* `useDateFormat()` composable (`createDateFormatter({ getLocale: () =>
+* locale.value })`). Inject the locale getter; no i18n dependency here.
+*/
+function createDateFormatter(options) {
+	const locale = () => options.getLocale();
+	function formatDate(dateStr) {
+		return new Date(dateStr).toLocaleDateString(locale());
+	}
+	function formatDateMedium(dateStr) {
+		const date = new Date(dateStr);
+		if (Number.isNaN(date.getTime())) return "";
+		return date.toLocaleDateString(locale(), {
+			month: "short",
+			day: "numeric",
+			year: "numeric"
+		});
+	}
+	/** Customer-facing checkout date: the day after the (inclusive) last booked day. */
+	function formatCheckoutDate(endDate, checkOutNextDay = true) {
+		const daysToAdd = checkOutNextDay ? 1 : 0;
+		return addDays(new Date(endDate), daysToAdd).toLocaleDateString(locale());
+	}
+	function formatTimeFromString(timeStr) {
+		const [hours, minutes] = timeStr.split(":").map(Number);
+		const date = /* @__PURE__ */ new Date();
+		date.setHours(hours, minutes, 0, 0);
+		return date.toLocaleTimeString(locale(), {
+			hour: "numeric",
+			minute: "2-digit"
+		});
+	}
+	function formatCurrency(amount, currencyCode) {
+		return new Intl.NumberFormat(locale(), {
+			style: "currency",
+			currency: currencyCode
+		}).format(amount);
+	}
+	function formatDateTime(dateStr) {
+		return new Date(dateStr).toLocaleString(locale(), {
+			dateStyle: "medium",
+			timeStyle: "short"
+		});
+	}
+	return {
+		formatDate,
+		formatDateMedium,
+		formatDateTime,
+		formatCheckoutDate,
+		formatTimeFromString,
+		formatCurrency
+	};
+}
+//#endregion
+export { calculateDays, createDateFormatter, shiftIso, useDateRangeInput };