ui-arreya-widgets

Widget components for Arreya applications.

Installation

npm install ui-arreya-widgets

Peer Dependencies

Make sure you have these installed in your project:

npm install react react-dom

Usage

Import Widgets

import {
  RectangleWidget,
  CircleWidget,
  TextWidget,
  ImageWidget,
  VideoWidget,
  WeatherWidget,
  QRCodeWidget,
  CalendarWidget,
  WidgetRenderer,
  WIDGET_REGISTRY,
  WIDGET_CONFIG,
} from 'ui-arreya-widgets';

// Use individual widgets
<RectangleWidget config={rectangleConfig} />

// Or use the widget renderer
<WidgetRenderer config={widgetConfig} />

Import Types

import type {
  WidgetConfig,
  RectangleWidgetConfig,
  CircleWidgetConfig,
  TextWidgetConfig,
  ImageWidgetConfig,
  VideoWidgetConfig,
  WeatherWidgetConfig,
  QRCodeWidgetConfig,
  CalendarWidgetConfig,
  FieldSchema,
} from 'ui-arreya-widgets';

Widget Registry

import { WIDGET_REGISTRY, getAllWidgetMetadata, getWidgetComponent } from 'ui-arreya-widgets';

// Get all widget metadata
const allWidgets = getAllWidgetMetadata();

// Get a specific widget component
const TextWidget = getWidgetComponent('text');

Available Widgets

• RectangleWidget - Rectangle shape widget
• CircleWidget - Circle shape widget
• TextWidget - Text content widget
• ImageWidget - Image display widget
• VideoWidget - Video player widget
• WeatherWidget - Weather information widget
• QRCodeWidget - QR code generator widget
• CalendarWidget - Calendar/event display widget

Development

Building

Build the package (compiles TypeScript):

cd packages/ui-widgets
npm run build

This generates:

• dist/index.js and dist/index.mjs — compiled widgets
• dist/index.d.ts — TypeScript declarations
• dist/types/index.js and dist/types/index.mjs — compiled types
• dist/types/index.d.ts — TypeScript type declarations

Publishing a New Version

1. Make your changes to widgets or types

2. Build the package

   npm run build

3. Bump version and publish

   npm run publish:patch   # bug fixes (0.1.0 → 0.1.1)
   npm run publish:minor   # new features (0.1.0 → 0.2.0)
   npm run publish:major   # breaking changes (0.1.0 → 1.0.0)

4. Commit and push the version change

   git add packages/ui-widgets/package.json
   git commit -m "chore: bump ui-arreya-widgets to vX.X.X"
   git push

5. Update consuming projects

   npm update ui-arreya-widgets

Available Scripts

| Script | Description | |--------|-------------| | npm run build | Build widgets | | npm run dev | Watch mode for widgets | | npm run typecheck | Type check without emitting | | npm run publish:patch | Bump patch version and publish | | npm run publish:minor | Bump minor version and publish | | npm run publish:major | Bump major version and publish |

License

MIT