mohebifar / mohebifar/react-native-copilot

Custom component for `CopilotStep` text prop

Open
#342 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
2.4k
Forks
428
PR merge metrics
No merged PRs in 30d

Description

Hi! 👋

Is it currently feasible to pass a custom component as the value for the text prop?

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch react-native-copilot@3.3.3 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-copilot/dist/index.d.ts b/node_modules/react-native-copilot/dist/index.d.ts
index 8b9d6e7..ea8e4d7 100644
--- a/node_modules/react-native-copilot/dist/index.d.ts
+++ b/node_modules/react-native-copilot/dist/index.d.ts
@@ -9,7 +9,7 @@ interface Step {
     visible: boolean;
     wrapperRef: React.RefObject<NativeMethods>;
     measure: () => Promise<LayoutRectangle>;
-    text: string;
+    text: string | React$1.ReactNode
 }
 interface ValueXY {
     x: number;
@@ -49,7 +49,7 @@ declare function walkthroughable<P = any>(WrappedComponent: React__default.Compo
 interface Props {
     name: string;
     order: number;
-    text: string;
+    text: Step["text"];
     children: React__default.ReactElement<any>;
     active?: boolean;
 }

This issue body was partially generated by patch-package.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the Step and Props declarations in node_modules/react-native-copilot/dist/index.d.ts and compare them with the supplied patch. Confirm that CopilotStep can accept a React component as its text value and that the published declarations represent this consistently.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
mobile
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.