#Stagewise Extension | Cursor Seing your browser

95 messages · Page 1 of 1 (latest)

tired carbon
#

Hey Cursor community!

We’re excited to launch stagewise. An open source browser toolbar that gives your AI code editor actual eyesight.
Just click on a DOM element in your app, leave a comment, and your AI assistant (like Cursor) gets full context - element, hierarchy, screenshot, and more - so you stop pasting random code into prompts.

This project started from our own frustration: AI coding tools are powerful, but without UI context, they often miss the point. stagewise changes that.

🛠️ Built for frontend devs
🌐 Works in the browser
🤖 Talks to your editor
❤️ 100% open source (AGPL)

We’d love your feedback, feature ideas, and creative use cases.
Try the demo, explore the playgrounds, or drop into our Discord to chat.

The launch version supports Cursor and SDKs for React, Next, Vue and Nuxt as well as Vanilla JS. Github Copilot coming next!

https://github.com/stagewise-io/stagewise

Thanks for checking us out 🙌
stagewise team (Julian, Glenn and Nick)

GitHub
GitHub - stagewise-io/stagewise

Contribute to stagewise-io/stagewise development by creating an account on GitHub.

versed gate
#

This looks awesome, already giving them a try!

image.png
tired carbon
#

@versed gate awesome! Would love to hear your thoughts once you've used it

versed gate
#

This is going to be added into my daily extension usage, already helped me big time to solve a loop issue I've had on my page. @neon lantern You got to try this out.. @tribal shard @violet laurel

tired carbon
#

That's great to hear! If you run into bugs or think of features that would simplify the flow, feel free to text me or post on our Github 🙂

past hinge
#

Glad to see stagewise launch 😁

tired carbon
#

<@&1365224506234372168> we‘re currently kinda highjacking Cursor to get this working.

If any of the devs are down to talk about a potential API for Cursor, we’d love to have a chat!

versed gate
tired carbon
#

Awesome, thank you @versed gate!

versed gate
#

@tired carbon Noticed that instead of using ws, it might be possible to use wss for encrypted communication. Although this is local, metadata could still be visible perhaps?

Sitting on: toolbar/core/src/hooks/use-srpc-bridge.tsx lines 48-50

The security report will be sent to the repository in a couple.

image.png
tired carbon
versed gate
#

I've sent the security stage towards the repository.

tired carbon
#

Let Cursor see what's happening in the browser

strong belfry
tired carbon
# strong belfry say more! always interesting to hear how people use cursor in various ways

Hi @strong belfry !
This is how we currently insert our prompt and context into Cursor: https://github.com/stagewise-io/stagewise/blob/main/apps/vscode-extension/src/utils/call-cursor-agent.ts

It’d be amazing to have an API to purposefully communicate with Cursor and use the chat headless.

GitHub
stagewise/apps/vscode-extension/src/utils/call-cursor-agent.ts at m...

Contribute to stagewise-io/stagewise development by creating an account on GitHub.

tired carbon
#

Something like this would be super neat:

{
  "client": {
    "name": "Stagewise"
  },
  "payload": {
    "systemPrompt": "Attached to this message is a user defined prompt that should apply changes to the frontend codebase. There are also files attached to this message that you should use to apply the changes. You should apply the changes to the codebase and return the updated codebase.",
    "userPrompt": "Please change the color of the button to red.",
    "files": ["apps/website/src/components/Button.tsx"],
    "images": [],
    "autoSelect": false,
    "thinking": false,
    "model": "gpt-4o-mini"
  }
}

Technically exposing all the params a user can set manually in the Cursor agent panel.

versed gate
#

Stagewise Extension | Cursor Seing your browser

past hinge
final otter
#

Awesome, I've tracked your repo and look forward to enjoying your success dudes!

midnight gulch
#

@tired carbon Will this work for the web version in flutter?

tired carbon
midnight gulch
tired carbon
#

That’d shouldn’t be a problem though. We will soon add a configuration object for the toolbar so we can refine how we inject prompts based on the renderer/framework

echo mortar
#

mindblowing

tired carbon
final otter
#

install the OG while ya still can! 😄

tight mist
#

Free and better lol

tired carbon
opaque hawk
#

nice

modest gate
#

@tired carbon would you be willing to implement a functionality natively where this could work with shopify or is this something you're not interested in doing, Like Shopfies liquid code, a buddy of mine got it to work just now, just had to work around a few things and this would be so useful for the ecommerce niche

@chrome shell <-

tired carbon
modest gate
tired carbon
#

Awesome! For the moment it's probably best you work in a fork, we are still discussing how we do contributions and how we handle that with our licensing. Once we got this resolved (in the next weeks) we're happy about everyone who wants to help improve the product!

modest gate
tired carbon
#

Thanks for the kind words! Feel free to send a friend request and keep in touch about your work on the fork ❤️

tight pier
#

@tired carbon how long has this been a thing? lol I feel like I got a vheat code!

modest gate
tired carbon
#

Even less! We shared our announcement on the 09th of May

#

We shipped an alpha for a new UI yesterday. If you are curious about the next steps you can install the packages with @alpha in the end, like @stagewise/toolbar-next@alpha

#

Would love to get your thoughts on this!

modest gate
#

👀

tired carbon
modest gate
#

Honestly love this a lot more tbf 👀 🔥

#

Would you mind me asking what the initial backstory was for the project, since i saw you was the main developer for it, would love to know the backstory behind it.

tight pier
tired carbon
#

Thanks!

Sure, late last year I met Glenn and Julian the two other devs who were working on a startup which was already called stagewise. The old tool was more like a audit tool where you made comments and synced them with designers and project managers over Jira or Github (which was already technically super impressing), but they wanted to sunset it and work on something new.

I told them we could open source it, so their effort wasn't for nothing. In the process where we tried to clean up the repository we played around with some ideas and came up with the chat box and AI communication thing. From there we just started a new thing, took the old IP and a few core pieces from the code and build a whole new tool (the new stagewise). This happened in like the last 8-10 weeks or something

tired carbon
tight pier
tight pier
tired carbon
#

yes that's also something we're currently debugging. Seems like our css classes overwrite some of the project's classes we are injected in

tight pier
#

I fixed it

#

Also made it so you can set it to on / off or in this case true or false for having it active in the app after install

tired carbon
#

Good catch! How did you fit it?

tight pier
#

Which part?

tired carbon
tight pier
#

I meant workaround... or patch

I found that when used in cursor you can just look at the diff and watch for any css changes by adding it into the instructions and I run it with mcp sequential thinking

#

does this work with onlyt react?

tired carbon
tired carbon
tight pier
#

amazing

tight pier
#

lol

tight pier
chrome shell
tired carbon
normal tiger
#

Love your work here @tired carbon & team. It does feel like a cheat code as I'm just finish up all the logic in my app and needs to fix all UI stuff.. 🙂

tired carbon
#

@normal tiger thanks for the kind words! Happy we help you build faster! 😄

sage fulcrum
#

this is DOPE

carmine fox
#

Any recommendations on how to leverage this better for localhost? Seems like too many steps with creating a tunnel etc...

charred copper
modest gate
charred copper
#

OOO

#

On it

quasi slate
#

how to remove stagewise tool bar ?

tired carbon
#

If you render it conditonally only in dev environments, it will be automatically removed from production deployments

tired carbon
quasi slate
# tired carbon Otherwise you can just delete it again from your render tree

In my case I was using react+vite and it wasn't properly initiating with commands , had to manually install the toolbar but still, it couldn't interact with my LLM to cursor, may I was using vite frontened. So I uninstalled the npm package and stagewise extension from the IDE without sucess. Had to grep and remove all left over from main.js to get it removed completely. ☺️👍

tired carbon
quasi slate
tired carbon
tight pier
tired carbon
tight pier
#

sure

#

10000000%

#

if I just keep it updated with extension manager all is well

#

?

tired carbon
#

Yeah should all work fine!

tired carbon
#

@tight pier we just released a new version of the toolbar and extension and now support a window manager, so you can select which IDE window you want to send prompts to!

digital remnant
#

Amazing!

tight pier
glad shale
#

@tired carbon the way youre injecting the prompts is neat! Would love an API to connect too! Gonna give this a go tonight!

tired carbon
glad shale
#

Sorry, I meant an API for cursor to inject prompts etc. was rushing my reply 😔