results are heavily truncated on mobile devices

[brc-dd]

Description

See vuejs/vitepress#5126

Steps to reproduce

1. Go to https://vitepress.dev/
2. Click on the search button
3. Resize the browser to mobile viewports
4. Search for layout slots

It shows like this even though there is significant space:

The API response is like this:

"_snippetResult": {
  "content": {
    "value": "… the theme via <mark>layout</mark> <mark>slots</mark>.",
    "matchLevel": "full"
  },
  "hierarchy": {
    "lvl1": {
      "value": "Extending the Default Theme ​",
      "matchLevel": "none"
    }
  }
}

It seems to be reproducible on DocSearch's official website too. For example:

Expected behavior

The server-side truncation should consider the element width, or maybe do the truncation on client side entirely?

Environment

• OS: macOS 26.3
• Browser: Chromium 145.0.7632.110
• DocSearch version: 4.5.3

[ChisakaKanako]

https://github.com/algolia/docsearch/blob/f86785218cb13a2cfa697003ca781dc1c83d56c8/packages/docsearch-react/src/DocSearchModal.tsx#L756C5-L757C33

It stipulates that only five words may be displayed in mobile view. This rule was introduced six years ago and is clearly outdated, presenting particularly poor results when displayed in Asian languages.

[dylantientcheu]

I agree, @ChisakaKanako what number of words would feel sensible to you on mobile?
We can use that as a default. How will you like it if we exposed this number?

or do you see this as something we can leave entirely to the frontend (screensize) to handle?

[ChisakaKanako]

Thanks!

I'd advocate for leaving this entirely to the frontend (screen size) to handle, with overflow wrapping to the next line rather than being truncated.

No matter what number of words is set as the default, there will always be some longer matches that cannot be fully displayed, for example, titles in Asian languages that naturally run longer. And if the number is set large enough that this is no longer a problem in practice, its effect becomes identical to simply leaving it to the frontend to handle.

The local search on vitepress is a good example:

2026-02-25.01.39.39.mov