[Bug]: Args types are always Partial<Props> rather than the values I passed

[KevinGhadyani-Okta]

Describe the bug

I think this is an issue with discriminated unions in TypeScript, but there's a variant of that in this project.

The Issue

Something's up with StoryObj types after upgrading to Storybook v8. It's saying all arg types are Partial<MyComponent> no matter what. The type itself has infer, but that's inferring the wrong type for some reason.

Before (v7)

Heavily simplified:

const storybookMeta: Meta<MyComponentProps> = {
  title: "MyComponent",
  component: MyComponent,
  args: {
    // my default args
  },
};

export default storybookMeta;

export const ActionButton: StoryObj<MyComponentProps> = { // Also doesn't work passing `typeof MyComponent` as a generic.
  args: {
    actionLabel: "Open app settings",
  },
  render: function C(args) {
    return (
      <MyComponent // TypeScript errors in v8 because `Partial<MyComponentProps>` isn't valid for `MyComponentProps`. That means `actionLabel` is now `string | undefined`. It doesn't care that `ActionButton.args.actionLabel` is a string. It's also not aware of any default values in the `Meta` type definition.
        {...args}
      />
    )
  },
};

After (v8)

const globalArgs = {
  // my default args
} as const satisfies Partial<MyComponentProps>

const storybookMeta: Meta<typeof MyComponent> = {
  title: "MyComponent",
  component: MyComponent,
  args: globalArgs,
};

export default storybookMeta;

const actionButtonArgs = {
  ...globalArgs,
  actionLabel: "Open app settings",
} as const satisfies MyComponentProps

export const ActionButton: StoryObj<typeof actionButtonArgs> = {
  args: actionButtonArgs,
  render: function C(args) {
    return (
      <MyComponent
        {...args}
      />
    );
  },
};

Generics don't match Storybook's docs

After going through the reproduction, I noticed this project has the generics passed incorrectly. I changed them to match the TypeScript reproduction, but it didn't fix it.

Looking further, it appears to be an issue with optional props (discriminated unions) where in one case they're required, in another case they're optional and never.

I modified the Button and its stories in the reproduction:

(
  | {
      label2: string;
      actionLabel?: never;
    }
  | {
      label2?: never;
      actionLabel: string;
    }
)

export const Primary: Story = {
  args: {
    primary: true,
    label: 'Button',
    actionLabel: "yo"
  },
  render: (args) => {
    args.actionLabel // This should be of type `string`, but it's `string | undefined`.
    return <Button {...args} />
  }
};

Reproduction link

https://stackblitz.com/edit/github-q1puzq?file=src%2Fstories%2FButton.stories.tsx,src%2Fstories%2FButton.tsx&preset=node

Reproduction steps

1. Go to the above link.
2. Open Button.stories.tsx.
3. Notice the Primary story has the wrong type for args.actionLabel even though a value is passed.

System

Storybook Environment Info:

  System:
    OS: macOS 14.7.1
    CPU: (12) arm64 Apple M2 Max
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.9.0 - /private/var/folders/gk/c_gsyb190312g8l2l77scx4c0000gp/T/xfs-f3745574/node
    Yarn: 4.1.0 - /private/var/folders/gk/c_gsyb190312g8l2l77scx4c0000gp/T/xfs-f3745574/yarn <----- active
    npm: 10.1.0 - ~/.nvm/versions/node/v20.9.0/bin/npm
  Browsers:
    Chrome: 131.0.6778.86
    Safari: 18.1.1
  npmPackages:
    @storybook/addon-links: ^8.4.5 => 8.4.5 
    @storybook/blocks: ^8.4.5 => 8.4.5 
    @storybook/react: ^8.4.5 => 8.4.5 
    @storybook/react-vite: ^8.4.5 => 8.4.5 
    storybook-addon-rtl-direction: ^0.0.19 => 0.0.19

Additional context

No response

[valentinpalkovic]

cc @kasperpeulen