# PageHeaderTitle

> Page title.

Source: https://ui.jcsoftdev.com/docs/components/page-header-title

Page title. Wrap a word in `<span className="text-accent-word">` to accent it.

## Import

```ts
import { PageHeaderTitle } from "@jcsoftdev/ui/containers";
```

Single-component entry points tree-shake to just this component: `@jcsoftdev/ui/containers/page-header`.

## Usage

```tsx
<PageHeaderTitle>
  <>
          <div>
            <PageHeaderEyebrow>Sábado 11 de octubre</PageHeaderEyebrow>
            <PageHeaderTitle>
              Agenda de <span className="text-accent-word">hoy</span>
            </PageHeaderTitle>
            <PageHeaderLede>
              12 citas con 3 barberos. Quedan 2 horarios libres por la tarde.
            </PageHeaderLede>
          </div>
          <PageHeaderActions>
            <Button variant="secondary">Bloquear horario</Button>
            <Button>Nueva cita</Button>
          </PageHeaderActions>
        </>
</PageHeaderTitle>
```

## Props

This component declares no props of its own.

It also accepts the native props of the element or primitive it renders (for example `className`, `id`, `aria-*` and event handlers).

## Storybook stories

- [Default](/storybook/?path=/story/containers-pageheader--default)
- [Title Only](/storybook/?path=/story/containers-pageheader--title-only)
- [Without Actions](/storybook/?path=/story/containers-pageheader--without-actions)
- [Narrow](/storybook/?path=/story/containers-pageheader--narrow)

## Source

`packages/ui/src/containers/page-header/page-header.tsx`