import type { PropType} from 'vue';
import { defineComponent, onMounted, ref } from 'vue'

import { tools } from '@src/store/Modules/tools'
import { shared_consts } from '@src/common/shared_vuejs'
import { emit } from 'process'
import type { IAnim } from '@src/model'

export default defineComponent({
  name: 'CSelectAnimation',
  emits: ['update:modelValue'],
  props: {
    modelValue: {
      type: Object as PropType<IAnim | string | undefined>,
      required: false,
      default : () => {
        return {name: '', clduration: '', cldelay: '', timingtype: 'ease-in-out'}
      }
    },
    label: {
      type: String,
      required: false,
      default: '',
    },
  },

  setup(props, { emit }) {

    const myclass = ref('')
    const myrec = ref(<IAnim>{name: '', clduration: '', cldelay: ''})

    function updateClass() {
      if (typeof props.modelValue === 'object') {
        myrec.value = props.modelValue
      }

      emit('update:modelValue', myrec.value)
    }

    function mounted() {
      updateClass()
    }

    onMounted(mounted)

    return {
      tools,
      updateClass,
      myrec,
    }
  },

})
