LogoLogo
Quest HomeSign Up
  • 😀Welcome to Quest
  • Getting Started
    • Quest Overview
    • Helpful Resources
    • Quick Start - Build your first component from Figma
    • Quick Start - Build your first component from a Wireframe
    • AI Prompt
  • Fundamentals
    • Customizing & Using the UI Kit
    • Designing Custom Components in Figma
    • Easily Sync Designs without Losing Work
    • Setting Up Props & Bindings
    • Exporting Code
    • Push to your Repository
    • Creating Responsive Components
    • Nesting Components
    • Workspaces & Apps
    • Code & Preview Mode
    • Prototypes/Wireframes
    • Animations - build with React Spring
    • Quest plugin for Figma Dev Mode
    • Publish on Quest to a URL
  • Features
    • Working with Variants & States
    • Naming Conventions
    • Previewing with Custom Fonts
    • Light & Dark Mode
    • Creating a custom Tooltip
    • Creating a Floating Popover
    • Creating a Dialog pop-up
    • Radio Group
    • Using the MUI Data Grid & Table
    • Data & List Bindings
    • Dynamic Bindings
    • Grid
    • File Upload
    • Design System Tab and Theme Import
    • How-to use a Theme in your Application
    • Accessibility Support
    • Design Tips and Tricks
    • Video
    • Lazy Loading
    • Sticky Position
    • Link
    • Custom Breakpoints
    • Min / Max Width
    • Supported Quest UI Kit Components & How-to Make Edits in Figma
    • Supported Chakra Components & How-to Make Edits in Figma
  • Advanced Tutorials
    • Setting up Bindings and Features on the MUI Button
    • Display Repeating Components based on a Dynamic List
    • How-to Pass Values from Parent to Nested Components
    • How-to Invoke a modal Dialog Box from a Button Click
    • How to Setup a popover
  • 🔍Help
    • Product Updates
    • FAQs
    • Plugin Warnings / Alerts
  • 💡Support
    • Why does my design look different in Quest than Figma?
    • Can I keep making changes in Figma without affecting code?
    • What are some best practices?
    • Does Quest support more than Figma and React?
    • How do I manage users?
    • What is the refund process?
    • How do I get in touch with Quest?
    • Do I have to use MUI if I'm using Quest?
Powered by GitBook
On this page

Was this helpful?

  1. Getting Started

AI Prompt

Using Quest AI's AI Prompt field to generate code for your React components.

PreviousQuick Start - Build your first component from a WireframeNextCustomizing & Using the UI Kit

Last updated 1 year ago

Was this helpful?

The AI prompt inside of the Quest Editor Mode can be found in the bottom right corner of the window. You can use this add functionality with bindings super quickly without having to do them manually. Simply ask the AI Prompt to set things up and the code will be written for you. After it processes you'll likely see new bindings added to relevant layers and also you will see the code generated for you in the Code Mode. You prompts will be kept track in the prompt history above the prompt text field.

Some good examples for the prompt include:

store the email on state and validate if it's valid onBlur event

store the password on state and validate if it has 8 digits onBlur event

You are not limited to asking in the prompt to just one single element either. You can ask to validate an entire form with a complex prompt as well but be aware that this may increase the processing time.

Currently the AI Prompt is powered by GPT3.5. We plan to have the option to use GPT4 as well.

Because it is a LLM model, results can vary and we encourage you to view the Code for yourself. It can be a powerful, fast and easy way to add a lot of business logic to your components very quickly. For very large components, such as full webpages, it may fail if the amount of code the component contains exceeds the limit by the model.

We will continue to explore and update the prompt with the latest LLM models as they become available and we may offer options in the future to choose which company's model & version you prefer.

integrate with POST endpoint on enter button click sending email and password on the body

https://auth-app-express-xx7j2oyjmq-uc.a.run.app/signup