Form Builder

Create HTML input forms dynamically using Lit web components

About

This is a lightweight web component built with Lit that renders dynamic forms from JSON schemas.

Installation

npm install @uportal/form-builder

Publish to local Maven cache (~/.m2/repository)

To create a Jar of the built web component and publish to cache, run:

./gradlew jar
./gradlew publishToMavenLocal

Usage

<form-builder
  fbms-base-url="/fbms"
  fbms-form-fname="communication-preferences"
  oidc-url="/uPortal/api/v5-1/userinfo"
  styles="div {color:grey} span {color:orange}"
>
</form-builder>

Properties

• fbms-base-url: Base URL of the form builder micro service.
• fbms-form-fname: Form name that is appended to the fbms-base-url.
• oidc-url: Open ID Connect URL to authenticate requests.
• styles: Optional pass-through value to an HTML style tag in the render method.

Development

Prerequisites

• Node.js 18 or higher
• npm 9 or higher

Setup

# Install dependencies
npm install

# Start development server
npm run serve

# Run tests
npm test

# Build for production
npm run build

Scripts

• npm run dev - Build in watch mode
• npm run serve - Start development server with live reload
• npm test - Run tests with coverage
• npm run test:watch - Run tests in watch mode
• npm run lint - Check code with ESLint
• npm run format - Format code with Prettier
• npm run build - Build for production

Contributing

We welcome contributions! Please see CONTRIBUTING.md for guidelines.

Resources

Lit Framework

• Lit Documentation - Official Lit documentation
• Lit Tutorial - Getting started with Lit
• Lit Playground - Try Lit in your browser
• Lit Best Practices - Component patterns

Testing

• Web Test Runner - Our test framework
• Testing Lit Components - Lit-specific testing guide
• Open WC Testing - Testing utilities and helpers

Web Standards

• Web Components on MDN - Web Components fundamentals
• Custom Elements Everywhere - Framework compatibility

Related Projects

• Form Builder Microservice - Backend service for form definitions

License

Copyright 2018-2025 The Apereo Foundation. Licensed under the Apache License, Version 2.0. See LICENSE for details.