From b662d917fe5e4eb4fce7dbde03ce749084ec8230 Mon Sep 17 00:00:00 2001 From: Collin Choy Date: Tue, 2 Apr 2024 16:22:29 -0400 Subject: [PATCH 1/2] Remove toValue shim --- src/useClickOutside/useClickOutside.ts | 3 +-- src/useEventListener/useEventListener.ts | 3 +-- src/useIntersectionObserver/useIntersectionObserver.ts | 3 +-- .../usePositionStickyObserver.ts | 5 ++--- src/utilities/vue.ts | 8 -------- 5 files changed, 5 insertions(+), 17 deletions(-) delete mode 100644 src/utilities/vue.ts diff --git a/src/useClickOutside/useClickOutside.ts b/src/useClickOutside/useClickOutside.ts index 088808ff..4bbbc899 100644 --- a/src/useClickOutside/useClickOutside.ts +++ b/src/useClickOutside/useClickOutside.ts @@ -1,7 +1,6 @@ -import { onScopeDispose } from 'vue' +import { onScopeDispose, toValue } from 'vue' import { MaybeRefOrGetter } from '@/types/maybe' import { useGlobalEventListener } from '@/useGlobalEventListener' -import { toValue } from '@/utilities/vue' type ClickOutsideEntry = { element: MaybeRefOrGetter, diff --git a/src/useEventListener/useEventListener.ts b/src/useEventListener/useEventListener.ts index 140ea792..b65d33d6 100644 --- a/src/useEventListener/useEventListener.ts +++ b/src/useEventListener/useEventListener.ts @@ -1,7 +1,6 @@ -import { ref, watch } from 'vue' +import { ref, watch, toValue } from 'vue' import { MaybeRefOrGetter } from '@/types/maybe' import { tryOnScopeDispose } from '@/utilities/tryOnScopeDispose' -import { toValue } from '@/utilities/vue' export type UseEventListener = { add: () => void, diff --git a/src/useIntersectionObserver/useIntersectionObserver.ts b/src/useIntersectionObserver/useIntersectionObserver.ts index d44b3ad4..5c809a7b 100644 --- a/src/useIntersectionObserver/useIntersectionObserver.ts +++ b/src/useIntersectionObserver/useIntersectionObserver.ts @@ -1,6 +1,5 @@ -import { onMounted, onUnmounted, ref, Ref, unref, watch } from 'vue' +import { onMounted, onUnmounted, ref, Ref, unref, watch, toValue } from 'vue' import { MaybeRef, MaybeRefOrGetter } from '@/types/maybe' -import { toValue } from '@/utilities/vue' export type UseIntersectionObserverResponse = { observe: (element: MaybeRefOrGetter) => void, diff --git a/src/usePositionStickyObserver/usePositionStickyObserver.ts b/src/usePositionStickyObserver/usePositionStickyObserver.ts index 77c63099..0ab84b07 100644 --- a/src/usePositionStickyObserver/usePositionStickyObserver.ts +++ b/src/usePositionStickyObserver/usePositionStickyObserver.ts @@ -1,7 +1,6 @@ -import { Ref, computed, ref, watch } from 'vue' +import { Ref, computed, ref, watch, toRef, toValue } from 'vue' import { MaybeRefOrGetter } from '@/types/maybe' import { useIntersectionObserver } from '@/useIntersectionObserver' -import { toValue } from '@/utilities/vue' export type UsePositionStickyObserverResponse = { stuck: Ref, @@ -21,7 +20,7 @@ export function usePositionStickyObserver( element: MaybeRefOrGetter, options?: MaybeRefOrGetter, ): UsePositionStickyObserverResponse { - const elementRef = computed(() => toValue(element)) + const elementRef = toRef(element) const stuck = ref(false) const observerOptions = computed(() => { diff --git a/src/utilities/vue.ts b/src/utilities/vue.ts deleted file mode 100644 index 48a70699..00000000 --- a/src/utilities/vue.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { unref } from 'vue' -import { MaybeRefOrGetter } from '@/types/maybe' -import { isFunction } from '@/utilities/functions' - -// temp shim for Vue 3.3^ function -export function toValue(source: MaybeRefOrGetter): T { - return isFunction(source) ? source() : unref(source) -} \ No newline at end of file From 7ea01b6060befc0d27e0b9b42c2f7f4013d20dfa Mon Sep 17 00:00:00 2001 From: Collin Choy Date: Tue, 2 Apr 2024 16:50:57 -0400 Subject: [PATCH 2/2] Prefer MaybeRef and MaybeRefOrGetter from vue. --- src/types/maybe.ts | 4 +--- src/useBoolean/useBoolean.ts | 3 +-- src/useClickOutside/useClickOutside.ts | 3 +-- src/useEventListener/useEventListener.ts | 3 +-- src/useIntersectionObserver/useIntersectionObserver.ts | 3 +-- src/useIsSame/useIsSame.ts | 3 +-- src/useKeyDown/useKeyDown.ts | 4 ++-- src/useNow/useNow.ts | 3 +-- src/usePositionStickyObserver/usePositionStickyObserver.ts | 3 +-- src/useScrollLinking/useScrollLinking.ts | 3 +-- src/useSubscription/types/subscription.ts | 2 +- src/useSubscription/useSubscriptionWithDependencies.ts | 3 +-- src/useValidation/useValidation.ts | 4 ++-- src/useVisibilityObserver/useVisibilityObserver.ts | 3 +-- 14 files changed, 16 insertions(+), 28 deletions(-) diff --git a/src/types/maybe.ts b/src/types/maybe.ts index 3825ec5e..6d2e3bc7 100644 --- a/src/types/maybe.ts +++ b/src/types/maybe.ts @@ -1,7 +1,5 @@ -import { Ref, UnwrapRef } from 'vue' +import { UnwrapRef } from 'vue' export type MaybePromise = T | Promise -export type MaybeRef = T | Ref export type MaybeUnwrapRef = T | UnwrapRef -export type MaybeRefOrGetter = MaybeRef | (() => T) export type MaybeArray = T | T[] \ No newline at end of file diff --git a/src/useBoolean/useBoolean.ts b/src/useBoolean/useBoolean.ts index fa70aa9a..91a3544e 100644 --- a/src/useBoolean/useBoolean.ts +++ b/src/useBoolean/useBoolean.ts @@ -1,5 +1,4 @@ -import { ref, Ref } from 'vue' -import { MaybeRef } from '@/types/maybe' +import { ref, Ref, MaybeRef } from 'vue' type UseBoolean = { value: Ref, diff --git a/src/useClickOutside/useClickOutside.ts b/src/useClickOutside/useClickOutside.ts index 4bbbc899..3b7e4535 100644 --- a/src/useClickOutside/useClickOutside.ts +++ b/src/useClickOutside/useClickOutside.ts @@ -1,5 +1,4 @@ -import { onScopeDispose, toValue } from 'vue' -import { MaybeRefOrGetter } from '@/types/maybe' +import { MaybeRefOrGetter, onScopeDispose, toValue } from 'vue' import { useGlobalEventListener } from '@/useGlobalEventListener' type ClickOutsideEntry = { diff --git a/src/useEventListener/useEventListener.ts b/src/useEventListener/useEventListener.ts index b65d33d6..75f4aa1f 100644 --- a/src/useEventListener/useEventListener.ts +++ b/src/useEventListener/useEventListener.ts @@ -1,5 +1,4 @@ -import { ref, watch, toValue } from 'vue' -import { MaybeRefOrGetter } from '@/types/maybe' +import { ref, watch, toValue, MaybeRefOrGetter } from 'vue' import { tryOnScopeDispose } from '@/utilities/tryOnScopeDispose' export type UseEventListener = { diff --git a/src/useIntersectionObserver/useIntersectionObserver.ts b/src/useIntersectionObserver/useIntersectionObserver.ts index 5c809a7b..d7ff83e1 100644 --- a/src/useIntersectionObserver/useIntersectionObserver.ts +++ b/src/useIntersectionObserver/useIntersectionObserver.ts @@ -1,5 +1,4 @@ -import { onMounted, onUnmounted, ref, Ref, unref, watch, toValue } from 'vue' -import { MaybeRef, MaybeRefOrGetter } from '@/types/maybe' +import { onMounted, onUnmounted, ref, Ref, unref, watch, toValue, MaybeRef, MaybeRefOrGetter } from 'vue' export type UseIntersectionObserverResponse = { observe: (element: MaybeRefOrGetter) => void, diff --git a/src/useIsSame/useIsSame.ts b/src/useIsSame/useIsSame.ts index 6ddf9c93..ef356030 100644 --- a/src/useIsSame/useIsSame.ts +++ b/src/useIsSame/useIsSame.ts @@ -1,5 +1,4 @@ -import { computed, ComputedRef, ref } from 'vue' -import { MaybeRef } from '@/types/maybe' +import { computed, ComputedRef, ref, MaybeRef } from 'vue' import { isSame } from '@/utilities/isSame' export function useIsSame(valueA: MaybeRef, valueB: MaybeRef): ComputedRef { diff --git a/src/useKeyDown/useKeyDown.ts b/src/useKeyDown/useKeyDown.ts index ae43e60d..d27c1787 100644 --- a/src/useKeyDown/useKeyDown.ts +++ b/src/useKeyDown/useKeyDown.ts @@ -1,5 +1,5 @@ -import { ComputedRef, computed, reactive, unref } from 'vue' -import { MaybeArray, MaybeRef } from '@/types/maybe' +import { ComputedRef, computed, reactive, unref, MaybeRef } from 'vue' +import { MaybeArray } from '@/types/maybe' import { asArray } from '@/utilities/arrays' import { tryOnScopeDispose } from '@/utilities/tryOnScopeDispose' diff --git a/src/useNow/useNow.ts b/src/useNow/useNow.ts index 7d35f853..7b0c5477 100644 --- a/src/useNow/useNow.ts +++ b/src/useNow/useNow.ts @@ -1,5 +1,4 @@ -import { ref, Ref } from 'vue' -import { MaybeRef } from '@/types/maybe' +import { ref, Ref, MaybeRef } from 'vue' import { tryOnScopeDispose } from '@/utilities/tryOnScopeDispose' export type UseNow = { diff --git a/src/usePositionStickyObserver/usePositionStickyObserver.ts b/src/usePositionStickyObserver/usePositionStickyObserver.ts index 0ab84b07..5df03d44 100644 --- a/src/usePositionStickyObserver/usePositionStickyObserver.ts +++ b/src/usePositionStickyObserver/usePositionStickyObserver.ts @@ -1,5 +1,4 @@ -import { Ref, computed, ref, watch, toRef, toValue } from 'vue' -import { MaybeRefOrGetter } from '@/types/maybe' +import { Ref, computed, ref, watch, toRef, toValue, MaybeRefOrGetter } from 'vue' import { useIntersectionObserver } from '@/useIntersectionObserver' export type UsePositionStickyObserverResponse = { diff --git a/src/useScrollLinking/useScrollLinking.ts b/src/useScrollLinking/useScrollLinking.ts index dc92b440..c67da22a 100644 --- a/src/useScrollLinking/useScrollLinking.ts +++ b/src/useScrollLinking/useScrollLinking.ts @@ -1,5 +1,4 @@ -import { onMounted, onUnmounted, ref, Ref } from 'vue' -import { MaybeRef } from '@/types/maybe' +import { onMounted, onUnmounted, ref, Ref, MaybeRef } from 'vue' type DisconnectScrollLink = () => void type UseScrollLinking = { diff --git a/src/useSubscription/types/subscription.ts b/src/useSubscription/types/subscription.ts index 1d9c7183..c9843d38 100644 --- a/src/useSubscription/types/subscription.ts +++ b/src/useSubscription/types/subscription.ts @@ -1,4 +1,4 @@ -import { MaybeRef } from '@/types/maybe' +import { MaybeRef } from 'vue' import { SubscriptionManager } from '@/useSubscription/models/manager' import { Subscription } from '@/useSubscription/models/subscription' import { Action, ActionArguments, ActionParamsRequired, ActionResponse } from '@/useSubscription/types/action' diff --git a/src/useSubscription/useSubscriptionWithDependencies.ts b/src/useSubscription/useSubscriptionWithDependencies.ts index 636453d4..ec602ef6 100644 --- a/src/useSubscription/useSubscriptionWithDependencies.ts +++ b/src/useSubscription/useSubscriptionWithDependencies.ts @@ -1,6 +1,5 @@ import isEqual from 'lodash.isequal' -import { reactive, ref, Ref, toRaw, watch } from 'vue' -import { MaybeRef } from '@/types/maybe' +import { reactive, ref, Ref, toRaw, watch, MaybeRef } from 'vue' import { Action, SubscriptionOptions, UseSubscription, ActionArguments, MappedSubscription } from '@/useSubscription/types' import { useSubscription } from '@/useSubscription/useSubscription' diff --git a/src/useValidation/useValidation.ts b/src/useValidation/useValidation.ts index d5cf7c11..0dd7ce22 100644 --- a/src/useValidation/useValidation.ts +++ b/src/useValidation/useValidation.ts @@ -1,6 +1,6 @@ -import { computed, onMounted, onUnmounted, reactive, ref, ToRefs, watch, unref, Ref, WatchStopHandle, toRef } from 'vue' +import { computed, onMounted, onUnmounted, reactive, ref, ToRefs, watch, unref, Ref, MaybeRef, MaybeRefOrGetter, WatchStopHandle, toRef } from 'vue' import { NoInfer } from '@/types/generics' -import { MaybeArray, MaybePromise, MaybeRefOrGetter, MaybeRef } from '@/types/maybe' +import { MaybeArray, MaybePromise } from '@/types/maybe' import { isValidationAbortedError } from '@/useValidation/ValidationAbortedError' import { ValidationRuleExecutor } from '@/useValidation/ValidationExecutor' import { ValidationObserverUnregister, VALIDATION_OBSERVER_INJECTION_KEY } from '@/useValidationObserver/useValidationObserver' diff --git a/src/useVisibilityObserver/useVisibilityObserver.ts b/src/useVisibilityObserver/useVisibilityObserver.ts index f3b3f64d..a858b125 100644 --- a/src/useVisibilityObserver/useVisibilityObserver.ts +++ b/src/useVisibilityObserver/useVisibilityObserver.ts @@ -1,5 +1,4 @@ -import { computed, onMounted, ref, Ref } from 'vue' -import { MaybeRef } from '@/types/maybe' +import { computed, onMounted, ref, Ref, MaybeRef } from 'vue' import { useIntersectionObserver, UseIntersectionObserverOptions } from '@/useIntersectionObserver' export type UseVisibilityObserverResponse = {