docz: Props component doesn`t render props table with typescript
Bug Report
docz config
export default { title: ‘Documentation’, typescript: true, codeSandbox: false, description: ‘Documentation from the Components’, };
my component
import React, { SFC } from 'react'
import styled from 'styled-components'
const scales = {
small: `
padding: 5px 10px;
font-size: 14px;
`,
normal: `
padding: 10px 20px;
font-size: 16px;
`,
big: `
padding: 20px 30px;
font-size: 18px;
`,
}
const kind = (outline: boolean) => (bg: string, color: string) => {
const boxShadowColor = outline ? bg : 'transparent'
const backgroundColor = outline ? 'transparent' : bg
return `
background: ${backgroundColor};
box-shadow: inset 0 0 0 1px ${boxShadowColor};
color: ${outline ? bg : color};
transition: all .3s;
&:hover {
box-shadow: inset 0 0 0 1000px ${boxShadowColor};
color: ${color};
}
`
}
type Kind = 'primary' | 'secondary' | 'cancel' | 'dark' | 'gray'
type Kinds = Record<Kind, string>
const kinds = (outline: boolean): Kinds => {
const get = kind(outline)
return {
primary: get('#1FB6FF', 'white'),
secondary: get('#5352ED', 'white'),
cancel: get('#FF4949', 'white'),
dark: get('#273444', 'white'),
gray: get('#8492A6', 'white'),
}
}
export interface ButtonProps {
scale: 'small' | 'normal' | 'big'
kind: 'primary' | 'secondary' | 'cancel' | 'dark' | 'gray'
outline: boolean
}
const getScale = ({ scale = 'normal' }: ButtonProps) => scales[scale]
const getKind = ({ kind = 'primary', outline = false }: ButtonProps) =>
kinds(outline)[kind]
const ButtonStyled = styled('button')`
${getKind};
${getScale};
cursor: pointer;
margin: 3px 5px;
border: none;
border-radius: 3px;
`
export const Button: SFC<ButtonProps> = ({ children, ...props }) => (
<ButtonStyled {...props}>{children}</ButtonStyled>
)
use in mdx file
import { Playground, Props } from 'docz';
<Props of={Button} />
but unfortunately it is not render table
Current behavior Props Component doesn’t render table with props
import { Playground, Props } from 'docz';
import { Button } from './index.tsx';
<Props of={Button} />
Expected behavior Props component should render table with props
Also try to run official docz typescript example, but still not render table
Environment
- docz 1.2.0
- docz-theme-default 1.2.0
- OS: OSX 10.14.5
- Node/npm version: 10.16.0/6.9.0
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Reactions: 21
- Comments: 22 (3 by maintainers)
@beeeku Works!, change your
doczrc.js
config:Note: First remove your .docz and try it! 🍻
+1 But sometimes it’s works
Can’t Confirm Why But This WORKS !!!
Same for non-typescript environment