Improve keys

packages/react-docs/src/components/signature.tsx

@@ -36,6 +36,7 @@ export const Signature: React.SFC<SignatureProps> = (props: SignatureProps) => {
         props.docsInfo,
         sectionName,
         props.isInPopover,
+        props.name,
         props.typeDefinitionByName,
     );
     const paramStringArray: any[] = [];
@@ -103,9 +104,10 @@ function renderParameters(
     docsInfo: DocsInfo,
     sectionName: string,
     isInPopover: boolean,
+    name: string,
     typeDefinitionByName?: TypeDefinitionByName,
 ): React.ReactNode[] {
-    const params = _.map(parameters, (p: Parameter) => {
+    const params = _.map(parameters, (p: Parameter, i: number) => {
         const isOptional = p.isOptional;
         const hasDefaultValue = !_.isUndefined(p.defaultValue);
         const type = (
@@ -121,7 +123,7 @@ function renderParameters(
             <span key={`param-${JSON.stringify(p.type)}-${name}-${i}`}>
                 {!_.isEmpty(p.name) && (
                     <span>
-                {p.name}
+                        {p.name}
                         {isOptional && '?'}:{' '}
                     </span>
                 )}

packages/react-docs/src/components/signature_block.tsx

@@ -124,12 +124,12 @@ export class SignatureBlock extends React.Component<SignatureBlockProps, Signatu
             </div>
         );
     }
-    private _renderParameterDescriptions(parameters: Parameter[]): React.ReactNode {
-        const descriptions = _.map(parameters, parameter => {
+    private _renderParameterDescriptions(parameters: Parameter[], name: string): React.ReactNode {
+        const descriptions = _.map(parameters, (parameter: Parameter, i: number) => {
             const isOptional = parameter.isOptional;
             return (
                 <div
-                    key={`param-description-${parameter.name}`}
+                    key={`param-description-${parameter.name}-${name}-${i}`}
                     className="flex pb1 mb2"
                     style={{ borderBottom: '1px solid #f0f4f7' }}
                 >

packages/react-docs/src/components/type.tsx

@@ -169,10 +169,10 @@ export const Type: React.SFC<TypeProps> = (props: TypeProps): any => {
             break;
 
         case TypeDocTypes.Tuple:
-            const tupleTypes = _.map(type.tupleElements, t => {
+            const tupleTypes = _.map(type.tupleElements, (t, i) => {
                 return (
                     <Type
-                        key={`type-tuple-${t.name}-${t.typeDocType}`}
+                        key={`type-tuple-${t.name}-${t.typeDocType}-${i}`}
                         type={t}
                         sectionName={props.sectionName}
                         typeDefinitionByName={props.typeDefinitionByName}
@@ -222,7 +222,7 @@ export const Type: React.SFC<TypeProps> = (props: TypeProps): any => {
         const id = Math.random().toString();
         const typeDefinitionAnchorId = isExportedClassReference
             ? props.type.name
-            : `${constants.TYPES_SECTION_NAME}-${typeName}`;
+            : `${props.docsInfo.typeSectionName}-${typeName}`;
         typeName = (
             <ScrollLink
                 to={typeDefinitionAnchorId}