Update docs

Author: ethanshar

demo/src/screens/MenuStructure.js

@@ -91,7 +91,9 @@ export const navigationData = {
       {title: 'Contacts List', tags: 'list contacts', screen: 'unicorn.lists.ContactsListScreen'},
       {title: 'Conversation List', tags: 'list conversation', screen: 'unicorn.lists.ConversationListScreen'},
       {title: 'Drawer', tags: 'drawer', screen: 'unicorn.components.DrawerScreen'},
-      {title: 'SortableList', tags: 'sortable list drag', screen: 'unicorn.components.SortableListScreen'}
+      {title: 'SortableList', tags: 'sortable list drag', screen: 'unicorn.components.SortableListScreen'},
+      {title: 'GridList', tags: 'grid list', screen: 'unicorn.components.GridListScreen'},
+      {title: 'SortableGridList', tags: 'sort grid list drag', screen: 'unicorn.components.SortableGridListScreen'}
     ]
   },
   LayoutsAndTemplates: {
@@ -121,8 +123,6 @@ export const navigationData = {
         screen: 'unicorn.components.FaderScreen'
       },
       {title: 'Wizard', tags: 'wizard', screen: 'unicorn.components.WizardScreen'},
-      {title: 'GridList', tags: 'grid list', screen: 'unicorn.components.GridListScreen'},
-      {title: 'SortableGridList', tags: 'sort grid list drag', screen: 'unicorn.components.SortableGridListScreen'},
       {title: 'GridView', tags: 'grid view', screen: 'unicorn.components.GridViewScreen'}
     ]
   },

lib/components/Keyboard/KeyboardTracking/keyboardAwareInsetsView.api.json

@@ -3,7 +3,7 @@
   "category": "infra",
   "description": "Used to add an inset when a keyboard is used and might hide part of the screen.",
   "note": "This view is useful only for iOS.",
-  "extends": ["keyboard/KeyboardTrackingView"],
+  "extends": ["infra/KeyboardTrackingView"],
   "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/incubatorScreens/IncubatorTextFieldScreen.tsx",
   "snippet": ["<ScrollView>",
     "  <TextField/>",

scripts/buildDocs.js

@@ -3,7 +3,7 @@ const childProcess = require('child_process');
 const fs = require('fs');
 
 const COMPONENTS_DOCS_DIR = './docs/components';
-const VALID_CATEGORIES = ['foundation', 'assets', 'navigation', 'layout', 'controls', 'status', 'media', 'lists', 'form', 'dateTime', 'overlays', 'charts', 'incubator', 'infra'];
+const VALID_CATEGORIES = ['foundation', 'basic', 'assets', 'navigation', 'layout', 'controls', 'status', 'media', 'lists', 'form', 'dateTime', 'overlays', 'charts', 'incubator', 'infra'];
 
 const result = childProcess.execSync('find ./src ./lib/components -name "*api.json"');
 const apiFiles = result.toString().trim().split('\n');

src/components/animatedImage/animatedImage.api.json

@@ -2,7 +2,7 @@
   "name": "AnimatedImage",
   "category": "media",
   "description": "Image component that fades-in the image with animation once it's loaded",
-  "extends": ["basic/Image"],
+  "extends": ["media/Image"],
   "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/AnimatedImageScreen.js",
   "images": ["https://media.giphy.com/media/l0HU7jj0ivEFyZIA0/giphy.gif"],
   "props": [

src/components/avatar/avatar.api.json

@@ -6,7 +6,7 @@
     "https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Avatar/Avarat_1.png?raw=true",
     "https://github.com/wix/react-native-ui-lib/blob/master/demo/showcase/Avatar/Avarat_2.png?raw=true"
   ],
-  "extends": ["basic/TouchableOpacity", "basic/Image"],
+  "extends": ["basic/TouchableOpacity", "media/Image"],
   "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/AvatarsScreen.tsx",
   "props": [
     {

src/components/card/cardImage.api.json

@@ -2,7 +2,7 @@
   "name": "Card.Image",
   "category": "layout",
   "description": "Inner component for the Card component (better be a direct child)",
-  "extends": ["basic/Image"],
+  "extends": ["media/Image"],
   "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/CardsScreen.tsx",
   "props": [
     {"name": "width", "type": "number", "description": "Width"},

src/components/progressiveImage/progressiveImage.api.json

@@ -2,7 +2,7 @@
   "name": "ProgressiveImage",
   "category": "media",
   "description": "Image component that loads first a small thumbnail of the images, and fades-in the full-sized image with animation once it's loaded",
-  "extends": ["basic/AnimatedImage"],
+  "extends": ["media/AnimatedImage"],
   "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/ProgressiveImageScreen.js",
   "props": [
     {

src/components/sortableGridList/sortableGridList.api.json

@@ -3,7 +3,7 @@
   "category": "lists",
   "description": "An sortable grid list (based on GridList component)",
   "note": "This component supports square items only",
-  "extends": ["layoutsAndTemplates/GridList"],
+  "extends": ["lists/GridList"],
   "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/SortableGridListScreen.tsx",
   "props": [
     {"name": "data", "type": "any[] & {id: string}", "description": "Data of items with an id prop as unique identifier"},

src/components/touchableOpacity/touchableOpacity.api.json

@@ -1,6 +1,6 @@
 {
   "name": "TouchableOpacity",
-  "category": "infra",
+  "category": "basic",
   "description": "A wrapper for TouchableOpacity component. Support onPress, throttling and activeBackgroundColor",
   "extends": ["TouchableOpacity"],
   "extendsLink": ["https://reactnative.dev/docs/touchableopacity"],

src/components/view/view.api.json

@@ -1,6 +1,6 @@
 {
   "name": "View",
-  "category": "infra",
+  "category": "basic",
   "description": "An enhanced View component",
   "extends": ["View"],
   "extendsLink": ["https://reactnative.dev/docs/view"],