Add an 'allowSkip' prop to disable the skip button if desired

README.md

@@ -133,6 +133,7 @@ You can customize the tooltip by passing a component to the `copilot` HOC maker.
 
 ```js
 const TooltipComponent = ({
+  allowSkip,
   isFirstStep,
   isLastStep,
   handleNext,

src/components/CopilotModal.js

@@ -13,6 +13,7 @@ type Props = {
   currentStepNumber: number,
   currentStep: ?Step,
   visible: boolean,
+  allowSkip: boolean,
   isFirstStep: boolean,
   isLastStep: boolean,
   easing: ?func,
@@ -283,6 +284,7 @@ class CopilotModal extends Component<Props, State> {
       <Animated.View key="arrow" style={[styles.arrow, this.state.arrow]} />,
       <Animated.View key="tooltip" style={[styles.tooltip, this.state.tooltip, this.props.tooltipStyle]}>
         <TooltipComponent
+          allowSkip={this.props.allowSkip}
           isFirstStep={this.props.isFirstStep}
           isLastStep={this.props.isLastStep}
           currentStep={this.props.currentStep}

src/components/Tooltip.js

@@ -9,6 +9,7 @@ import styles from './style';
 import type { Step } from '../types';
 
 type Props = {
+  allowSkip: boolean,
   isFirstStep: boolean,
   isLastStep: boolean,
   handleNext: func,
@@ -19,6 +20,7 @@ type Props = {
 };
 
 const Tooltip = ({
+  allowSkip,
   isFirstStep,
   isLastStep,
   handleNext,
@@ -33,7 +35,7 @@ const Tooltip = ({
     </View>
     <View style={[styles.bottomBar]}>
       {
-        !isLastStep ?
+        (!isLastStep && allowSkip) ?
           <TouchableOpacity onPress={handleStop}>
             <Button>{labels.skip || 'Skip'}</Button>
           </TouchableOpacity>

src/hocs/copilot.js

@@ -43,6 +43,7 @@ const copilot = ({
   svgMaskPath,
   verticalOffset = 0,
   wrapperStyle,
+  allowSkip = true,
 } = {}) =>
   (WrappedComponent) => {
     class Copilot extends Component<any, State> {
@@ -204,6 +205,7 @@ const copilot = ({
               prev={this.prev}
               stop={this.stop}
               visible={this.state.visible}
+              allowSkip={allowSkip}
               isFirstStep={this.isFirstStep()}
               isLastStep={this.isLastStep()}
               currentStepNumber={this.getStepNumber()}

src/hocs/copilot.test.js

@@ -133,6 +133,7 @@ it('shows the custom tooltip component if specified', async () => {
   const tooltip = tree.root.findByType(TooltipComponent);
 
   expect(tooltip).toBeDefined();
+  expect(tooltip.props).toHaveProperty('allowSkip');
   expect(tooltip.props).toHaveProperty('currentStep');
   expect(tooltip.props).toHaveProperty('handlePrev');
   expect(tooltip.props).toHaveProperty('handleNext');

src/index.d.ts

@@ -11,6 +11,7 @@ declare module '@okgrow/react-native-copilot' {
   };
 
   export type CopilotTooltipProps = {
+    allowSkip: boolean;
     isFirstStep: boolean;
     isLastStep: boolean;
     handleNext: () => void;