UNPKG

@goaltime/timescape

Version:

A flexible, headless date and time input library for JavaScript. Provides tools for building fully customizable date and time input fields, with support for libraries like React, Preact, Vue, Svelte and Solid.

68 lines (66 loc) 1.97 kB
import { $NOW, TimescapeManager, marry } from "./chunk-D4WPLDQ2.js"; // src/integrations/vue.ts import { onUnmounted, ref, watchEffect } from "vue"; var useTimescape = (options = {}) => { const optionsRef = ref(options); const { date, ...rest } = options; const manager = new TimescapeManager(date, rest); manager.on("changeDate", (nextDate) => { optionsRef.value.date = nextDate; }); watchEffect(() => { manager.date = optionsRef.value.date; manager.minDate = optionsRef.value.minDate; manager.maxDate = optionsRef.value.maxDate; manager.digits = optionsRef.value.digits; manager.wrapAround = optionsRef.value.wrapAround; manager.hour12 = optionsRef.value.hour12; manager.snapToStep = optionsRef.value.snapToStep; manager.wheelControl = optionsRef.value.wheelControl; manager.disallowPartial = optionsRef.value.disallowPartial; }); onUnmounted(() => manager.remove()); return { _manager: manager, registerElement: (type) => (element) => element instanceof HTMLInputElement && manager.registerElement(element, type), registerSelect: (type) => (element) => element instanceof HTMLSelectElement && manager.registerSelect(element, type), registerRoot: () => (element) => { element instanceof HTMLElement && manager.registerRoot(element); }, options: optionsRef }; }; var useTimescapeRange = (options = {}) => { const from = useTimescape(options.from); const to = useTimescape(options.to); marry(from._manager, to._manager); return { registerRangeRoot: () => (element) => { if (element instanceof HTMLElement) { from._manager.registerRoot(element); to._manager.registerRoot(element); } }, from: { registerElement: from.registerElement, options: from.options }, to: { registerElement: to.registerElement, options: to.options } }; }; export { $NOW, useTimescape, useTimescapeRange };