docs(components): adding accessibility tab content #1840
Conversation
kolaps33
requested review from
dvdzkwsk,
kuzhelov,
layershifter,
levithomason,
miroslavstastny and
mnajdova
as code owners
Codecov Report
@@ Coverage Diff @@
## master #1840 +/- ##
=======================================
Coverage 69.64% 69.64%
=======================================
Files 874 874
Lines 7610 7610
Branches 2215 2215
=======================================
Hits 5300 5300
Misses 2302 2302
Partials 8 8
Continue to review full report at Codecov.
|
kolaps33
changed the title
| return _.upperFirst(_.lowerCase(divided)) | ||
| } | ||
|
|
||
| const behaviorCard = (variation: any, keyValue: string) => { |
There was a problem hiding this comment.
change to component and rename keyValue to name:
const BehaviorCard = ( { variation: any, name: string } ) =>
There was a problem hiding this comment.
changed do component and recognized that I don't need keyValue
| <React.Fragment key={keyValue}> | ||
| <Segment className="docs-example" id={getId(variation.name)} styles={exampleStyle}> | ||
| <ComponentExampleTitle | ||
| title={baseName(variation.name)} |
There was a problem hiding this comment.
Same thing, is used once, can be just variable inside component
There was a problem hiding this comment.
baseName function I moved now to "BehaviorCard.tsx" file.
I let the logic there, as it looks for me a bit tricky to put it inline.
@layershifter what do you think about? :)
| <InlineMarkdown value={accIssues} /> | ||
| </React.Suspense> | ||
| </Text> | ||
| </Segment> | ||
| </> | ||
| )} | ||
| </> |
There was a problem hiding this comment.
I am not fully understand the styling on bottom, let's remove it all:
return (
<Flex column>
- <Flex.Item>
- <Provider styles={{ paddingLeft: '14px', background: 'transparent' }}>
{accessibilityDetails}
- </Provider>
- </Flex.Item>
</Flex>
)There was a problem hiding this comment.
removed to be consistent with other tabs
| } | ||
|
|
||
| function getDescription(info) { | ||
| return _.get(_.find(info.docblock.tags, { title: 'accessibility' }), 'description') | ||
| } | ||
|
|
||
| function getStem(info) { | ||
| function getDefaultBehaviorName(info) { | ||
| const defaultValue = _.get(_.find(info.props, { name: 'accessibility' }), 'defaultValue') | ||
| return defaultValue && defaultValue.split('.').pop() |
There was a problem hiding this comment.
This throws on Flex page and I am not that .split() is required at all
My issue, nevermind
|
created task for refactor: |
Moving behaviors from sidebar into the accessibility tab in each component.
Now the accessibility tab will include: