@cdx-extensions/widget-template

Nx plugin providing generators, executors, and CLI tools for the DBK Platform.

Installation

npm install @cdx-extensions/widget-template
# or
yarn add @cdx-extensions/widget-template

Usage Methods

You can use the dependency sync tools in two ways:

1. Nx Executor (Recommended) - Integrated into your Nx workspace
2. CLI Tools - Standalone command-line tools

1.Manual Generator: You can manually run the setup generator:

nx generate @cdx-extensions/widget-template:setup-dependency-sync

Note: The executor is also automatically added to all widgets generated with this plugin, but using it at the root level is recommended for workspace-wide checks.

📋 DEPENDENCIES:

react Platform: 18.2.0 Source: 18.3.0

@mui/material Platform: 5.17.1 Source: 5.18.0

================================================================================

Generators

This plugin provides Nx generators to widgets.

Overview

The generators help you quickly create new projects with the proper structure and configuration:

• widget - Generates a new widget application

widget Generator

Generates a scaffold for an widget application. Widgets are standalone applications that can be rendered within the platform.

Basic Usage

nx generate @cdx-extensions/widget-template:widget <name>

Options

• name (required) - Name of the widget (e.g., example will create example-widget)

Examples

# Generate a basic widget
nx generate @cdx-extensions/widget-template:widget example


# Or use the short form
nx g @cdx-extensions/widget-template:widget example

Interactive Prompts

When running the generator, you'll be prompted:

• "What name would you like to use?" - Enter the widget name
• "Will this widget be rendered in the Widget Stack?" - Answer y or N (or use --stackWidget flag)

Generated Structure

The generator creates a new Nx project under the /apps directory with:

• React application setup
• TypeScript configuration
• Jest testing configuration
• ESLint configuration
• Project configuration in project.json (including check-dependency-sync target)

Running the Generated Widget

After generation, you can run your widget:

nx serve example-widget

Open your browser and navigate to http://localhost:4200/ to view the widget.