docs: MDS-866 Chip Component Docs #32
Conversation
salvatorecriscioneweb
commented
Dec 19, 2023
•
salvatorecriscioneweb
commented
- Removed some examples because redundant and/or confusing
- Rewrote some titles
- Added descriptions to most of the examples
salvatorecriscioneweb
force-pushed
the
MDS-866
branch
from
7d2e66d to
bd8ad4d
Compare
| import { useCallback, useState } from "react"; | ||
| import { Chip } from "@heathmont/moon-core-tw"; | ||
|
|
||
| const WithOnClick = () => { |
There was a problem hiding this comment.
The previous example was printing a console.log statement, which lacked visual appeal. The question is Chip component is suitable for acting as a button? Any insights on this matter would be appreciated
There was a problem hiding this comment.
@salvatorecriscioneweb, this is a good question. We definitely need to describe the difference between a chip and a button. @dkireev, could you please assist with a good description in a separate PR?
Regarding acting as a button, let's leave it for now as it is
There was a problem hiding this comment.
Basically, the main difference is that a chip supports an 'Active' state, indicating that the appropriate field was selected. However, we need to add a concrete and straightforward description.
There was a problem hiding this comment.
Yeah, added the alert for now to enable end-to-end testing on the click, as using console.log isn't very effective for tracking in Playwright
|
|
||
| const sports = ["basket", "football", "cricket"]; | ||
|
|
||
| const IsActive = () => { |
There was a problem hiding this comment.
@karl-kallavus also this example was rewrote and created brand new for better clarification. Let me know if it's ok
| import { useCallback, useState } from "react"; | ||
| import { Chip } from "@heathmont/moon-core-tw"; | ||
|
|
||
| const WithOnClick = () => { |
There was a problem hiding this comment.
@salvatorecriscioneweb, this is a good question. We definitely need to describe the difference between a chip and a button. @dkireev, could you please assist with a good description in a separate PR?
Regarding acting as a button, let's leave it for now as it is
| import { useCallback, useState } from "react"; | ||
| import { Chip } from "@heathmont/moon-core-tw"; | ||
|
|
||
| const WithOnClick = () => { |
There was a problem hiding this comment.
Basically, the main difference is that a chip supports an 'Active' state, indicating that the appropriate field was selected. However, we need to add a concrete and straightforward description.
