feat: Add custom widget handler for object

[pgoforth]

This provides the ability to add a custom widget handler for objects, avoiding the need for polymorphism in the object widget.

schema.json:

{ "title": "Extra Fields", "description": "An explanation of the fields below. This new container is an atonomous widget, that can have it's own styles, yet contain form fields...like a modal that displays a terms of service.", "properties": { "agree": { "title": "I agree", "description": "Checking this box indicates you agree to our terms of service.", "type": "boolean" } } }

uiSchema.json:

{ "ui:widget": "dialog", "agree": { "ui:widget": "checkbox" } }

Then you assign the custom handler when you are extending your form:

form.ts:

import { Jsf } from '@jsfe/form'; import { dialog } from './dialog'; export class JsfSystem extends Jsf { public widgets = { // standard widgets dialog, }; }

dialog.ts:

import { nothing, html } from 'lit'; import type { Widgets } from '@jsfe/types'; export const object: Widgets['object'] = (options) => html`  <div  role="dialog"  id=${options.id}  part="object"  >  ${options.label ? html`<h2>${options.label}</h2>` : ``}  <!-- -->  ${options.helpText  ? html`<p>${options.helpText}</p>`  : nothing}  <!-- -->  ${options.children}  </div> `;