wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-19 11:28:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ToggleShow] Fix typo and better description (#1753)

Browse Source 
* Fix typo

* Improve desc

* Add layout

* Fix Flex layout

* Use ui kit button
This commit is contained in:
Kiwi
2018-07-20 22:40:12 +00:00
committed by Wyatt Johnson
parent a015a474aa
commit 6bbb645552
9 changed files with 35 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/stream/components/Comment/__snapshots__/TopBar.spec.tsx.snap
+1 -1
View File
@@ -2,7 +2,7 @@
exports[`renders correctly on big screens 1`] = `
<div
className="Flex-root TopBar-root Flex-itemGutter Flex-alignCenter Flex-directionRow"
className="Flex-root TopBar-root Flex-itemGutter Flex-alignBaseline Flex-directionRow"
>
<div>
Hello World
src/core/client/stream/test/__snapshots__/loadMore.spec.tsx.snap
+7 -7
View File
@@ -43,12 +43,12 @@ exports[`loads more comments 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -77,7 +77,7 @@ exports[`loads more comments 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -106,7 +106,7 @@ exports[`loads more comments 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -182,12 +182,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -216,7 +216,7 @@ exports[`renders comment stream 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
src/core/client/stream/test/__snapshots__/renderReplies.spec.tsx.snap
+4 -4
View File
@@ -43,12 +43,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -77,7 +77,7 @@ exports[`renders comment stream 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -108,7 +108,7 @@ exports[`renders comment stream 1`] = `
className="Indent-root Indent-level0"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-replyList-log--comment-with-replies"
role="log"
>
src/core/client/stream/test/__snapshots__/renderStream.spec.tsx.snap
+3 -3
View File
@@ -43,12 +43,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -77,7 +77,7 @@ exports[`renders comment stream 1`] = `
</div>
</div>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
src/core/client/stream/test/__snapshots__/showAllReplies.spec.tsx.snap
+6 -6
View File
@@ -43,12 +43,12 @@ exports[`renders comment stream 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -79,7 +79,7 @@ exports[`renders comment stream 1`] = `
className="Indent-root Indent-level0"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-replyList-log--comment-0"
role="log"
>
@@ -174,12 +174,12 @@ exports[`show all replies 1`] = `
</form>
<div
aria-live="polite"
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-stream-log"
role="log"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
>
<div
role="article"
@@ -210,7 +210,7 @@ exports[`show all replies 1`] = `
className="Indent-root Indent-level0"
>
<div
className="Flex-root Flex-itemGutter Flex-directionColumn"
className="Flex-root Flex-itemGutter Flex-alignFlexStart Flex-directionColumn"
id="talk-comments-replyList-log--comment-0"
role="log"
>
src/core/client/ui/components/Flex/Flex.tsx
+3 -2
View File
@@ -47,8 +47,9 @@ const Flex: StatelessComponent<InnerProps> = props => {
} = props;
let alignItemsWithDefault = alignItems;
if (!direction || !direction.startsWith("column")) {
alignItemsWithDefault = "center";
if (!alignItems) {
alignItemsWithDefault =
direction && direction.startsWith("column") ? "flex-start" : "center";
}
const classObject: Record<string, boolean> = {
src/core/client/ui/components/ToggleShow/ToggleShow.spec.tsx
+1 -1
View File
@@ -9,7 +9,7 @@ it("renders correctly", () => {
{({ toggleShow, show }) => (
<div>
{show && <div>SHOW ME</div>}
<button onClick={toggleShow}>Click me and I disapear</button>
<button onClick={toggleShow}>Click me and I disappear</button>
</div>
)}
</ToggleShow>
src/core/client/ui/components/ToggleShow/ToogleShow.mdx
+9 -5
View File
@@ -5,18 +5,22 @@ menu: UI Kit
import { Playground } from 'docz'
import ToggleShow from './ToggleShow'
import Button from '../Button'
import Flex from '../Flex'
# ToggleShow
A Component that provides a render function to display nodes
A render props component to manage visible state.
## Basic usage
<Playground>
<ToggleShow>
{({ toggleShow, show }) => (
<div>
{show && <div>SHOW ME</div>}
<button onClick={toggleShow}>ClickMe and I disapear</button>
</div>
<Flex itemGutter direction="column">
{show && <div>Hello World!</div>}
<Button onClick={toggleShow} variant="filled" color="primary">
Toggle Show
</Button>
</Flex>
)}
</ToggleShow>
</Playground>
src/core/client/ui/components/ToggleShow/__snapshots__/ToggleShow.spec.tsx.snap
+1 -1
View File
@@ -8,7 +8,7 @@ exports[`renders correctly 1`] = `
<button
onClick={[Function]}
>
Click me and I disapear
Click me and I disappear
</button>
</div>
`;