This expression is not callable for vue 2 with composition api and class component

I am trying to use the composition api plugin on a vue2 project + class components + typescript. The composition itself works fine, but the does not seem to be working.

composition api: https://github.com/vuejs/composition-api

My resuable composable.

import { defineComponent, reactive, ref, toRefs } from "@vue/composition-api";

const userConfiguration = defineComponent({

setup() {
    const val = ref("");
    const breweries = reactive({ list: [] });
    const submitted = async () => {
        console.log("submitted called");
    };
    return { val, ...toRefs(breweries), submitted };
},
// type inference enabled
});

export { userConfiguration };

Component Function:

@Component({
name: "menu",
components: {
    ...
},
setup() {
    const state = reactive({
        name: "Link",
    });
    const  val  = userConfiguration();
    return { ...toRefs(state), val };
},
})

I am getting the error This expression is not callable

 userConfiguration()

Signature of defineComponent result:

declare function defineComponent<RawBindings, D = Data, C extends ComputedOptions = {}, M extends MethodOptions = {}, Mixin = {}, Extends = {}, Emits extends EmitsOptions = {}>(options: ComponentOptionsWithoutProps<{}, RawBindings, D, C, M, Mixin, Extends, Emits>): VueProxy<{}, RawBindings, D, C, M, Mixin, Extends, Emits>;

I am using

    "typescript": "^4.2.2",
    "vue": "^2.6.14",
    "vue-class-component": "^7.2.6",
    "@vue/composition-api": "^1.4.9",

Try the code below

import { reactive, ref, toRefs } from '@vue/composition-api';

export function userConfiguration() {
  const val = ref('');
  const breweries = reactive({ list: [] });
  const submitted = async () => {
    console.log('submitted called');
  };
  return { val, ...toRefs(breweries), submitted };
}