Open brycenaddison opened 2 weeks ago
For anyone having a similar issue, I was able to work around it by making a custom block to use instead of Stories
.
/** A block for showing a list of stories. */
export const MyStories = ({
of,
exclude = ['Primary'],
}) => {
const resolvedOf = useOf(of ?? 'meta', ['meta']);
const moduleExports = resolvedOf.csfFile.moduleExports;
const exportsOrder = moduleExports.__namedExportsOrder;
return (
<>
{exportsOrder
.filter((name) => !exclude.includes(name))
.map((name) => (
// Title, description, and canvas blocks
<MyStory key={name} of={moduleExports[name]} />
))}
</>
);
};
Describe the bug
When writing a story for a controlled component, one should expect the
useArgs
hook to update the args being passed to the story it is being called in. However, when used inside a "Stories" block, it updates the page's primary story instead of itself. This isn't an issue when using a "Canvas" block or any other block that selects a specific story. I'm sure this could be user error but I don't see why there would then be a discrepancy between the functionality between the "Stories" block and an individual "Story" block.Reproduction link
https://stackblitz.com/edit/github-n2sxrc?file=src%2Fstories%2FInput.tsx
Reproduction steps
System
Additional context
No response