fix: vars name

Author: teleskop150750

packages/vue-primitives/src/collection/stories/DynamicInsertion.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { shallowRef } from 'vue'
-import { ITEM_DATA_ATTR } from '../index.ts'
+import { DATA_COLLECTION_ITEM } from '../index.ts'
 import Item from './item.vue'
 import List from './List.vue'
 import LogItems from './LogItems.vue'
@@ -13,7 +13,7 @@ function setHasTomato(value: boolean) {
 }
 
 function log() {
-  console.warn('Items:', Array.from(document.querySelectorAll(`[${ITEM_DATA_ATTR}]`)))
+  console.warn('Items:', Array.from(document.querySelectorAll(`[${DATA_COLLECTION_ITEM}]`)))
 }
 </script>
 

packages/vue-primitives/src/collection/stories/item.vue

@@ -2,7 +2,7 @@
 import { useAttrs } from 'vue'
 import { useComposedElements } from '../../hooks/useComposedElements.ts'
 import { isPropFalsy } from '../../utils/is.ts'
-import { ITEM_DATA_ATTR } from '../Collection.ts'
+import { DATA_COLLECTION_ITEM } from '../Collection.ts'
 import { Collection, type ItemData } from './utils.ts'
 
 const attrs = useAttrs()
@@ -19,7 +19,7 @@ const composedElements = useComposedElements((v) => {
     :style="{
       opacity: !isPropFalsy($attrs.disabled) ? 0.3 : undefined,
     }"
-    :[ITEM_DATA_ATTR]="true"
+    :[DATA_COLLECTION_ITEM]="true"
   >
     <slot />
   </li>

packages/vue-primitives/src/hooks/index.ts

@@ -4,6 +4,6 @@ export { useControllableState } from './useControllableState.ts'
 export { useEscapeKeydown } from './useEscapeKeydown.ts'
 export { useForwardElement } from './useForwardElement.ts'
 export { useId } from './useId.ts'
-export { type MutableRefObject, useRef } from './useRef.ts'
+export { type MutableRefObject, type RefObject, useRef } from './useRef.ts'
 export { useSize } from './useSize.ts'
 export { useStateMachine } from './useStateMachine.ts'

packages/vue-primitives/src/hooks/useControllableState.ts

@@ -81,21 +81,23 @@ export function useControllableStateV2<T, V = Exclude<T, undefined>>(
   const proxy = shallowRef<V>(getValue())
   let isUpdating = false
 
-  watch(
-    prop,
-    (v) => {
-      if (!isUpdating) {
-        isUpdating = true
-        ; (proxy as any).value = v
-        nextTick(() => isUpdating = false)
-      }
-    },
-  )
+  if (prop) {
+    watch(
+      prop,
+      (v) => {
+        if (!isUpdating) {
+          isUpdating = true
+          ; (proxy as any).value = v
+          nextTick(() => isUpdating = false)
+        }
+      },
+    )
+  }
 
   watch(
     proxy,
     (v) => {
-      if (!isUpdating && (v !== prop()))
+      if (!isUpdating && (v !== prop?.()))
         onChange?.(v)
     },
   )

packages/vue-primitives/src/hooks/useRef.ts

@@ -1,7 +1,13 @@
 import type { IfAny } from '@vue/shared'
 import type { Ref } from 'vue'
 
-export interface MutableRefObject<T> { current: T }
+export interface MutableRefObject<T> {
+  current: T
+}
+
+export interface RefObject<T> {
+  readonly current: T | null
+}
 
 export function useRef<T>(value: T): Ref extends T
   ? T extends Ref