@stapel/search-react 0.23.0 → 0.25.0

package/src/default/SearchPage.tsx

@@ -86,6 +86,7 @@ import { FilterChips } from "./FilterChips.js";
 import { LocationSummaryLine } from "./LocationSummaryLine.js";
 import { PageSizeSelect } from "./PageSizeSelect.js";
 import { SearchBox } from "./SearchBox.js";
+import type { OtherCategoryNamer } from "./OtherCategoriesLine.js";
 import { SearchResultsPane } from "./SearchResultsPane.js";
 import type { SearchResultsWrapper } from "./SearchResultsPane.js";
 import { SortSelect } from "./SortSelect.js";
@@ -240,7 +241,7 @@ export interface SearchPageProps extends ThemeModeProp, ParseSearchStateOptions
    * What the current category is CALLED — the chip's own text. The pair holds
    * a path of slugs and no way to turn one into a catalogue name; absent, the
    * chip states the path's last segment. See
-   * {@link FilterChipsProps.categoryLabel}.
+   * {@link FilterChipsOpenerProps.categoryLabel}.
    */
   readonly categoryLabel?: ReactNode;
   /** The location control slot (`geo-react`). */
@@ -305,6 +306,40 @@ export interface SearchPageProps extends ThemeModeProp, ParseSearchStateOptions
    * describes the whole page, not the results column of it.
    */
   readonly resultsHeader?: ReactNode;
+  /**
+   * Draw the APPLIED filter row in the results header — one chip per applied
+   * value and per applied range, each of which removes it
+   * (`<FilterChips mode="applied">`).
+   *
+   * `"desktop"` is the shape this exists for: where the rail is on screen a
+   * choice otherwise leaves no trace above the results and dropping one of
+   * two constraints means hunting its button back down the column, while on
+   * the phone the opener row below already states every applied filter on its
+   * own chips. `true` draws it in both layouts; omitted, nothing changes.
+   *
+   * It renders itself away when nothing is applied, so a host never has to
+   * ask.
+   */
+  readonly appliedChips?: boolean | "desktop";
+  /**
+   * Draw "Search in other categories: Cars 12 · Buses 3 · …" above the
+   * results — one line, from the SAME response the cards came from.
+   *
+   * It replaces the shape a storefront had built by hand: a full-width block
+   * of one row per category, fetched from `/suggest` after the page had
+   * settled and pushing everything below it when it landed. Here the rows are
+   * `facet_meta.categories`, which the answer already carried, so with results
+   * on screen the line costs no request and cannot arrive late. Only an EMPTY
+   * result set asks `/suggest`, into a slot whose height is reserved from the
+   * first frame.
+   *
+   * Opt-in, and `categoryName` is what makes it useful: the pair holds id
+   * paths and no catalogue — see {@link OtherCategoriesLineProps.categoryName}.
+   */
+  readonly otherCategories?: boolean;
+  /** What a category id path is CALLED, for the line above. The same question
+   * `categoryLabel` answers for the chip, asked once per row. */
+  readonly categoryName?: OtherCategoryNamer;
   /** What this surface calls its result list. See
    * {@link SearchResultsPaneProps.heading}. */
   readonly resultsHeading?: ReactNode;
@@ -401,6 +436,9 @@ interface SearchPageBodyProps {
   readonly footer?: ReactNode;
   readonly filtersHeader?: ReactNode;
   readonly resultsHeader?: ReactNode;
+  readonly appliedChips?: boolean | "desktop";
+  readonly otherCategories?: boolean;
+  readonly categoryName?: OtherCategoryNamer;
   readonly resultsHeading?: ReactNode;
   readonly degradationNotice?: DegradationNoticeVariant;
   readonly filtersLayout?: SearchFiltersLayout;
@@ -570,6 +608,12 @@ function SearchPageBody(props: SearchPageBodyProps): ReactElement {
       {...(view.layout !== undefined ? { layout: view.layout } : {})}
       {...(props.renderCard !== undefined ? { renderCard: props.renderCard } : {})}
       {...(props.footer !== undefined ? { footer: props.footer } : {})}
+      {...(props.otherCategories !== undefined
+        ? { otherCategories: props.otherCategories }
+        : {})}
+      {...(props.categoryName !== undefined
+        ? { categoryName: props.categoryName }
+        : {})}
       {...(props.resultsHeading !== undefined
         ? { heading: props.resultsHeading }
         : {})}
@@ -637,6 +681,20 @@ function SearchPageBody(props: SearchPageBodyProps): ReactElement {
         <div data-testid="search-results-header">{props.resultsHeader}</div>
       )}
 
+      {/* What the search is NARROWED to, above the results, each constraint
+          beside the control that drops it. Drawn in the same band as the
+          results header because that is where a host would otherwise hand-mount
+          it — and it draws nothing at all when nothing is applied. */}
+      {(props.appliedChips === true ||
+        (props.appliedChips === "desktop" && layout !== "sheet")) && (
+        <FilterChips
+          mode="applied"
+          {...(categoryFeatures !== undefined ? { categoryFeatures } : {})}
+          {...(locale !== undefined ? { locale } : {})}
+          {...(resolveFacetLabels !== undefined ? { resolveFacetLabels } : {})}
+        />
+      )}
+
       {showFilters && layout === "sheet" ? (
         <>
           {/* The phone's filter row. It REPLACES the full-width "Filters (3)"
@@ -732,6 +790,9 @@ export function SearchPage(props: SearchPageProps): ReactElement {
     footer,
     filtersHeader,
     resultsHeader,
+    appliedChips,
+    otherCategories,
+    categoryName,
     resultsHeading,
     degradationNotice,
     filtersLayout,
@@ -766,6 +827,9 @@ export function SearchPage(props: SearchPageProps): ReactElement {
           {...(footer !== undefined ? { footer } : {})}
           {...(filtersHeader !== undefined ? { filtersHeader } : {})}
           {...(resultsHeader !== undefined ? { resultsHeader } : {})}
+          {...(appliedChips !== undefined ? { appliedChips } : {})}
+          {...(otherCategories !== undefined ? { otherCategories } : {})}
+          {...(categoryName !== undefined ? { categoryName } : {})}
           {...(resultsHeading !== undefined ? { resultsHeading } : {})}
           {...(degradationNotice !== undefined ? { degradationNotice } : {})}
           {...(filtersLayout !== undefined ? { filtersLayout } : {})}

package/src/default/SearchResultsPane.tsx

@@ -46,6 +46,8 @@ import { SEARCH_I18N_KEYS } from "../i18n/keys.js";
 import { DegradationNotice } from "./DegradationNotice.js";
 import { EmptyExits } from "./EmptyExits.js";
 import type { DegradationNoticeVariant } from "./DegradationNotice.js";
+import { OtherCategoriesLine } from "./OtherCategoriesLine.js";
+import type { OtherCategoryNamer } from "./OtherCategoriesLine.js";
 import { SearchResultCard } from "./SearchResultCard.js";
 import type { SearchCardRenderer } from "./SearchResultCard.js";
 import type { SearchResultsLayout } from "./ViewSwitch.js";
@@ -261,6 +263,20 @@ export interface SearchResultsPaneProps extends ThemeModeProp {
    * this pair offers the slot and never the tree.
    */
   readonly renderEmptyExits?: () => ReactNode;
+  /**
+   * Draw "Search in other categories: Cars 12 · Buses 3 · …" above the
+   * results — the sections THIS answer is made of, one line, from the same
+   * response (`<OtherCategoriesLine>`).
+   *
+   * Opt-in, because the rows are id PATHS and naming them is the host's
+   * (`categoryName`): a deployment that passes neither gets the line only for
+   * the paths the server itself named, which on a slug-less catalogue is
+   * none. Where it is on, it costs no request while there are results.
+   */
+  readonly otherCategories?: boolean;
+  /** What a category id path is CALLED, for the line above — see
+   * {@link OtherCategoriesLineProps.categoryName}. */
+  readonly categoryName?: OtherCategoryNamer;
 }
 
 function Count(props: { bag: SearchResultsBag }): ReactElement | null {
@@ -375,6 +391,18 @@ export function SearchResultsPane(props: SearchResultsPaneProps): ReactElement {
               scorerName={scorerName}
             />
 
+            {/* ABOVE the results and in the SAME frame as them. Under them
+                and asynchronously is where it was, and both halves of that
+                pushed a page a person had started reading. */}
+            {props.otherCategories === true && (
+              <OtherCategoriesLine
+                {...(props.enabled !== undefined ? { enabled: props.enabled } : {})}
+                {...(props.categoryName !== undefined
+                  ? { categoryName: props.categoryName }
+                  : {})}
+              />
+            )}
+
             <LoadList
               state={bag.state}
               testId="search"

package/src/default/index.ts

@@ -48,6 +48,19 @@ export {
 } from "./SearchPage.js";
 export type { SearchPageProps, SearchFiltersLayout } from "./SearchPage.js";
 
+export {
+  OtherCategoriesLine,
+  OTHER_CATEGORIES_CLASS,
+  OTHER_CATEGORIES_PHONE_ROWS,
+  OTHER_CATEGORIES_SLOT_MIN_HEIGHT,
+  OTHER_CATEGORIES_STYLE_HREF,
+  otherCategoriesCss,
+} from "./OtherCategoriesLine.js";
+export type {
+  OtherCategoriesLineProps,
+  OtherCategoryNamer,
+} from "./OtherCategoriesLine.js";
+
 export { SearchResultsPane, RESULTS_MAX_WIDTH } from "./SearchResultsPane.js";
 export type {
   SearchResultsPaneProps,
@@ -61,12 +74,26 @@ export {
   CHIP_ROW_CAP,
   CHIP_ROW_CLASS,
   CHIP_ROW_STYLE_HREF,
+  appliedChipTestId,
+  buildAppliedChips,
   capChipRow,
   categoryLeaf,
   chipRowCss,
   orderChipFilters,
+  rangeChipText,
+  rangeLabelSource,
+} from "./FilterChips.js";
+export type {
+  AppliedChip,
+  AppliedChipTarget,
+  ChipBand,
+  ChipSpec,
+  FilterChipsAppliedProps,
+  FilterChipsCommonProps,
+  FilterChipsMode,
+  FilterChipsOpenerProps,
+  FilterChipsProps,
 } from "./FilterChips.js";
-export type { ChipBand, ChipSpec, FilterChipsProps } from "./FilterChips.js";
 export { EmptyExits, RADIUS_WIDEN_FACTOR, parentCategory } from "./EmptyExits.js";
 export type { EmptyExitsProps } from "./EmptyExits.js";
 

package/src/headless/useOtherCategories.ts

@@ -0,0 +1,193 @@
+/**
+ * "The same query, in another section" — the categories THIS answer is made
+ * of, read out of the answer that drew the cards.
+ *
+ * ## What it replaces
+ *
+ * A storefront drew this as a full-width block under the results: one row per
+ * category, fetched from `/suggest` AFTER the page had settled, so a tall
+ * panel appeared a beat late and pushed everything a person was already
+ * reading. Both halves were avoidable. The block was tall where one line
+ * says the same thing, and the request was a second ask for something the
+ * page already had: `/query` answers with `facet_meta.categories` — `{path,
+ * count}` for every category the candidate set contains — and that is
+ * exactly the list the block was printing.
+ *
+ * So the rows come from the SEARCH response. No request of this hook's own
+ * while there are results, and therefore nothing to arrive late.
+ *
+ * ## The one case that DOES earn a request
+ *
+ * An empty result set has no candidates, so `facet_meta.categories` is empty
+ * too — and that is precisely the screen where "this word exists in these
+ * sections" is worth the most. There, and only there, `/suggest` is asked.
+ * The bag says so through {@link OtherCategoriesBag.reserving}, so a surface
+ * can hold the row's height from the first frame instead of letting the
+ * answer push the page a second time.
+ *
+ * ## Names come from the cache, not from a request
+ *
+ * `facet_meta.categories` carries id PATHS and counts, never names — the
+ * catalogue belongs to `categories-react`. Three sources are tried, in order:
+ *
+ *  1. the host's resolver (a surface prop), which is the only one that can
+ *     name an id path with certainty;
+ *  2. the `/suggest` answer ALREADY IN THE QUERY CACHE — the type-ahead asked
+ *     about this same word a keystroke earlier, and its rows carry the
+ *     server's own names. `useSuggest` with `enabled: false` hands back a
+ *     cached answer and fires nothing, so this costs no request;
+ *  3. the path's last segment, when it is a slug rather than a number.
+ *
+ * A row none of the three can name is DROPPED rather than printed as "163" —
+ * the same rule `categoryLeaf` states for the category chip.
+ */
+import type { SearchResponse, SuggestCategory } from "../api/types.js";
+import { useSearchQuery, useSuggest } from "../model/queries.js";
+import { offerableCategories } from "./useSearchBox.js";
+import { useSearchState } from "./SearchStateProvider.js";
+
+/** How many entries the line prints before it folds the rest. */
+export const OTHER_CATEGORIES_LIMIT = 8;
+
+/**
+ * The phone's cap.
+ *
+ * Half the desktop's, because the requirement is a LINE and at 390px eight
+ * entries are not one — they are the block this replaces, wearing a comma.
+ * Four short section names plus the fold marker are the two rows a phone can
+ * spend on a navigation aid above a list of cards.
+ */
+export const OTHER_CATEGORIES_PHONE_LIMIT = 4;
+
+/** One category the current answer reached, with the count that answer gives it. */
+export interface OtherCategoryRow {
+  /** The slash-joined id path — the same string the `category` filter takes,
+   * so narrowing to it needs no translation and no tree. */
+  readonly category: string;
+  /** Documents matching THIS query that live there. Scoped to the query, which
+   * is why narrowing the search is the honest destination and the bare
+   * category feed is not: the feed would show a different number. */
+  readonly count: number;
+  /** The server's own name, when this row came from `/suggest` or when a
+   * cached suggest answer named the same path. */
+  readonly name?: string;
+  /** Display names root→leaf, when the server sent them. */
+  readonly path?: readonly string[];
+}
+
+export interface OtherCategoriesBag {
+  /** Every row, uncapped and in the order the line should print them. Capping
+   * is a decision about the SURFACE (a phone takes fewer), so it is not made
+   * here. */
+  readonly rows: readonly OtherCategoryRow[];
+  /**
+   * Where the rows came from. `"results"` — the search response itself, drawn
+   * in the same frame as the cards. `"suggest"` — the empty-result path, the
+   * only one with a request behind it. `"none"` — nothing to offer.
+   */
+  readonly source: "results" | "suggest" | "none";
+  /**
+   * The empty-result path is active, so a row is coming from a request that
+   * has not landed (or landed empty). A surface keeps the height either way:
+   * space reserved from the first frame is space nothing can push.
+   */
+  readonly reserving: boolean;
+  /** That request is in flight right now. */
+  readonly pending: boolean;
+}
+
+const NO_ROWS: readonly OtherCategoryRow[] = [];
+
+/** The path's last segment, when it names something — never a bare id. */
+export function otherCategoryLeaf(category: string): string | undefined {
+  const parts = category.split("/").filter((part) => part.length > 0);
+  const leaf = parts[parts.length - 1];
+  if (leaf === undefined || /^\d+$/.test(leaf)) return undefined;
+  return leaf;
+}
+
+/** The rows the ANSWER carries, busiest first and without the section the
+ * search is already in. */
+function rowsFromResponse(
+  answer: SearchResponse | undefined,
+  applied: string | undefined,
+  named: ReadonlyMap<string, SuggestCategory>
+): readonly OtherCategoryRow[] {
+  const meta = answer?.facet_meta.categories ?? [];
+  const rows = meta
+    // "Other" than the one the search is in. Descendants stay: narrowing from
+    // a branch to one of its leaves is a different section and the move this
+    // line exists for.
+    .filter((row) => row.category !== applied)
+    .map((row) => {
+      const match = named.get(row.category);
+      return {
+        category: row.category,
+        count: row.count,
+        ...(match !== undefined ? { name: match.name, path: match.path } : {}),
+      };
+    });
+  // The server documents "busiest first" and the cap has to take the busiest
+  // eight; asserting the order here is cheaper than trusting it and being
+  // wrong about which eight a person sees.
+  return [...rows].sort((a, b) =>
+    b.count === a.count ? a.category.localeCompare(b.category) : b.count - a.count
+  );
+}
+
+export function useOtherCategories(
+  options: { readonly enabled?: boolean } = {}
+): OtherCategoriesBag {
+  const { state } = useSearchState();
+  const enabled = options.enabled ?? true;
+
+  // The SAME query the results pane runs: identical key, identical cache
+  // entry, no second request. This hook can therefore be mounted anywhere
+  // under the provider without the envelope having to be threaded to it.
+  const query = useSearchQuery(state, { enabled });
+  const answer = query.data;
+
+  // Ready AND empty. `answer === undefined` is "still loading", which is not
+  // an empty result and must not spend a request.
+  const resultsEmpty = enabled && answer !== undefined && answer.items.length === 0;
+
+  // `enabled: false` still returns whatever the box already put in the cache
+  // and asks nothing — which is how a page WITH results gets the server's
+  // names for free. A page WITHOUT results turns the same hook into the one
+  // request this feature ever makes.
+  const suggest = useSuggest({ type: state.type, q: state.q, enabled: resultsEmpty });
+  // Through the pair's own reader, which is where "this server sent no
+  // categories key at all" is already distinguished from "nothing matched".
+  const suggested = offerableCategories(suggest.data);
+  const named = new Map(suggested.map((row) => [row.category, row]));
+
+  const fromResults = rowsFromResponse(answer, state.category, named);
+
+  const pending = resultsEmpty && suggest.isLoading && suggest.fetchStatus === "fetching";
+
+  if (fromResults.length > 0) {
+    return { rows: fromResults, source: "results", reserving: false, pending: false };
+  }
+
+  if (resultsEmpty) {
+    // The server's rank order is kept as sent: `/suggest` ranks by match grade
+    // and stock before count, and re-sorting by count here would throw that
+    // away for a number that is not what ranked them.
+    const rows = suggested
+      .filter((row) => row.category !== state.category)
+      .map((row) => ({
+        category: row.category,
+        count: row.count,
+        name: row.name,
+        path: row.path,
+      }));
+    return {
+      rows,
+      source: rows.length > 0 ? "suggest" : "none",
+      reserving: true,
+      pending,
+    };
+  }
+
+  return { rows: NO_ROWS, source: "none", reserving: false, pending: false };
+}

package/src/i18n/es.ts

@@ -119,12 +119,22 @@ export const searchI18nBundleEs: I18nDictionary = {
   "search.filters.short": "Filtros",
   "search.filters.chip_more": ", +{count}",
   "search.filters.chips_overflow": "Más · {count}",
+  "search.filters.applied_label": "Filtros aplicados",
+  "search.filters.chip_pair": "{name}: {value}",
+  "search.filters.chip_remove": "Quitar el filtro {filter}",
+  "search.filters.chip_range_between": "de {from} a {to}",
+  "search.filters.chip_range_from": "desde {from}",
+  "search.filters.chip_range_to": "hasta {to}",
 
   "search.empty.exits_title": "Prueba a ampliar la búsqueda",
   "search.empty.up_a_level": "Subir un nivel",
   "search.empty.widen_radius": "Buscar en un radio de {km} km",
   "search.empty.anywhere": "Buscar en todas partes",
   "search.empty.drop_filter": "Sin «{name}»",
+
+  "search.other_categories.label": "Buscar en otras categorías:",
+  "search.other_categories.narrow": "Buscar en {name}",
+  "search.other_categories.more": "{count} más",
   "search.category.title": "Categoría",
   "search.category.clear": "Buscar en todo el catálogo",
   "search.category.current": "Buscando dentro de {path}",

package/src/i18n/keys.ts

@@ -232,6 +232,25 @@ export const SEARCH_I18N_KEYS = {
    * `{count}` is how many chips it hides (D16). */
   filtersChipOverflow: "search.filters.chips_overflow",
 
+  // ── the APPLIED row (`<FilterChips mode="applied">`) ─────────────────────
+  /** The accessible name of the applied row. Distinct from
+   * `filtersChipsLabel`: that row OPENS pickers, this one DROPS filters, and
+   * a screen reader announcing both as "Filters" states neither. */
+  filtersAppliedLabel: "search.filters.applied_label",
+  /** One applied chip's caption: the axis AND the value — "Brand: Bosch".
+   * A chip printing the value alone states a constraint without saying what
+   * it constrains, which beside a rail of a dozen axes names nothing. */
+  filtersChipPair: "search.filters.chip_pair",
+  /** The accessible name of an applied chip: pressing it REMOVES the filter,
+   * and the caption alone never says so. `{filter}` is the caption. */
+  filtersChipRemove: "search.filters.chip_remove",
+  /** A numeric constraint with both bounds, as one phrase. */
+  filtersChipRangeBetween: "search.filters.chip_range_between",
+  /** A lower bound alone. */
+  filtersChipRangeFrom: "search.filters.chip_range_from",
+  /** An upper bound alone. */
+  filtersChipRangeTo: "search.filters.chip_range_to",
+
   // ── a partition: one template split by a value its children name ─────────
   /**
    * The first chip of a partition row — the parent itself, unnarrowed.
@@ -263,6 +282,33 @@ export const SEARCH_I18N_KEYS = {
   /** "Without {name}" — one applied filter, named as its own chip names it. */
   emptyDropFilter: "search.empty.drop_filter",
 
+  // ── the same query, in another section (one line, from the answer) ───────
+  /**
+   * The line's lead-in — "Search in other categories:". It ends in a colon
+   * because what follows is a list on the same line, and a translator who is
+   * shown the string without one has no way to know that.
+   *
+   * Not `search.box.categories` ("Sections", the type-ahead's group heading):
+   * that one titles a menu of destinations while a person types, this one
+   * introduces a row of narrowings beside a result list. Same noun, two
+   * surfaces, and the languages that decline it need both.
+   */
+  otherCategoriesLabel: "search.other_categories.label",
+  /**
+   * The accessible name of one entry. The visible caption is "Cars 12" — a
+   * name and a number, which says nothing about what pressing it DOES. This
+   * does: it narrows the search that is already on screen, and it keeps the
+   * query, which is why the number beside it stays true afterwards.
+   */
+  otherCategoriesNarrow: "search.other_categories.narrow",
+  /**
+   * The fold at the end of the line: how many sections it did not print.
+   * `{count}` is a bare number after a word, not a counted noun in a
+   * sentence, so this is not a plural family — the same shape as
+   * `facetsAllFilters` and `filtersChipOverflow`.
+   */
+  otherCategoriesMore: "search.other_categories.more",
+
   // ── category (a host slot, plus the control that removes it) ─────────────
   categoryTitle: "search.category.title",
   categoryClear: "search.category.clear",
@@ -542,12 +588,23 @@ export const searchI18nBundleEn: Record<string, string> = {
   "search.filters.short": "Filters",
   "search.filters.chip_more": ", +{count}",
   "search.filters.chips_overflow": "More · {count}",
+  "search.filters.applied_label": "Applied filters",
+  "search.filters.chip_pair": "{name}: {value}",
+  "search.filters.chip_remove": "Remove filter {filter}",
+  "search.filters.chip_range_between": "from {from} to {to}",
+  "search.filters.chip_range_from": "from {from}",
+  "search.filters.chip_range_to": "up to {to}",
 
   "search.empty.exits_title": "Try widening the search",
   "search.empty.up_a_level": "Go up a level",
   "search.empty.widen_radius": "Search within {km} km",
   "search.empty.anywhere": "Search anywhere",
   "search.empty.drop_filter": "Without {name}",
+
+  "search.other_categories.label": "Search in other categories:",
+  "search.other_categories.narrow": "Search in {name}",
+  "search.other_categories.more": "{count} more",
+
   "search.category.title": "Category",
   "search.category.clear": "Search the whole catalogue",
   "search.category.current": "Searching inside {path}",

package/src/i18n/ru.ts

@@ -154,12 +154,23 @@ export const searchI18nBundleRu: I18nDictionary = {
   "search.filters.short": "Фильтры",
   "search.filters.chip_more": ", +{count}",
   "search.filters.chips_overflow": "Ещё {count}",
+  "search.filters.applied_label": "Выбранные фильтры",
+  "search.filters.chip_pair": "{name}: {value}",
+  "search.filters.chip_remove": "Убрать фильтр «{filter}»",
+  "search.filters.chip_range_between": "от {from} до {to}",
+  "search.filters.chip_range_from": "от {from}",
+  "search.filters.chip_range_to": "до {to}",
 
   "search.empty.exits_title": "Попробуйте расширить поиск",
   "search.empty.up_a_level": "Подняться на уровень выше",
   "search.empty.widen_radius": "Искать в радиусе {km} км",
   "search.empty.anywhere": "Искать везде",
   "search.empty.drop_filter": "Без «{name}»",
+
+  // One line, out of the same answer the cards came from: section and count.
+  "search.other_categories.label": "Поиск в других категориях:",
+  "search.other_categories.narrow": "Искать в разделе «{name}»",
+  "search.other_categories.more": "ещё {count}",
   "search.category.title": "Категория",
   "search.category.clear": "Искать по всему каталогу",
   "search.category.current": "Ищем внутри {path}",

package/src/index.ts

@@ -194,6 +194,16 @@ export type {
 } from "./headless/useFacetLabels.js";
 export { useAppliedSort } from "./headless/useAppliedSort.js";
 export { offerableCategories, useSearchBox } from "./headless/useSearchBox.js";
+export {
+  OTHER_CATEGORIES_LIMIT,
+  OTHER_CATEGORIES_PHONE_LIMIT,
+  otherCategoryLeaf,
+  useOtherCategories,
+} from "./headless/useOtherCategories.js";
+export type {
+  OtherCategoriesBag,
+  OtherCategoryRow,
+} from "./headless/useOtherCategories.js";
 export type { SearchBoxBag, UseSearchBoxOptions } from "./headless/useSearchBox.js";
 export { countQueryState, useSearchCount } from "./headless/useSearchCount.js";
 export type {