useTitle

Sets document.title and can restore the previous value.

Import

import { useTitle } from '@kamod-ch/hooks'

Live demo

Basic demo

Sets document.title and can restore the previous value.

Browser-only demo

This demo starts after the page mounts in the browser.

import { useState } from 'preact/hooks'
import { useTitle } from '@kamod-ch/hooks'

export default function UseTitleDemo() {
  const [title, setTitle] = useState('Kamod Hooks demo title')
  useTitle(title, { restoreOnUnmount: false })

  return (
    <div>
      <input value={title} onInput={(event) => setTitle(event.currentTarget.value)} />
      <p><strong>document.title:</strong> {title}</p>
    </div>
  )
}

API

TypeScript signature

export interface Options {
    restoreOnUnmount?: boolean;
}
declare function useTitle(title: string, options?: Options): void;
export default useTitle;
/

SSR considerations

This hook touches browser APIs. Render it after mount or guard it with BrowserOnly in SSR and static builds.

Browser compatibility

Requires the corresponding browser API to exist in the current environment.