Skip to content

Commit

Permalink
feat: add types for Story and Stories components (#52)
Browse files Browse the repository at this point in the history
  • Loading branch information
tobiasdiez authored Apr 15, 2023
1 parent 83abd96 commit 157dd57
Showing 1 changed file with 74 additions and 0 deletions.
74 changes: 74 additions & 0 deletions src/components.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
type NonUndefinedable<T> = T extends undefined ? never : T
type TypePropsToRuntimeProps<T> = {
[K in keyof T]-?: {} extends Pick<T, K>
? {
type: import('vue').PropType<NonUndefinedable<T[K]>>
}
: {
type: import('vue').PropType<T[K]>
required: true
}
}
type VueComponent<Props> = import('vue').DefineComponent<
TypePropsToRuntimeProps<Props>,
{},
unknown,
{},
{},
import('vue').ComponentOptionsMixin,
import('vue').ComponentOptionsMixin,
{},
string,
import('vue').VNodeProps &
import('vue').AllowedComponentProps &
import('vue').ComponentCustomProps,
Readonly<import('vue').ExtractPropTypes<TypePropsToRuntimeProps<Props>>> & {},
{}
>

/**
* Metadata to configure the stories for a component.
*
* @see [Default export](https://storybook.js.org/docs/vue/api/csf#default-export)
*/
interface StoriesProps {
/**
* Title of the component which will be presented in the navigation. **Should be unique.**
*
* Components can be organized in a nested structure using "/" as a separator.
*
* @see [Naming components and hierarchy](https://storybook.js.org/docs/vue/writing-stories/naming-components-and-hierarchy)
*/
title?: string
/**
* The primary component for your story.
*
* Used by addons for automatic prop table generation and display of other component metadata.
*/
component?: import('vue').DefineComponent
}
type Stories = VueComponent<StoriesProps>

/**
* Story that represents a component example.
*
* @see [Named Story exports](https://storybook.js.org/docs/vue/api/csf#named-story-exports)
*/
interface StoryProps {
/**
* Display name in the UI.
*/
title: string
}
type Story = VueComponent<StoryProps>

// Register components globally
// From https://github.com/vuejs/language-tools/blob/c290251387175be85b1d16bc6783c9712e49700a/packages/vscode-vue/README.md?plain=1#L84-L103
declare module '@vue/runtime-core' {
export interface GlobalComponents {
Stories: Stories
Story: Story
}
}

export {}

0 comments on commit 157dd57

Please sign in to comment.