npm package: @imperosoft/ch5-typescript
Description: TypeScript declarations for Crestron CH5 Web Components with React JSX support
Author: Imperosoft
Latest version: 1.0.0

# ch5-typescript

TypeScript declarations for Crestron CH5 Web Components with React JSX support.

## Installation

```bash
npm install @imperosoft/ch5-typescript
```

## Usage

After installation, CH5 elements are automatically available in JSX:

```tsx
import React from 'react';

function App() {
  return (
    <div>
      {/* Simple click button */}
      <ch5-button sendeventonclick="101" label="Power" />

      {/* Toggle button with feedback */}
      <ch5-button
        sendeventonclick="101"
        receivestateselected="101"
        mode="toggle"
        label="Mute"
      />

      {/* Slider with analog join */}
      <ch5-slider
        sendeventonchange="1"
        receivestatevalue="1"
        orientation="vertical"
      />

      {/* Text display from serial join */}
      <ch5-text receivestatelabel="5" label="Default" />
    </div>
  );
}
```

## Join Communication

### Send Events (UI → Processor)

| Attribute | Description |
|-----------|-------------|
| `sendeventonclick` | Sends a pulse (true→false) on click/tap |
| `sendeventontouch` | Sends true every 200ms while touched, false on release |
| `sendeventonchange` | Sends value changes (analog/serial joins) |

### Receive States (Processor → UI)

| Attribute | Description |
|-----------|-------------|
| `receivestateselected` | Digital join: true = selected/pressed state |
| `receivestatevalue` | Analog join: numeric value (0-65535) |
| `receivestatelabel` | Serial join: text content |
| `receivestateshow` | Digital join: true = visible, false = hidden |
| `receivestateenable` | Digital join: true = enabled, false = disabled |

## Event Behavior

### sendeventonclick (Press Mode)

Sends a momentary pulse when clicked:
1. User presses → sends `true`
2. Immediately sends `false` (pulse)

### sendeventontouch (Touch Mode)

For hold-to-repeat functionality:
1. User presses → sends `true`
2. While held → sends `true` every 200ms
3. User releases → sends `false`

## Included Components

- `ch5-animation` - Animation object
- `ch5-background` - Background with video support
- `ch5-button` - Interactive button
- `ch5-button-list` - Button collection
- `ch5-color-chip` - RGB color display
- `ch5-color-picker` - Color selection
- `ch5-datetime` - Date/time display
- `ch5-dpad` - Directional pad
- `ch5-form` - Form container
- `ch5-image` - Image display
- `ch5-import-htmlsnippet` - HTML snippet loader
- `ch5-jointotext-boolean` - Digital to text
- `ch5-jointotext-numeric` - Analog to text
- `ch5-jointotext-string` - Serial to text
- `ch5-keypad` - Numeric keypad
- `ch5-list` - Dynamic list
- `ch5-media-player` - Audio player (Beta)
- `ch5-modal-dialog` - Modal dialog
- `ch5-overlay-panel` - Overlay container
- `ch5-qrcode` - QR code generator
- `ch5-segmented-gauge` - LED gauge
- `ch5-select` - Selection list
- `ch5-select-option` - Select option
- `ch5-signal-level-gauge` - Signal level display
- `ch5-slider` - Analog slider
- `ch5-spinner` - Loading spinner
- `ch5-subpage-reference-list` - Subpage list
- `ch5-tab-button` - Tabbed buttons
- `ch5-template` - Template instantiation
- `ch5-text` - Text display
- `ch5-textinput` - Text input
- `ch5-toggle` - Toggle switch
- `ch5-triggerview` - View switcher
- `ch5-video` - Video player
- `ch5-video-switcher` - Video switching
- `ch5-wifi-signal-level-gauge` - WiFi signal display

## Exported Types

```typescript
import type {
  JoinType,
  CrComLibInterface,
  WebXPanelInterface,
  Ch5Size,
  Ch5Stretch,
  Ch5Type,
  Ch5Orientation,
  Ch5ButtonShape,
  Ch5ButtonMode,
  Ch5IconPosition,
  Ch5HandleShape,
  Ch5CommonAttributes,
  // ... and more
} from '@imperosoft/ch5-typescript';
```

## Documentation

- [Crestron CH5 Documentation](https://sdkcon78221.crestron.com/sdk/Crestron_HTML5UI/Content/Topics/Home.htm)
- [CH5 Components Reference](https://sdkcon78221.crestron.com/sdk/Crestron_HTML5UI/Content/Topics/UI-QS-Common-Attribute-Property.htm)

## License

MIT