@mezzanine-ui/react-hook-form - npm Package Compare versions

@mezzanine-ui/react-hook-form

Package Overview

Dependencies

Maintainers

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 0.15.4 to 0.15.5

AutoCompleteField/use-auto-complete-debounce.js

		@@ -1,58 +0,28 @@
		import { EventEmitter } from 'eventemitter3';
		import { useLayoutEffect, useEffect, useCallback } from 'react';
		import { useRef, useEffect } from 'react';
		import { useFormContext } from 'react-hook-form';
		import { Observable, debounceTime, tap } from 'rxjs';
		import { Subject, Observable, debounceTime, tap } from 'rxjs';
		import { isBrowser } from '../utils/type-checker.js';

		class AutoCompleteStore extends EventEmitter {
		constructor() {
		super(...arguments);
		this._observableMap = new Map();
		}
		add(id, value) {
		this.emit(`${AutoCompleteStore.Events.UPDATE}:${id}`, value);
		}
		watch(id) {
		const storedObservable = this._observableMap.get(id);
		const observable = storedObservable \|\| new Observable((subscriber) => {
		function onUpdate(nextData) {
		subscriber.next(nextData);
		}
		this.on(`${AutoCompleteStore.Events.UPDATE}:${id}`, onUpdate);
		});
		if (!storedObservable) {
		this._observableMap.set(id, observable);
		}
		return observable;
		}
		}
		AutoCompleteStore.Events = {
		UPDATE: 'E/UPDATE',
		};
		let autoCompleteStore;
		function useAutoCompleteDebounce({ registerName, debounceMs = 1200, disabledAutoClickAway = false, autoClickAwayDebounceMs = 1500, skip = false, onChange: onChangeProp, }, mode) {
		const emitter$ = useRef();
		const { setValue } = useFormContext();
		useLayoutEffect(() => {
		if (typeof autoCompleteStore === 'undefined' \|\| autoCompleteStore === undefined) {
		autoCompleteStore = new AutoCompleteStore();
		}
		}, []);
		useEffect(() => {
		if (!isBrowser())
		return;
		let inputObservable = autoCompleteStore.watch(registerName);
		emitter$.current = emitter$.current \|\| new Subject();
		let inputObservable$ = emitter$.current.asObservable();
		let clickAwaySubscription;
		let clickObservable = new Observable((subscriber) => {
		let clickObservable$ = new Observable((subscriber) => {
		subscriber.next();
		});
		if (!skip) {
		inputObservable = inputObservable.pipe(debounceTime(debounceMs));
		inputObservable$ = inputObservable$.pipe(debounceTime(debounceMs));
		/** 如果是多選，當選完 n 秒後沒動靜，自動關掉下拉選單 */
		if (mode === 'multiple' && !disabledAutoClickAway) {
		clickObservable = clickObservable.pipe(debounceTime(autoClickAwayDebounceMs));
		clickObservable$ = clickObservable$.pipe(debounceTime(autoClickAwayDebounceMs));
		}
		}
		const inputSubscription = inputObservable.pipe(tap(() => {
		const inputSubscription = inputObservable$.pipe(tap(() => {
		if (!skip) {
		clickAwaySubscription = clickObservable.subscribe(() => {
		clickAwaySubscription = clickObservable$.subscribe(() => {
		window.document.body.click(); // to click away list.
		@@ -69,6 +39,14 @@ });
		};
		}, [skip]);
		const onChange = useCallback((value) => {
		autoCompleteStore.add(registerName, value);
		}, []);
		}, [
		registerName,
		skip,
		debounceMs,
		disabledAutoClickAway,
		autoClickAwayDebounceMs,
		onChangeProp,
		]);
		const onChange = (value) => {
		var _a;
		(_a = emitter$.current) === null \|\| _a === void 0 ? void 0 : _a.next(value);
		};
		return onChange;
		@@ -75,0 +53,0 @@ }

package.json

		{
		"name": "@mezzanine-ui/react-hook-form",
		"version": "0.15.4",
		"version": "0.15.5",
		"description": "Form with data binding HOC for mezzanine-ui",
		@@ -5,0 +5,0 @@ "author": "mezzanine",

Worsened metrics