# XWUIHrPayrollRunList

Lightweight HR widget (extends `XWUIComponent`) for embedding a list of payroll runs inside a larger payroll screen. It renders a root `div.xwui-hr--payroll-run-list` (with `data-component="XWUIHrPayrollRunList"`) whose body is driven by `XWUIHrPayrollRunListLogic`/`projectHrPayrollRunListView`; the only `conf_comp` keys are `className` and `locale` (`en` or `ar`, default `en`), and `data` is open-ended. Use it as a composable payroll-run-list building block rather than a full routed page.

## Basic Usage

Instantiates the widget in `#app` with empty data and `locale: 'en'`.

```example
file: examples/BasicUsage.ts
html: examples/BasicUsage.html
title: Basic Usage
description: Creates an XWUIHrPayrollRunList widget with default data and an English locale.
```

## Arabic Locale

Renders the widget in Arabic by setting `locale: 'ar'`.

```example
file: examples/ArabicLocale.ts
html: examples/ArabicLocale.html
title: Arabic Locale
description: Sets locale to ar so the payroll run list renders its labels in Arabic, right-to-left.
```

## Custom Class

Adds a custom class to the widget root via the `className` config.

```example
file: examples/CustomClass.ts
html: examples/CustomClass.html
title: Custom Class
description: Passes className 'my-hr-widget' so callers can scope their own styles to the widget root.
```

```api
```