Integração com Svelte: Documentação da usePathname

A função usePathname retorna o pathname atual do navegador com o segmento da locale removido, como um store Svelte Readable<string>. É útil para construir navegação com reconhecimento de locale — por exemplo, determinar qual item de navegação está ativo — sem ter que remover o prefixo da locale manualmente.

Importando usePathname no Svelte

import { usePathname } from "svelte-intlayer";

Visão Geral

usePathname cria um store legível Svelte que lê window.location.pathname, remove o prefixo da locale através de getPathWithoutLocale, e emite um novo valor sempre que o navegador dispara um evento popstate (navegação voltar/avançar). Subscreva com a sintaxe de store $ em componentes.

Uso

<script lang="ts">  import { usePathname } from "svelte-intlayer";  export let href: string;  export let label: string;  const pathname = usePathname();</script><a {href} aria-current={$pathname === href ? "page" : undefined}>  {label}</a>

Valor de Retorno

Comportamento

• Remoção da locale: Remove o segmento inicial da locale (ex: /pt/dashboard → /dashboard).
• Reativo: Emite um novo valor a cada evento popstate (navegação de voltar/avançar do navegador).
• Seguro para SSR: Retorna "" quando window não está disponível.
• Limpeza: O listener de popstate é removido automaticamente quando o último subscritor se desinscreve.

Exemplo

<script lang="ts">  import { usePathname } from "svelte-intlayer";  const links = [    { href: "/dashboard", label: "Dashboard" },    { href: "/settings", label: "Configurações" },  ];  const pathname = usePathname();</script><nav>  {#each links as link}    <a      href={link.href}      style:font-weight={$pathname === link.href ? "bold" : "normal"}    >      {link.label}    </a>  {/each}</nav>

Relacionado

• useLocale — locale atual + seletor de locale
• getPathWithoutLocale — o utilitário subjacente usado por este hook