TypeScript - Storybook + Vue3 الطرق المكشوفة في `defineExpose` غير مرئية تلقائياً في argTable


لدي CustomInput.vue هكذا

<!-- components/input/CustomInput.vue -->

<template>
  <div><!-- some html... --></div>
</template>

<script setup lang="ts">
...

function reset(): void {
  // some reset action...
}

defineExpose({
  reset
})
</script>

وأنا أصدر المكون بهذه الطريقة.

// components/input/index.ts

import { default as CustomInput } from './CustomInput.vue'

type CustomInput = InstanceType<typeof CustomInput>

export { CustomInput }

حتى أتمكن من إظهار أن نوع طريقة reset هو () => void في مرجع CustonInput.

...

<script setup lang="ts">
...

const inputRef = ref<CustomInput>()

const fn = () => {
  inputRef.value?.reset()
}
</script>

لكن في Storybook لا أستطيع رؤية أي طريقة expose.

هل يجب علي كتابة طريقة expose في argTable بشكل منفصل؟

هذا هو رمز قصص كتابي القصصي.

import type { Meta, StoryObj } from '@storybook/vue3'

import { CustomInput } from '../components/input'

const meta = {
  title: 'Components/CustomInput',
  component: CustomInput,
  tags: ['autodocs'],
} satisfies Meta<CustomInput>

export default meta
type Story = StoryObj<typeof meta>

أعلم أن هناك طريقة للكتابة يدويًا في argTable، لكنني أتمنى لو تم إنشاؤه تلقائيًا.