website: Combine components #944
Conversation
gretanausedaite
requested review from
a team,
mayank99 and
r100-stack
and removed request for
a team
|
Components that don't have unique thumbnail:
Create thumbnails or combine all buttons into one big buttons doc page? |
DropdownButton can go together with DropdownMenu. In the future we should make everything searchable so that it doesn't matter where what lives |
We could also add a "See also"/"Related" section with links to the related components. Then if there are any related components that are not major enough to get a thumbnail, we can add them to the "See also"/"Related" sections of multiple similar components so that users can find them easily. E.g.
Or we could also combine all types of buttons in the |
I can't think of a page name that fits both. Maybe add DropdowButton to buttons and leave menu separately? |
Added task for this in #941 |
|
|
||
| <LiveExample src={frontmatter.exampleCodeFileSplitButton} /> | ||
|
|
||
| Pressing this left side of the button will commit the action. Pressing the right side of the button will open a menu. Upon selecting an option from the menu, the action immediately takes place, and the left side of the button’s label will change to match the recent selection. |
There was a problem hiding this comment.
left side of the button’s label will change to match the recent selection
To confirm, is this valid? Because I don't believe the left button label changes when we click on a menu option.
There was a problem hiding this comment.
i believe the wording was copied over from the old page (splitbutton.mdx). it doesn't really matter for this PR
eventually we will validate the wording of every page
| @@ -15,7 +15,11 @@ import { createRoot } from 'react-dom/client'; | |||
| import { ThemeProvider } from '@itwin/itwinui-react'; | |||
| import App from './App'; | |||
| import './styles.css'; | |||
| createRoot(document.getElementById('root')).render(<ThemeProvider theme='dark'><App /></ThemeProvider>); | |||
| createRoot(document.getElementById('root')!).render( | |||
There was a problem hiding this comment.
Does the ! have something to do with null safety? Just curious about why is it needed.
There was a problem hiding this comment.
yes, try it in a stackblitz with and without !
https://stackblitz.com/github/iTwin/iTwinUI/tree/main/playgrounds/vite?file=package.json,src%2Fmain.tsx%3AL69
Combined: