feat(tab-set): update documentation

src/components/badge/rkBadge.component.js

@@ -9,11 +9,36 @@ import { RkComponent } from '../rkComponent';
 
 
 /**
+ * `RkBadge` is a component which you to keep user notified on content updates.
+ *
  * @extends React.Component
- */
+ *
+ * @example Simple usage example:
+ *
+ * ```
+ * <RkBadge title='new' />
+ * ```
+ *
+ * @example Badge position example:
+ *
+ * ```
+ * <RkBadge
+ *  title='new'
+ *  position='top left'
+ * />
+ * ```
+ *
+ * @property {string} rkType - Type of badge.
+ * Should be one of `primary`, `info`, `success`, `warning`, `danger`.
+ * Default is `danger`.
+ * @property {string} title - Badge title. Required.
+ * @property {string} position - Badge position.
+ * Should be one of `top left`, `top right`, `bottom left`, `bottom right`.
+ * Default is `top right`.
+ * */
 export class RkBadge extends RkComponent {
   static propTypes = {
-    rkType: RkComponent.propTypes.rkType,
+    rkType: PropTypes.oneOf(['', 'primary', 'info', 'success', 'warning', 'danger']),
     title: PropTypes.string.isRequired,
     position: PropTypes.string,
     ...ViewPropTypes,

src/components/tabset/rkTab.component.js

@@ -4,21 +4,40 @@ import {
   View,
   Text,
   Image,
+  ViewPropTypes,
 } from 'react-native';
 import { RkBadge } from '../badge/rkBadge.component';
 import { RkComponent } from '../rkComponent';
 
+/**
+ * @extends React.Component
+ *
+ * @property {string} title - tab title.
+ * @property {React.ReactNode} icon - tab icon.
+ * @property {string} badgeTitle - tab badge title.
+ * @property {string} badgePosition - tab badge position. Should be one of:
+ * `top left`, `top right`, `bottom left`, `bottom right`.
+ * Default is `top right`.
+ * @property {boolean} isSelected - defines if tab is selected.
+ * @property {boolean} isLazyLoad - defines if tab should use content lazy loading.
+ * Default is `true`.
+ */
 export class RkTab extends RkComponent {
   static propTypes = {
+    rkType: RkComponent.propTypes.rkType,
     title: PropTypes.string,
     icon: PropTypes.node,
     badgeTitle: PropTypes.string,
     badgePosition: PropTypes.string,
     badgeStatus: PropTypes.string,
     isSelected: PropTypes.bool,
+    // used in RkTabView
+    // eslint-disable-next-line react/no-unused-prop-types,
     isLazyLoad: PropTypes.bool,
+    ...ViewPropTypes,
   };
   static defaultProps = {
+    rkType: RkComponent.defaultProps.rkType,
     title: '',
     icon: undefined,
     badgeTitle: '',
@@ -75,8 +94,10 @@ export class RkTab extends RkComponent {
     return (
       <View style={[styles.container.base, styles.container.selected, this.props.style]}>
         <RkBadge
+          rkType={this.props.badgeStatus}
           style={[styles.badge.base, styles.badge.selected]}
           title={this.props.badgeTitle}
+          position={this.props.badgePosition}
         />
         <Image
           style={[styles.icon.base, styles.icon.selected]}

src/components/tabset/rkTabView.component.js

@@ -9,7 +9,7 @@ import { RkTabBarIndicator } from './rkTabBarIndicator.component';
 import { RkTabPager } from './rkTabPager.component';
 
 /**
- * `RkCalendar`is a component which allows you to split your content into sub-contents.
+ * `RkTabView` is a component which allows you to split your content into sub-contents.
  *
  * @extends React.Component
  *
@@ -31,6 +31,7 @@ import { RkTabPager } from './rkTabPager.component';
  * @example Badged tabs example:
  *
  * You can use badges on tabs if you want notify user on something happens.
+ * You also can specify badge status and position using `badgeStatus` and `badgePosition` props.
  *
  * ```
  * <RkTabView>
@@ -88,7 +89,6 @@ import { RkTabPager } from './rkTabPager.component';
  * };
  *
  * @property {React.ReactNode} children - RkTab components with it's contents.
- * @property {boolean} isScrollableHeader - Allows tab container scrolling. For lot's of tabs case.
  * @property {function} onItemChange - Fired when visible tab is changed.
  * */
 export class RkTabView extends React.Component {