createStoreItem.ts

import { readonly, ref } from 'vue'

import type { Ref } from 'vue'

type StoreItem<N extends string, T> = {
  readonly [K in N]: Readonly<Ref<T>>
} & {
  readonly [K in `set${Capitalize<N>}`]: (value: T) => void
}

export const createStoreItem = <N extends string, T>(name: N, initialValue: T) => {
  const store = ref<T>(initialValue)
  function setter(value: T) {
    store.value = value
  }

  return {
    [name]: readonly(store),
    [`set${name.charAt(0).toLocaleUpperCase()}${name.slice(1)}`]: setter,
  } as StoreItem<N, T>
}