# motion/title-text (zidane-ui)

Import: `import { … } from 'zidane-ui'`. Source: [ui/src/motion/title-text.tsx](https://github.com/Tahul/zidane/blob/main/ui/src/motion/title-text.tsx).

## Components

### `TitleText`

Component.

Renders a title that writes itself in when it changes: the new title appears word by word,
each word sharpening out of a soft blur. It stays inline text, so a truncating parent keeps
working. The first render, a change of `scope` and reduced or off motion show the title as
it is.

```ts
function TitleText(props: TitleTextProps): Element
```

**Parameters**

- `props` (`TitleTextProps`): Component props.

**Returns** `Element`

**Props**

- `display?` (`ReactNode`): What to show for it, when not the plain text.
- `scope?` (`unknown`): What the title belongs to (a session id): a change of scope never animates.
- `text` (`string`): The title; a change of it is what animates.

Source: [ui/src/motion/title-text.tsx:39](https://github.com/Tahul/zidane/blob/main/ui/src/motion/title-text.tsx#L39)

## Interfaces

### `TitleTextProps`

Interface.

Props for [`TitleText`](https://zidane.si/docs/reference/ui-motion-title-text.md#TitleText).

```ts
interface TitleTextProps
```

**Properties**

- `display?` (`ReactNode`): What to show for it, when not the plain text.
- `scope?` (`unknown`): What the title belongs to (a session id): a change of scope never animates.
- `text` (`string`): The title; a change of it is what animates.

Source: [ui/src/motion/title-text.tsx:22](https://github.com/Tahul/zidane/blob/main/ui/src/motion/title-text.tsx#L22)