import { reactive, ref, computed, watch, unref } from 'vue'

interface UseSectionOption {}

const useSection = <T>(option?: UseSectionOption) => {
  const selectedList: T[] = reactive([])

  const hasSelected = computed(() => {
    return selectedList.length > 0
  })

  const onSectionChange = (data: T[]) => {
    selectedList.splice(0)
    selectedList.push(...data)
  }
  return {
    hasSelected,
    selectedList,
    onSectionChange,
  }
}

export default useSection
