Adding Pro Inputs

Installing FormKit Pro is easy! Here are the steps:

1. Get a Project Key

Login to your FormKit Pro account at pro.formkit.com and create a project. A Project Key will be provided to you.

2. Install the package

Next, install the @formkit/pro:

npm install @formkit/pro

3. Configure your project

Import the createProPlugin helper and any desired Pro Inputs from @formkit/pro:

// main.js or formkit.config.ts
import { createProPlugin, rating, toggle } from '@formkit/pro'

// Create the Pro plugin with your `Project Key` and desired Pro Inputs:
const proPlugin = createProPlugin('fk-00000000000', {
  rating,
  toggle,
  // any other Pro Inputs
})

// add the plugin to your FormKit config:
const config = defaultConfig({
  plugins: [proPlugin],
})

Adding the Legacy Pro Genesis Theme

If you are using the legacy Genesis CSS theme, you will need to install the accompanying Pro CSS as well:

// main.js or formkit.config.ts
// Genesis for Pro is dependent on Genesis
import '@formkit/themes/genesis'
import '@formkit/pro/genesis'