A few minor component updates.#605
Conversation
|
This pull request is automatically being deployed by Amplify Hosting (learn more). |
| <Goal variant="compact" label="Goal 2" targetValue={5} maxValue={10} valueProvider={{ type: 'static integer', getValue: async () => 3 }} /> | ||
| </div> | ||
| </>, | ||
| onClick: () => console.log("Card Clicked!") |
There was a problem hiding this comment.
"See more details" made me expect to see more details, not a console statement. I think it would be better if the click event actually did something visible (even if it was as simple as changing a color or something) with a prompt to match.
|
|
||
| return ( | ||
| <div style={{...props.style, backgroundColor:backgroundColor}} ref={props.innerRef} className={classes.join(" ")}> | ||
| <div style={{ ...props.style, backgroundColor: backgroundColor, ...(props.onClick && { cursor: "pointer" }) }} ref={props.innerRef} className={classes.join(" ")} onClick={props.onClick}> |
There was a problem hiding this comment.
In Chrome and Safari on Mac, I don't see any visible difference between the pointer on a clickable card vs a non-clickable card.
| colorScheme: 'auto', | ||
| title: 'Baseline Survey', | ||
| subtitle: 'Tap here to start your baseline survey', | ||
| withClass: false, |
There was a problem hiding this comment.
Maybe I'm missing something, but the story args here seem a little inconsistent compared to other stories. I'm used to seeing the actual component properties reflected in the story arguments. For example, on BasicPointsForBadges you can control the BasicPointsForBadgesProps like pointsPerBadge and progressBarColor. Here the story args seem to be activating specific scenarios, but I thought that was more normally done with separate stories?
2 participants
Overview
This branch has a few minor updates to existing components.
Cardnow supports having a click handler. This is useful when you want to display a number child elements in a card, but have the entire thing function as a single CTA. When a click handler is provided, the cursor gets set topointer.Actionnow inherits the cursor from its parent rather than setting it todefault. This allows a clickable card's cursor to pass through to child actions when that child action does not have a click handler of its own. If the action has a click handler of its own, its cursor still gets set topointerregardless of what the parent cursor is. I also cleaned up and modernized theActionStorybook a bit.Goalwas updated such that it also inherits the cursor from its parent. Therecharts-wrapperclass was setting the cursor todefault, but now it inherits the cursor. This ensures the cursor is uniform across the goal rather than swapping back and forth todefaultwhen pieces of the chart are hovered.Goalwas also updated to prevent the outline from showing up on clicked pie chart segments in the progress ring.Security
No new security risk. Just minor rendering and event handler updates.
Testing
I have updated the Storybook stories to make it fairly simple to verify the above claims.
Documentation
@CareEvolution/api-docs.