policyengine-interactive-tools

Name: policyengine-interactive-tools
Availability: InStock
Author: PolicyEngine

Build Next.js 14 embeddable policy calculators and dashboards for policyengine.org.

2|Updated Mar 31, 2026

Search Tags:#dashboards #charts #nextjs #embed #policyengine #interactive-tools

Ready to run

npx skills add https://github.com/PolicyEngine/policyengine-skills --skill policyengine-interactive-tools

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: policyengine-interactive-tools
Source: https://github.com/PolicyEngine/policyengine-skills/tree/main/skills/tools-and-apis/policyengine-interactive-tools-skill
Command: npx skills add https://github.com/PolicyEngine/policyengine-skills --skill policyengine-interactive-tools

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Create standalone, embeddable policy tools (calculators, dashboards, charts) that plug into policyengine.org via an iframe.

Core Features & Use Cases

Next.js 14 App Router scaffold with Tailwind 4 styling
Recharts-powered visualizations and policy data dashboards
Reusable UI-kit theming and a lightweight embedding workflow for policyengine.org

Quick Start

Create a new Next.js tool project using the scaffold described and begin building an embeddable policyengine tool.

Frequently Asked Questions about policyengine-interactive-tools

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I build embeddable policy calculators and dashboards for policyengine.org?▼

Create standalone interactive policy tools using a Next.js 14 App Router scaffold with Tailwind 4 styling. The generated React application outputs interactive calculators and dashboards ready to embed in policyengine.org via an iframe.

Can I use Recharts and Tailwind 4 to create interactive policy visualizations?▼

Yes, Recharts powers the visualizations and Tailwind 4 provides the styling within the Next.js 14 scaffold. This combination generates interactive policy dashboards and charts with consistent UI-kit theming tokens.

What is the best way to embed a standalone React dashboard into policyengine.org?▼

Deploy the standalone Next.js dashboard to Vercel under the policyengine scope and embed the deployed application via an iframe. This lightweight embedding workflow integrates interactive policy tools directly into policyengine.org.

Does the PolicyEngine interactive tools scaffold include testing setup?▼

Yes, the scaffold includes Vitest for testing the Next.js 14 application. This testing framework validates the interactive calculators and policy dashboards before deploying the embeddable tools to Vercel.

How do I deploy interactive policy tools to Vercel under the PolicyEngine scope?▼

Build the Next.js 14 application and deploy the project to Vercel under the policyengine scope. This deployment outputs a live URL for the interactive policy tool, enabling seamless iframe embedding into policyengine.org.