你的功能请求是否与问题相关?请描述
html
框架上的 Meta
和 StoryObj
类型不支持这种语法:
// ./Button.story.ts
import type { Meta, StoryObj } from '@storybook/html';
import { createButton, type ButtonProps } from './Button';
const meta = {
title: 'Component',
render: args => createButton(args),
// ^- Argument of type '({ variant }: ButtonProps) => HTMLButtonElement' is not assignable to parameter of type 'ButtonProps'.ts(2345)
} satisfies Meta<typeof createButton>;
type Story = StoryObj<typeof meta>;
export default meta;
export const Default: Story = {
args: {
variant: 'primary',
// ^- Type '{ variant: string; }' is not assignable to type 'Partial<{ title: string; render: (args: ({ variant }: ButtonProps) => HTMLButtonElement) => HTMLButtonElement; }>'.
}
}
// ./Button.ts
export type ButtonProps = {
variant: 'primary' | 'secondary';
}
export function createButton({ variant }: ButtonProps) {
return `<button class="${variant}">...</button>`;
}
可行的实现方法是使用 ButtonProps
类型,而不是 typeof createButton
注解。
// ./Button.story.ts
import type { Meta, StoryObj } from '@storybook/html';
import { createButton, type ButtonProps } from './Button';
const meta = {
title: 'Component',
render: args => createButton(args),
} satisfies Meta<ButtonProps>;
type Story = StoryObj<ButtonProps>;
export default meta;
export const Default: Story = {
args: {
variant: 'primary',
}
}
描述你希望的解决方案
我希望 html
框架中的 Meta
和 StoryObj
类型能从 createButton
函数中推断出类型,以便它能符合 React 和其他框架的实现文档。
描述你考虑过的替代方案
- 无响应*
你是否能协助将这个功能变为现实?
否
3条答案
按热度按时间irlmq6kh1#
@shilman@vanessayuenn to prioritize
fsi0uk1n2#
我们没有为Lit和Angular提供这种语法,原因如下:
#20988
然而,除了时间限制(笑),我们支持html渲染器(如preact)使用这种语法。
7lrncoxx3#
我们已经在7.0版本中实现了功能冻结,所以我们可以在7.1版本中尽早考虑优先处理这个问题。