Add docs for components m-o (#1643)

* Add docs for components m-o

* Fix

Author: M-i-k-e-l

src/components/maskedInput/maskedInput.api.json

@@ -0,0 +1,23 @@
+{
+  "name": "MaskedInput",
+  "category": "form",
+  "description": "Mask Input to create custom looking inputs with custom formats",
+  "extends": ["TextField"],
+  "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/MaskedInputScreen.js",
+  "images": [
+    "https://camo.githubusercontent.com/61eedb65e968845d5eac713dcd21a69691571fb1/68747470733a2f2f6d656469612e67697068792e636f6d2f6d656469612f4b5a5a7446666f486f454b334b2f67697068792e676966"
+  ],
+  "props": [
+    {
+      "name": "renderMaskedText",
+      "type": "React.ReactElement",
+      "required": true,
+      "description": "callback for rendering the custom input out of the value returns from the actual input"
+    },
+    {
+      "name": "containerStyle",
+      "type": "ViewStyle",
+      "description": "container style for the masked input container"
+    }
+  ]
+}

src/components/modal/api/modal.api.json

@@ -0,0 +1,38 @@
+{
+  "name": "Modal",
+  "category": "layoutsAndTemplates",
+  "description": "Component that present content on top of the invoking screen",
+  "extends": ["Modal"],
+  "extendsLink": ["https://reactnative.dev/docs/modal"],
+  "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/ModalScreen.tsx",
+  "images": ["https://media.giphy.com/media/3oFzmfSX8KgvctI4Ks/giphy.gif"],
+  "props": [
+    {
+      "name": "enableModalBlur",
+      "type": "boolean",
+      "description": "Blurs the modal background when transparent (iOS only)"
+    },
+    {
+      "name": "blurView",
+      "type": "JSX.Element",
+      "description": "A custom view to use as a BlueView instead of the default one"
+    },
+    {
+      "name": "onBackgroundPress",
+      "type": "(event: GestureResponderEvent) => void",
+      "description": "allow dismissing a modal when clicking on its background"
+    },
+    {"name": "overlayBackgroundColor", "type": "string", "description": "The background color of the overlay"},
+    {"name": "testID", "type": "string", "description": "The modal's end-to-end test identifier"},
+    {
+      "name": "accessibilityLabel",
+      "type": "string",
+      "description": "Overrides the text that's read by the screen reader when the user interacts with the element.\\By default, the label is constructed by traversing all the children and accumulating all the Text nodes separated by space."
+    },
+    {
+      "name": "useGestureHandlerRootView",
+      "type": "boolean",
+      "description": "Should add a GestureHandlerRootView (Android only)"
+    }
+  ]
+}

src/components/modal/api/modalTopBar.api.json

@@ -0,0 +1,41 @@
+{
+  "name": "Modal.TopBar",
+  "category": "layoutsAndTemplates",
+  "description": "Modal.TopBar, inner component for configuring the Modal component's title, buttons and statusBar",
+  "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/ModalScreen.tsx",
+  "images": ["https://media.giphy.com/media/3oFzmfSX8KgvctI4Ks/giphy.gif"],
+  "props": [
+    {"name": "title", "type": "string", "description": "Title to display in the center of the top bar"},
+    {"name": "titleStyle", "type": "TextStyle", "description": "Title custom style"},
+    {
+      "name": "doneButtonProps",
+      "type": "ButtonProps",
+      "description": "Done action props",
+      "default": "{color: Colors.primary}"
+    },
+    {"name": "doneLabel", "type": "string", "description": "Done action label", "default": "Save"},
+    {"name": "doneIcon", "type": "ImageSource", "description": "Done action icon"},
+    {"name": "onDone", "type": "(props?: any) => void", "description": "Done action callback"},
+    {
+      "name": "cancelButtonProps",
+      "type": "ButtonProps",
+      "description": "Cancel action props",
+      "default": "{color: Colors.primary}"
+    },
+    {"name": "cancelLabel", "type": "string", "description": "Cancel action label"},
+    {
+      "name": "cancelIcon",
+      "type": "ImageSource",
+      "description": "Cancel action icon",
+      "default": "Assets.icons.x"
+    },
+    {"name": "onCancel", "type": "(props?: any) => void", "description": "Cancel action callback"},
+    {
+      "name": "includeStatusBar",
+      "type": "boolean",
+      "description": "Whether to include status bar or not (height calculations)",
+      "default": "Constants.isIOS"
+    },
+    {"name": "containerStyle", "type": "ViewStyle", "description": "Style for the TopBar container"}
+  ]
+}

src/components/overlay/overlay.api.json

@@ -0,0 +1,27 @@
+{
+  "name": "Overlay",
+  "category": "basic",
+  "description": "Overlay view with types",
+  "extends": ["Image"],
+  "extendsLink": ["https://reactnative.dev/docs/image"],
+  "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/OverlaysScreen.tsx",
+  "props": [
+    {
+      "name": "type",
+      "type": "vertical | top | bottom | solid (OverlayTypeType)",
+      "description": "The type of overlay to set on top of the image"
+    },
+    {
+      "name": "intensity",
+      "type": "low | medium | high",
+      "description": "The intensity of the gradient.",
+      "default": "OverlayIntensityType.LOW"
+    },
+    {"name": "color", "type": "string", "description": "The overlay color"},
+    {
+      "name": "customContent",
+      "type": "JSX.Element",
+      "description": "Custom overlay content to be rendered on top of the image"
+    }
+  ]
+}