# TextShimmer

> Text with a light sweep, used for "thinking…" labels.

Source: https://ui.jcsoftdev.com/docs/components/text-shimmer

Text with a light sweep, used for "thinking…" labels. Static with reduced motion.

## Import

```ts
import { TextShimmer } from "@jcsoftdev/ui/ai";
```

Single-component entry points tree-shake to just this component: `@jcsoftdev/ui/ai/text-shimmer`.

## Usage

```tsx
<TextShimmer duration={2}>
  Revisando la agenda de hoy…
</TextShimmer>
```

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `children` * | `ReactNode` |  |  |
| `as` | `ElementType` | `"span"` | Element to render. |
| `duration` | `number` | `2` | Seconds for one sweep. |
| `className` | `string` |  |  |

`*` marks a required prop.

## Storybook stories

- [Default](/storybook/?path=/story/ai-textshimmer--default)
- [Narrow](/storybook/?path=/story/ai-textshimmer--narrow)
- [Preset Brutal](/storybook/?path=/story/ai-textshimmer--preset-brutal)

## Source

`packages/ui/src/ai/text-shimmer/text-shimmer.tsx`