[Bug]: AddOn - TooltipLinkList "left" does not render (8.0.0-beta.2) about storybook

[shilman]

@JReinhold @cdedreuille is this an intentional 8.0 change?

[valentinpalkovic]

This was already an intentional change for Storybook 7. See #20898 and #20897

A left property doesn't exist. You must use icon if you want to place an icon on the left. See the property definition here: https://github.com/storybookjs/storybook/blob/next/code/ui/components/src/components/tooltip/ListItem.tsx#L175

@stevensacks Where did you find the information that the left property can be configured? Have we documented it somewhere wrongly?

[stevensacks]

Ok. I see in the code you linked that even though there is a component called <Left> the “left” prop has been removed in favor of an “icon” prop. I noticed there are two props for the center called “center” and “title”, and a “right” prop for the <Right> component. The naming isn’t consistent, so it’s a bit confusing 😅

The “icon” prop is not technically an icon, it’s a ReactNode, so it could be text, or an emoji (like my example usage). Maybe that’s why it was named “left” all these years? 🤷🏻‍♂️

I’ll change my addon to use the new name, but since this is a breaking change for all addons that use the TooltipListLink component, it should be included in the migration docs 🙏🏼

[valentinpalkovic]

@stevensacks I have added an entry to the migration docs here:
#26324

Please reach out if you need some further help. And don't get confused about the icon property in globalTypes, because before we pass the icon further to the ToolTipListLink component, we will pass the string into the Icon component from @storybook/components (which is deprecated).

And I agree. The API of the TooltipListLink is pretty messy. I hope, at some point, we can clean it up! Thanks for pointing it out.