# UI: Helpers

> cx and the texts the components show on their own.

Source: https://pithyx.org/docs/reference/sdk/ui/helpers/
Markdown: https://pithyx.org/docs/reference/sdk/ui/helpers.md

cx and the texts the components show on their own. Import the token file once (`@pithyx/ui/tokens.css`) and wrap the app in `UiProvider`; see [@pithyx/ui](https://pithyx.org/docs/sdk/ui/).

Generated from the TSDoc comments of @pithyx/ui 1.0.0-rc.9 at build time; the text below the headings is the comment in the source.

## Interfaces

### UiTexts

The texts the components show or announce on their own. They live with every other translation, in
`i18n/<lang>/ui.json` of the repository, and the build bundles them, so the package needs no i18n library.

#### Properties

##### password

```ts
password: object;
```

The reveal button of `PasswordField`.

###### show

```ts
show: string;
```

Label while the password is hidden.

###### hide

```ts
hide: string;
```

Label while the password is shown.

##### search

```ts
search: object;
```

The clear button of `SearchField`.

###### clear

```ts
clear: string;
```

Label of the clear button.

## Functions

### cx()

```ts
function cx(...names): string;
```

Joins class names, skipping empty values.

#### Parameters

| Parameter  | Type                                             | Description                                                               |
| ---------- | ------------------------------------------------ | ------------------------------------------------------------------------- |
| ...`names` | (`string` \| `false` \| `null` \| `undefined`)[] | Class names; `false`, `null`, `undefined` and empty strings are left out. |

#### Returns

`string`

The names joined by spaces.

#### Example

```ts
cx(styles.item, isActive && styles.active); // "item active" or "item"
```

---

### uiTexts()

```ts
function uiTexts(locale): UiTexts;
```

The texts for a locale such as `de-AT`, by its language; English for a language without texts.

#### Parameters

| Parameter | Type     | Description   |
| --------- | -------- | ------------- |
| `locale`  | `string` | A BCP 47 tag. |

#### Returns

[`UiTexts`](#uitexts)

The texts in that language, or in English.