ContextualMenuItem: adding secondaryText#4788
Conversation
|
@martellaj per our email |
| "sourceMaps": true | ||
| }, | ||
| { | ||
| "type": "node", |
There was a problem hiding this comment.
Did you mean to check this in? I'm guessing so but I just wanted to make sure.
There was a problem hiding this comment.
no, I think this was just from testing with jest. Will revert this
|
we need to get a visual test capturing what this new text looks like |
|
Yes, let's do that before we merge this. @maximus12793, is there a designer you worked with? |
|
@betrue-final-final @micahgodbolt yes Drew. |
|
Andrew Peacock? |
|
yes |
| /** | ||
| * Style for the description text if applicable (for compound buttons.) | ||
| */ | ||
| secondaryText?: IStyle; |
There was a problem hiding this comment.
secondary text is here, but isn't being used in button.
If the idea is to replace description with secondaryText, lets start supporting both (in BaseButton.tsx and style files) so that we can deprecate description
There was a problem hiding this comment.
Whoops, sorry no I forgot to remove this. Am adding vr-tests now
There was a problem hiding this comment.
On second thought I am not sure. Without this addition I am unable to add this property to ContextualMenu.styles.ts (since this derives from IMenuStyles which falls under ButtonTypes.ts (namely, IMenuItemStyles extends IButtonStyles). Is this fine? Or how do you suggest adding it properly to just effect ContextualMenuItems?
|
@peacokle, can you add some pictures of what this would look like? |
|
@betrue-final-final This is taken from the ContextualMenu ran via. |
| }, | ||
| secondaryText: { | ||
| color: theme.palette.neutralTertiary, | ||
| paddingLeft: '20px', |
There was a problem hiding this comment.
It is handled automatically.
You can test it through npm start by going to the top right gear, and selecting the rtl option :)
| { | ||
| key: 'newItem', | ||
| name: 'New Button', | ||
| customData: <span className='applez'>Thu. 10:00 PM</span> |
There was a problem hiding this comment.
Is this class name actually used?
| import { IContextualMenuItemProps } from 'office-ui-fabric-react/lib/ContextualMenu'; | ||
| import './ContextualMenuExample.scss'; | ||
|
|
||
| export class ContextualMenuWithCustomDataAfterNameExample extends React.Component { |
There was a problem hiding this comment.
Did you intend to check in this example? This looks like an exploration with the first thing you were trying.
There was a problem hiding this comment.
whoops yes am removing this
|
Are there any additional changes we would like to see, or is this ready to go? |
|
I'm going ahead and merging this since we have design sign-off from @betrue-final-final and code owner (@joschect) sign-off as well. |
…i-fabric-react into parallel-tsc * 'parallel-tsc' of https://github.com/Markionium/office-ui-fabric-react: Variants: have project use OUFR instead of just styling (microsoft#4854) Add more customization hooks to ProgressIndicator (microsoft#4566) Issue#4832: Break BaseButton Types hard dependency from class ContextualMenu (microsoft#4845) Applying package updates. Revert react portals change (microsoft#4840) Update ImageOverview.md Fixes duplicate reading of suggestions on people picker (microsoft#4765) Persona: Deprecate primaryText (microsoft#4811) Experiments: Fix Fluent theme color names (microsoft#4834) Applying package updates. Add JasonGore to command bar codeowners Fix index import (microsoft#4826) Added overflowMenuProps property to CommandBar (microsoft#4818) Fluent theme: Fix imports to use relative paths (microsoft#4831) ContextualMenuItem: adding secondaryText (microsoft#4788) ComboBox: Option Performance Optimization (microsoft#4782)
* master: (95 commits) Variants: have project use OUFR instead of just styling (microsoft#4854) Add more customization hooks to ProgressIndicator (microsoft#4566) Issue#4832: Break BaseButton Types hard dependency from class ContextualMenu (microsoft#4845) Applying package updates. Revert react portals change (microsoft#4840) Update ImageOverview.md Fixes duplicate reading of suggestions on people picker (microsoft#4765) Persona: Deprecate primaryText (microsoft#4811) Experiments: Fix Fluent theme color names (microsoft#4834) Applying package updates. Add JasonGore to command bar codeowners Fix index import (microsoft#4826) Added overflowMenuProps property to CommandBar (microsoft#4818) Fluent theme: Fix imports to use relative paths (microsoft#4831) ContextualMenuItem: adding secondaryText (microsoft#4788) ComboBox: Option Performance Optimization (microsoft#4782) Marqueeselection style update (microsoft#4803) Applying package updates. FocusZone: Add the ability to stop focus from propagating outside the FocusZone (microsoft#4823) Unknown persona coin (microsoft#4809) ...

Pull request checklist
$ npm run changeDescription of changes
Add secondaryText to ContextualMenuItem to render on the right of item.name (text).
Focus areas to test
(optional)