Fix/typing automation

docs/iconButton.md

@@ -35,7 +35,7 @@ import { ComponentTheme } from '../src/components';
 
 ## Styling
 
-<ComponentTheme name="iconButton" />
+<ComponentTheme   name="iconButton" fileName="icon-button" />
 
 ## Accessibility
 

docs/slider.md

@@ -70,22 +70,17 @@ import { Slider } from 'native-base';
 
 ## Styling
 
-<ComponentTheme name="Slider" />
-
+<ComponentTheme name="Slider" fileName="slider" />
 
 ## Accessibility
 
 Adheres to the [Slider WAI-ARIA design pattern.](https://www.w3.org/TR/wai-aria-practices-1.2/#slidertwothumb)
 
 ### Keyboard Interactions
 
-| Name              | Description |
-| ------------------|-------------|
-| ArrowRight        | Increments/decrements by the step value depending on orientation.|
-| ArrowLeft         | Increments/decrements by the step value depending on orientation.
-| ArrowUp           | Increases the value by the step amount.
-| ArrowDown         | Decreases the value by the step amount.
-
-
-
-
+| Name       | Description                                                       |
+| ---------- | ----------------------------------------------------------------- |
+| ArrowRight | Increments/decrements by the step value depending on orientation. |
+| ArrowLeft  | Increments/decrements by the step value depending on orientation. |
+| ArrowUp    | Increases the value by the step amount.                           |
+| ArrowDown  | Decreases the value by the step amount.                           |

docs/textArea.md

@@ -35,4 +35,4 @@ The `Textarea` component allows you to easily create multi-line text inputs.
 
 ## Styling
 
-<ComponentTheme name="textArea" />
+<ComponentTheme name="textArea"  fileName="textarea" />

nb-plugins/component-prop-table/index.js

@@ -34,27 +34,38 @@ const templateGenerator = (componentDetails) => {
     for (let prop in propsObject) {
       const { name, description, type, parent, defaultValue } =
         propsObject[prop];
-      const markupWithTypeLinks = type.name
-        .split('|')
-        .map((e) => {
-          return e.trim();
-        })
-        .map((element) => {
-          const MapValue =
-            internalPropsMap[element] ||
-            rnPropsMap[element] ||
-            StylingPropsMap[element];
-          const htmlSanatizedElem = element
-            .replace(/\</g, '&lt;') //for <
-            .replace(/\>/g, '&gt;'); //for >
-          return `${
-            MapValue
-              ? `<a href="${MapValue.link}">${element}</a>`
-              : htmlSanatizedElem
-          }`;
-        })
-        .join(' | ');
+      let markupWithTypeLinks;
+      if (type.name.includes('ILinearGradientProps')) {
+        markupWithTypeLinks = `${
+          `ResponsiveValue&lt;` +
+          `<a href="${StylingPropsMap['backgroundColor'].link}">ColorProps </a>` +
+          `\|` +
+          `<a href="${internalPropsMap['ILinearGradientProps'].link}"> ILinearGradientProps</a>` +
+          `>`
+        }`;
+      } else {
+        markupWithTypeLinks = type.name
+          .split('|')
+          .map((e) => {
+            return e.trim();
+          })
+          .map((element) => {
+            const MapValue =
+              internalPropsMap[element] ||
+              rnPropsMap[element] ||
+              StylingPropsMap[element];
 
+            const htmlSanatizedElem = element
+              .replace(/\</g, '&lt;') //for <
+              .replace(/\>/g, '&gt;'); //for >
+            return `${
+              MapValue
+                ? `<a href="${MapValue.link}">${element}</a>`
+                : htmlSanatizedElem
+            }`;
+          })
+          .join(' | ');
+      }
       if (parent && parent.name === `I${displayName}Props`) {
         propExists = true;
         temp =
@@ -75,6 +86,7 @@ const templateGenerator = (componentDetails) => {
         </tr>`;
       }
     }
+
     return temp;
   };
 

nb-plugins/component-prop-table/propsMap.js

@@ -42,7 +42,7 @@ const internalProps = {
   IActionsheetContentProps: {
     doc: 'actionsheet.md',
     name: 'Actionsheet.Content',
-    link: 'actionsheet#actionsheetcontent',
+    link: 'action-sheet#actionsheetcontent',
   },
   SwitchProps: {
     doc: '',
@@ -52,7 +52,7 @@ const internalProps = {
   IFormControlProps: {
     doc: 'formControl.md',
     name: 'FormControl',
-    link: 'formControl#formcontrol',
+    link: 'form-control#formcontrol',
   },
   IInputProps: {
     doc: 'input.md',
@@ -61,105 +61,106 @@ const internalProps = {
   },
 };
 // RN props
-const viewProps = {
-  ViewStyle: {
-    doc: '',
-    name: 'ViewStyle',
-    link: 'https://reactnative.dev/docs/view-style-props',
-  },
-  ViewProps: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  ImageProps: {
-    doc: '',
-    name: 'Image',
-    link: 'https://reactnative.dev/docs/image',
-  },
-  ViewPropsAndroid: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  ViewPropsIOS: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  TVViewPropsIOS: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  GestureResponderHandlers: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  Touchable: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  AccessibilityProps: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  AccessibilityPropsAndroid: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  AccessibilityPropsIOS: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  RefAttributes: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-  Attributes: {
-    doc: '',
-    name: 'View',
-    link: 'https://reactnative.dev/docs/view',
-  },
-};
-const textProps = {
-  TextProps: {
-    doc: '',
-    name: 'TextProp',
-    link: 'https://reactnative.dev/docs/text',
-  },
-  TextPropsIOS: {
-    doc: '',
-    name: 'TextProp',
-    link: 'https://reactnative.dev/docs/text',
-  },
-  TextPropsAndroid: {
-    doc: '',
-    name: 'TextProp',
-    link: 'https://reactnative.dev/docs/text',
-  },
-  AccessibilityProps: {
-    doc: '',
-    name: 'TextProp',
-    link: 'https://reactnative.dev/docs/text',
-  },
-  AccessibilityPropsAndroid: {
-    doc: '',
-    name: 'TextProp',
-    link: 'https://reactnative.dev/docs/text',
-  },
-  AccessibilityPropsIOS: {
-    doc: '',
-    name: 'TextProp',
-    link: 'https://reactnative.dev/docs/text',
-  },
-};
+// const viewProps = {
+//   ViewStyle: {
+//     doc: '',
+//     name: 'ViewStyle',
+//     link: 'https://reactnative.dev/docs/view-style-props',
+//   },
+//   ViewProps: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   ImageProps: {
+//     doc: '',
+//     name: 'Image',
+//     link: 'https://reactnative.dev/docs/image',
+//   },
+//   ViewPropsAndroid: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   ViewPropsIOS: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   TVViewPropsIOS: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   GestureResponderHandlers: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   Touchable: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   AccessibilityProps: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   AccessibilityPropsAndroid: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   AccessibilityPropsIOS: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   RefAttributes: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+//   Attributes: {
+//     doc: '',
+//     name: 'View',
+//     link: 'https://reactnative.dev/docs/view',
+//   },
+// };
+// const textProps = {
+//   TextProps: {
+//     doc: '',
+//     name: 'TextProp',
+//     link: 'https://reactnative.dev/docs/text',
+//   },
+//   TextPropsIOS: {
+//     doc: '',
+//     name: 'TextProp',
+//     link: 'https://reactnative.dev/docs/text',
+//   },
+//   TextPropsAndroid: {
+//     doc: '',
+//     name: 'TextProp',
+//     link: 'https://reactnative.dev/docs/text',
+//   },
+//   AccessibilityProps: {
+//     doc: '',
+//     name: 'TextProp',
+//     link: 'https://reactnative.dev/docs/text',
+//   },
+//   AccessibilityPropsAndroid: {
+//     doc: '',
+//     name: 'TextProp',
+//     link: 'https://reactnative.dev/docs/text',
+//   },
+//   AccessibilityPropsIOS: {
+//     doc: '',
+//     name: 'TextProp',
+//     link: 'https://reactnative.dev/docs/text',
+//   },
+// };
+
 const rnProps = {
   ViewStyle: {
     doc: '',