mohebifar / mohebifar/react-native-copilot

Support for Multiple Walkthroughable Elements in a Single `CopilotStep`

Open
#334 0 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, thank you for creating and maintaining this great library!

I have a use case where I need to include multiple walkthroughable elements inside a single CopilotStep. Specifically, I have a View containing three Text components. I would like to make two of these Text components walkthroughable using const CopilotText = walkthroughable(Text);, while the third Text remains non-walkthroughable.

Here’s a simplified example of what I’m trying to achieve:

import { walkthroughable } from 'react-native-copilot';

const CopilotText = walkthroughable(Text);

<CopilotStep text="Step 1" order={1} name="step1">
  <View>
    <CopilotText>Walkthrough Text 1</CopilotText>
    <Text>Non-Walkthrough Text</Text>
    <CopilotText>Walkthrough Text 2</CopilotText>
  </View>
</CopilotStep>

Currently, it seems that the library does not support multiple walkthroughable elements within the same CopilotStep. Is there a way to achieve this with the current API? Or would this require an enhancement to the library?

If not supported, I believe this feature could be a valuable addition for scenarios where multiple interactive components need to be highlighted within a single logical step.

Looking forward to your response. Thank you for your time and for maintaining this awesome library!

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 at the walkthroughable API and CopilotStep behavior described in the issue, then verify how multiple walkthroughable children are currently handled. Done means one CopilotStep can contain two walkthroughable Text elements alongside a non-walkthroughable Text, with the intended highlighting and step behavior covered by tests.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
mobile
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.