orionplace-react 0.6.0 → 0.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "orionplace-react",
-  "version": "0.6.0",
+  "version": "0.6.2",
   "description": "Next.js 16 storefront for your Orionplace marketplace: setup CLI, server API gateway, typed store and ready-made catalog, cart, checkout and account components in English and Russian, plus an Android app build.",
   "type": "module",
   "license": "MIT",

package/runtime/marketplace.d.mts

@@ -37,6 +37,18 @@ export declare function marketplacePublicOrigin(
   tenantDomain?: string,
 ): string;
 
+export declare function noindexPathPrefixes(value?: string): string[];
+
+export declare function marketplaceNoindexPath(
+  pathname: string,
+  value?: string,
+): boolean;
+
+export declare function sitemapIndexedPages(
+  pages: MarketplaceSitemapPage[],
+  value?: string,
+): MarketplaceSitemapPage[];
+
 export declare function marketplaceRobots(origin: string): string;
 
 export declare function marketplaceRobotsResponse(

package/runtime/marketplace.mjs

@@ -329,6 +329,7 @@ export async function forwardMarketplace(request, configuration = {}) {
 // node_modules/.cache/orionplace/sitemaps/<domain>.json (ORIONPLACE_CACHE_DIR
 // moves it). "orionplace-<framework> sitemap rebuild" rebuilds that file at
 // once; the running storefront serves the new file without a restart.
+// Paths in ORIONPLACE_NOINDEX_PATHS are left out when the sitemap is served.
 
 export const SITEMAP_LIFETIME = 60 * 60 * 1000;
 const sitemapPageSize = 100;
@@ -353,6 +354,34 @@ export function marketplacePublicOrigin(request, tenantDomain = '') {
   return local || !tenantDomain ? url.origin : `https://${tenantDomain}`;
 }
 
+/**
+ * Pages kept out of search engines: ORIONPLACE_NOINDEX_PATHS lists path
+ * prefixes separated by spaces or commas, for example "/catalog /category
+ * /product" on a demo or staging storefront. Those pages answer with
+ * `X-Robots-Tag: noindex, follow` and the sitemap leaves them out. Empty
+ * (the default) keeps every public page indexable.
+ */
+export function noindexPathPrefixes(value = environment.ORIONPLACE_NOINDEX_PATHS) {
+  return String(value ?? '')
+    .split(/[\s,]+/)
+    .map((item) => item.trim().replace(/\/+$/, ''))
+    .filter((item) => /^\/[A-Za-z0-9._~\/-]+$/.test(item));
+}
+
+/** Whether a page path is kept out of search engines (see noindexPathPrefixes). */
+export function marketplaceNoindexPath(pathname, value = environment.ORIONPLACE_NOINDEX_PATHS) {
+  const path = String(pathname ?? '');
+  return noindexPathPrefixes(value)
+    .some((prefix) => path === prefix || path.startsWith(`${prefix}/`));
+}
+
+/** The sitemap pages search engines may index. */
+export function sitemapIndexedPages(pages, value = environment.ORIONPLACE_NOINDEX_PATHS) {
+  return noindexPathPrefixes(value).length
+    ? pages.filter((page) => !marketplaceNoindexPath(page.path, value))
+    : pages;
+}
+
 /** @param {string} origin */
 export function marketplaceRobots(origin) {
   return `User-agent: *\nDisallow: /api/\nAllow: /\n\nSitemap: ${origin}/sitemap.xml\n`;
@@ -618,7 +647,7 @@ async function buildMarketplaceSitemap(tenant) {
 /** How many <url> entries a built sitemap has. */
 export function sitemapUrlCount(sitemap) {
   let count = 0;
-  for (const page of sitemap.pages) {
+  for (const page of sitemapIndexedPages(sitemap.pages)) {
     const own = page.locales
       ? sitemap.locales.filter((code) => page.locales.includes(code))
       : sitemap.locales;
@@ -776,7 +805,7 @@ export async function marketplaceSitemapResponse(request, configuration = {}) {
     }
   }
   const origin  = marketplacePublicOrigin(request, tenant.domain);
-  return new Response(marketplaceSitemapXml(origin, sitemap.pages, sitemap.locales), {
+  return new Response(marketplaceSitemapXml(origin, sitemapIndexedPages(sitemap.pages), sitemap.locales), {
     headers: {
       'Content-Type': 'application/xml; charset=utf-8',
       'Cache-Control': 'public, max-age=3600',

package/src/project-readme.mjs

@@ -405,6 +405,12 @@ npx orionplace-react sitemap rebuild shop.example.com  # one domain
 npx orionplace-react sitemap status                  # when each was built
 \`\`\`
 
+To keep a demo or staging storefront's shop pages out of search engines, set
+\`ORIONPLACE_NOINDEX_PATHS\` in \`.env\` to path prefixes separated by spaces,
+for example \`ORIONPLACE_NOINDEX_PATHS="/catalog /category /product"\`. Those
+pages answer with \`X-Robots-Tag: noindex, follow\` and the sitemap leaves them
+out; the journal and other pages stay indexable. Leave it empty on a live shop.
+
 This setup does not add analytics.
 
 ## Android app

package/templates/app/_storefront/ArticlePage.tsx

@@ -60,6 +60,9 @@ export function ArticlePage({
           }>(action.endpoint, action.request, action.signal);
           return data.posts.data.find((post) => post.id === postId) ?? null;
         }}
+        onLoadPlacements={(action) =>
+          api.request(action.endpoint, action.request, action.signal)
+        }
         onReading={(action) =>
           api.request<IBlogReadingData>(
             action.endpoint,

package/templates/app/_storefront/CategoryPage.tsx

@@ -4,7 +4,8 @@ import { StorefrontCategory } from '@/components/orionplace/categories/Storefron
 import { useOrionplaceStorefront } from '@/hooks/useOrionplaceStorefront';
 import { useOrionplaceCatalog } from '@/providers/OrionplaceProvider';
 import { catalogBranchIds } from '@/lib/orionplace/catalog';
-import type { ProductSearchPage } from '@/lib/orionplace/productSearch';
+import type { ProductListLocation } from '@/lib/orionplace/productListLocation';
+import type { ProductListPage } from '@/lib/orionplace/productSearch';
 import { useProductSearch } from './useProductSearch';
 import { useStorefrontNavigation } from './useStorefrontNavigation';
 
@@ -12,10 +13,12 @@ export function CategoryPage({
   categoryId,
   initial,
   initialError = '',
+  location,
 }: {
   categoryId: number;
-  initial?: ProductSearchPage;
+  initial?: ProductListPage;
   initialError?: string;
+  location?: ProductListLocation;
 }) {
   const navigation = useStorefrontNavigation();
   const controls   = useOrionplaceStorefront();
@@ -24,6 +27,7 @@ export function CategoryPage({
     { categoryId, categoryIds: catalogBranchIds(catalog, categoryId) },
     initial,
     initialError,
+    { location },
   );
   const pagination = search.data?.products?.rpag;
 

package/templates/app/_storefront/SearchPage.tsx

@@ -15,10 +15,11 @@ import { OrionplaceEmptyState } from '@/components/orionplace/shared/OrionplaceE
 import { useOrionplaceStorefront } from '@/hooks/useOrionplaceStorefront';
 import { browseLabels } from '@/lib/orionplace/browseLabels';
 import { featuredLabels } from '@/lib/orionplace/featuredLabels';
+import type { ProductListLocation } from '@/lib/orionplace/productListLocation';
 import {
   productSearchHeading,
   productSearchTrail,
-  type ProductSearchPage as ProductSearchData,
+  type ProductListPage as ProductSearchData,
   type ProductSearchScope,
 } from '@/lib/orionplace/productSearch';
 import { useProductSearch } from './useProductSearch';
@@ -41,10 +42,12 @@ export function SearchPage({
   scope,
   initial,
   initialError = '',
+  location,
 }: {
   scope: ProductSearchScope;
   initial?: ProductSearchData;
   initialError?: string;
+  location?: ProductListLocation;
 }) {
   const locale     = useOrionplaceSelections((state) => state.localeCode);
   const labels     = browseLabels(locale);
@@ -55,7 +58,9 @@ export function SearchPage({
   const guest      = Boolean(scope.featured && ready && !init?.is_authenticated);
   const navigation = useStorefrontNavigation();
   const controls   = useOrionplaceStorefront();
-  const search     = useProductSearch(scope, initial, initialError);
+  const search     = useProductSearch(scope, initial, initialError, {
+    location,
+  });
   const pagination = search.data?.products?.rpag;
   const api = useOrionplaceApi();
   const directory = directoryLabels(locale);

package/templates/app/_storefront/SellersPage.tsx

@@ -12,7 +12,8 @@ import { useOrionplaceApi } from '@/hooks/useOrionplaceApi';
 import { useOrionplaceReviews } from '@/hooks/useOrionplaceReviews';
 import { useOrionplaceStorefront } from '@/hooks/useOrionplaceStorefront';
 import { directoryLabels } from '@/lib/orionplace/directoryLabels';
-import type { ProductSearchPage } from '@/lib/orionplace/productSearch';
+import type { ProductListLocation } from '@/lib/orionplace/productListLocation';
+import type { ProductListPage } from '@/lib/orionplace/productSearch';
 import { useOrionplaceSelections } from '@/providers/OrionplaceProvider';
 import { useProductSearch } from './useProductSearch';
 import { useStorefrontNavigation } from './useStorefrontNavigation';
@@ -25,11 +26,13 @@ export function SellersPage({
   initial,
   initialProducts,
   initialError = '',
+  location,
 }: {
   sellerId?: number;
   initial?: SellerPageData;
-  initialProducts?: ProductSearchPage;
+  initialProducts?: ProductListPage;
   initialError?: string;
+  location?: ProductListLocation;
 }) {
   const api = useOrionplaceApi();
   const locale = useOrionplaceSelections((state) => state.localeCode);
@@ -38,6 +41,7 @@ export function SellersPage({
   const labels = directoryLabels(locale);
   const search = useProductSearch({ sellerId }, initialProducts, '', {
     scrollToTop: false,
+    location,
   });
   const reviews = useOrionplaceReviews({
     sellerId,
@@ -112,7 +116,9 @@ export function SellersPage({
               products={search.data?.products?.data ?? []}
               facets={search.facets}
               filters={search.filters}
-              fixedFilters={['product_owner']}
+              // The seller scope fixes the seller and its rating, as in the
+              // Nuxt and Svelte packages.
+              fixedFilters={['product_owner', 'owner_rating_from']}
               page={search.page}
               pages={pagination?.pages}
               total={total}

package/templates/app/_storefront/storefrontRoutes.tsx

@@ -67,10 +67,11 @@ import {
   type ManufacturerSearchData,
 } from '@/lib/orionplace/manufacturerDirectory';
 import {
-  loadProductSearch,
-  type ProductSearchPage,
+  loadProductListPage,
+  type ProductListPage,
   type ProductSearchScope,
 } from '@/lib/orionplace/productSearch';
+import { productListLocationFromQuery } from '@/lib/orionplace/productListLocation';
 import {
   emptySellerFilters,
   sellerDirectoryRequest,
@@ -212,8 +213,11 @@ const routes: Record<string, Loader> = {
       !scope.query ||
       scope.query.length >= 3 ||
       Object.values(scope).some((value) => typeof value === 'number');
+    const location                  = productListLocationFromQuery(query);
     const { initial, initialError } = searched
-      ? await initialData(context, (api) => loadProductSearch(api, scope))
+      ? await initialData(context, (api) =>
+          loadProductListPage(api, scope, location.filters, location.page),
+        )
       : { initial: undefined, initialError: '' };
     return {
       page: (
@@ -221,6 +225,7 @@ const routes: Record<string, Loader> = {
           scope={scope}
           initial={initial}
           initialError={initialError}
+          location={location}
         />
       ),
     };
@@ -254,11 +259,17 @@ const routes: Record<string, Loader> = {
     if (!categoryId || !findCatalogCategory(catalog, categoryId)) {
       return { notFound: true };
     }
+    const location                  = productListLocationFromQuery(context.query);
     const { initial, initialError } = await initialData(context, (api) =>
-      loadProductSearch(api, {
-        categoryId,
-        categoryIds: catalogBranchIds(catalog, categoryId),
-      }),
+      loadProductListPage(
+        api,
+        {
+          categoryId,
+          categoryIds: catalogBranchIds(catalog, categoryId),
+        },
+        location.filters,
+        location.page,
+      ),
     );
     return {
       page: (
@@ -266,6 +277,7 @@ const routes: Record<string, Loader> = {
           categoryId={categoryId}
           initial={initial}
           initialError={initialError}
+          location={location}
         />
       ),
     };
@@ -275,8 +287,9 @@ const routes: Record<string, Loader> = {
 
   '/featured': async (context) => {
     const scope                     = { featured: true } as const;
+    const location                  = productListLocationFromQuery(context.query);
     const { initial, initialError } = await initialData(context, (api) =>
-      loadProductSearch(api, scope),
+      loadProductListPage(api, scope, location.filters, location.page),
     );
     return {
       page: (
@@ -284,6 +297,7 @@ const routes: Record<string, Loader> = {
           scope={scope}
           initial={initial}
           initialError={initialError}
+          location={location}
         />
       ),
     };
@@ -487,8 +501,9 @@ const routes: Record<string, Loader> = {
       return { redirect: `/catalog?locale=${encodeURIComponent(text(query.locale))}` };
     }
     const sellerId  = positive(text(query.seller) || undefined);
+    const location  = productListLocationFromQuery(query);
     let initial;
-    let initialProducts: ProductSearchPage | undefined;
+    let initialProducts: ProductListPage | undefined;
     let initialError = '';
     try {
       const api = await context.api();
@@ -499,7 +514,12 @@ const routes: Record<string, Loader> = {
           : sellerDirectoryRequest(emptySellerFilters(), 1),
       );
       if (sellerId && initial.sellers.data[0]) {
-        initialProducts = await loadProductSearch(api, { sellerId }, {}, 1);
+        initialProducts = await loadProductListPage(
+          api,
+          { sellerId },
+          location.filters,
+          location.page,
+        );
       }
     } catch (reason) {
       initialError = await context.errorText(reason);
@@ -511,6 +531,7 @@ const routes: Record<string, Loader> = {
           initial={initial}
           initialProducts={initialProducts}
           initialError={initialError}
+          location={location}
         />
       ),
     };

package/templates/app/_storefront/useProductSearch.ts

@@ -9,14 +9,19 @@ import {
 import type { ProductFacetSelection } from '@/interfaces/orionplace/products/IProductSearchFacets';
 import { useOrionplaceApi } from '@/hooks/useOrionplaceApi';
 import {
-  loadProductSearch,
-  productSearchFacetData,
-  type ProductSearchPage,
+  loadProductListPage,
+  productListFacetData,
+  type ProductListPage,
   type ProductSearchScope,
 } from '@/lib/orionplace/productSearch';
-import { initialSearchFacets } from '@/lib/orionplace/searchFilters';
 import { apiErrorMessage } from '@/lib/orionplace/api';
 import { featureLabels } from '@/lib/orionplace/featureLabels';
+import {
+  productListLocationFromQuery,
+  productListLocationQuery,
+  sameProductListLocation,
+  type ProductListLocation,
+} from '@/lib/orionplace/productListLocation';
 
 /*
  * A search needs a category, a fixed scope or a 3-letter query, as in the
@@ -30,35 +35,77 @@ function searchable(scope: ProductSearchScope) {
   );
 }
 
+const firstListPage: ProductListLocation = { page: 1, filters: {} };
+
+function listSignature(location: ProductListLocation) {
+  return JSON.stringify(productListLocationQuery({}, location));
+}
+
+function addressQuery(): Record<string, string> {
+  return Object.fromEntries(new URL(window.location.href).searchParams);
+}
+
 /*
  * `scrollToTop: false` keeps the scroll position on a page turn, for a page
  * whose pagination scrolls to its own list (the seller page).
+ * `location` is the page and filters `initial` was loaded with (the URL of the
+ * server render). The page and filters stay in the URL, so Back from a
+ * product or a reload opens the list the visitor left; `rememberInAddress:
+ * false` keeps them out of it.
  */
 export function useProductSearch(
   scope: ProductSearchScope,
-  initial?: ProductSearchPage,
+  initial?: ProductListPage,
   initialError = '',
-  options: { scrollToTop?: boolean } = {},
+  options: {
+    scrollToTop?: boolean;
+    location?: ProductListLocation;
+    rememberInAddress?: boolean;
+  } = {},
 ) {
+  const remember              = options.rememberInAddress !== false;
+  const serverLocation        = remember
+    ? (options.location ?? firstListPage)
+    : firstListPage;
+  // The page and filters in the URL; the server render reads them from the
+  // request, the browser from the address bar.
+  function addressLocation(): ProductListLocation {
+    if (!remember) {
+      return firstListPage;
+    }
+    return typeof window === 'undefined'
+      ? serverLocation
+      : productListLocationFromQuery(addressQuery());
+  }
+  // `initial` belongs to the URL it was loaded for.
+  function fromServer(location: ProductListLocation) {
+    return listSignature(location) === listSignature(serverLocation);
+  }
+  const [opening]             = useState(addressLocation);
+  const openedFromServer      = fromServer(opening);
   const api                   = useOrionplaceApi();
   const locale                = useOrionplaceSelections(
     (state) => state.localeCode,
   );
   const productsStore         = useOrionplaceProductsStore();
   const browseStore           = useOrionplaceBrowseStore();
-  const [data, setData]       = useState(initial);
-  const [filters, setFilters] = useState<ProductFacetSelection>({});
-  const [page, setPage]       = useState(initial?.products?.rpag.page ?? 1);
+  const [data, setData]       = useState(openedFromServer ? initial : undefined);
+  const [filters, setFilters] = useState<ProductFacetSelection>(opening.filters);
+  const [page, setPage]       = useState(
+    openedFromServer ? (initial?.products?.rpag.page ?? opening.page) : opening.page,
+  );
   const [pending, setPending] = useState(false);
-  const [loaded, setLoaded]   = useState(Boolean(initial));
-  const [error, setError]     = useState(initialError);
+  const [loaded, setLoaded]   = useState(openedFromServer && Boolean(initial));
+  const [error, setError]     = useState(openedFromServer ? initialError : '');
   // Filter choices of the scope's first response; a filtered response must
   // not shrink them, so the visitor can still pick another seller or price.
-  const [facets, setFacets]   = useState(() => productSearchFacetData(initial));
+  const [facets, setFacets]   = useState(() =>
+    productListFacetData(openedFromServer ? initial : undefined),
+  );
   const request               = useRef<AbortController | undefined>(undefined);
   const signature             = JSON.stringify(scope);
 
-  function apply(next: ProductSearchPage) {
+  function apply(next: ProductListPage) {
     // The backend sends the unfiltered total with the first page only;
     // later pages keep it, as in the Nuxt and Svelte packages.
     setData((previous) =>
@@ -80,10 +127,10 @@ export function useProductSearch(
         : next,
     );
     setLoaded(true);
-    const incoming = productSearchFacetData(next);
+    const incoming = productListFacetData(next);
     if (incoming) {
       browseStore.getState().preserveSearchFacets(incoming);
-      setFacets((previous) => initialSearchFacets(previous, incoming));
+      setFacets((previous) => productListFacetData(next, previous));
     }
     for (const product of next.products?.data ?? []) {
       productsStore
@@ -92,19 +139,39 @@ export function useProductSearch(
     }
   }
 
+  // Replaces the URL, so Back from the list still leaves it in one step.
+  function rememberLocation(next: ProductListLocation) {
+    const query = addressQuery();
+    if (
+      !remember ||
+      sameProductListLocation(productListLocationFromQuery(query), next)
+    ) {
+      return;
+    }
+    const search = new URLSearchParams(productListLocationQuery(query, next));
+    window.history.replaceState(
+      null,
+      '',
+      `${window.location.pathname}?${search}${window.location.hash}`,
+    );
+  }
+
   async function load(nextPage = page, nextFilters = filters) {
+    rememberLocation({ page: nextPage, filters: nextFilters });
     request.current?.abort();
     const controller = new AbortController();
     request.current  = controller;
     setPending(true);
     setError('');
     try {
-      const next = await loadProductSearch(
+      const next = await loadProductListPage(
         api,
         scope,
         nextFilters,
         nextPage,
         controller.signal,
+        // Only a list without its filter choices yet needs the full ones.
+        !browseStore.getState().searchFacets,
       );
       if (!controller.signal.aborted) {
         setPage(nextPage);
@@ -122,18 +189,22 @@ export function useProductSearch(
     }
   }
 
+  // A new scope starts from the page and filters of its URL: none after a
+  // link, the ones the visitor left after Back or a reload.
   useEffect(() => {
+    const location = addressLocation();
+    const server   = fromServer(location) ? initial : undefined;
     browseStore.getState().setSearchQuery(scope.query ?? '');
-    browseStore.getState().setSearchFilters({});
-    browseStore.getState().setSearchFacets(productSearchFacetData(initial));
-    setFacets(productSearchFacetData(initial));
-    setData(initial);
-    setFilters({});
-    setPage(initial?.products?.rpag.page ?? 1);
-    setLoaded(Boolean(initial));
-    setError(initialError);
-    if (!initial && searchable(scope)) {
-      void load(1, {});
+    browseStore.getState().setSearchFilters(location.filters);
+    browseStore.getState().setSearchFacets(productListFacetData(server));
+    setFacets(productListFacetData(server));
+    setData(server);
+    setFilters(location.filters);
+    setPage(server?.products?.rpag.page ?? location.page);
+    setLoaded(Boolean(server));
+    setError(fromServer(location) ? initialError : '');
+    if (!server && searchable(scope)) {
+      void load(location.page, location.filters);
     }
     return () => request.current?.abort();
   }, [signature]);

package/templates/components/orionplace/blog/BlogArticle.README.md

@@ -46,6 +46,17 @@ Hiding the page, moving away, losing focus or becoming inactive pauses the
 requests. A 401, 403 or returned field error removes the full text and shows
 the access-changed notice.
 
+Products the author places in the text appear at those positions. The
+marketplace blog editor writes an empty block with `data-product-id="12"` for
+one card or `data-product-ids="12,15,9"` for a row of up to 24 cards; the
+block keeps its float or centred style, and `data-product-hidden-badges`
+(`new`, `popular`, `good-deal`) turns card badges off. Products missing from
+`related_products` are requested through `onLoadPlacements` with
+`products_search` and `filters.id_in`, up to 35 IDs per request. A block whose
+products are not found stays hidden. Article text styles do not reach the
+cards, and in a narrow article a floated card stands alone in the middle. The
+helper is `lib/orionplace/blogProductPlacements.ts`.
+
 `related_products` supplies complete product objects to `ProductGroup`, so
 their standard cards are present during server rendering. The product callbacks
 forward the same payloads as `ProductGroup`; `productActionsDisabled` blocks
@@ -63,6 +74,7 @@ separate.
 | `initialPost?: IBlogPost`                                                                                               | Server-provided initial post used for the first render and hydration.                                                |
 | `commentsProps?: Omit<BlogCommentsProps, "postId">`                                                                     | Props forwarded to the comments child component.                                                                     |
 | `onLoad?: (action: BlogArticleLoadAction) => Promise<IBlogPost \| null \| undefined> \| IBlogPost \| null \| undefined` | Called when the component needs its primary data. The callback payload is shown in its type.                         |
+| `onLoadPlacements?: (action: BlogPlacementLoadAction) => Promise<BlogPlacementData \| null \| undefined> \| BlogPlacementData \| null \| undefined` | Called when products placed in the article text are missing from `related_products`: `products_search` with `filters.id_in`, up to 35 IDs. Without it only related products fill the placements. |
 | `onReading?: (action: BlogReadingAction) => Promise<IBlogReadingData> \| IBlogReadingData`                              | Called when the article reading session starts, continues or stops. The callback payload is shown in its type.       |
 | `onBack?: () => void`                                                                                                   | Called when the visitor chooses Back. The callback has no payload.                                                   |
 | `onLoaded?: (post: IBlogPost) => void`                                                                                  | Called when the requested data loads successfully. The callback payload is shown in its type.                        |
@@ -125,6 +137,17 @@ ID тарифов, ссылка также передаёт их в `ids`. Дл
 приостанавливают запросы. Ответ 401, 403 или ошибка поля удаляет полный текст
 и показывает сообщение об изменении доступа.
 
+Товары, которые автор разместил в тексте, показываются на своих местах.
+Редактор блога маркетплейса пишет пустой блок с `data-product-id="12"` для
+одной карточки или `data-product-ids="12,15,9"` для ряда до 24 карточек;
+блок сохраняет обтекание или выравнивание по центру, а
+`data-product-hidden-badges` (`new`, `popular`, `good-deal`) отключает значки
+карточки. Товары, которых нет в `related_products`, запрашиваются через
+`onLoadPlacements` — `products_search` с `filters.id_in`, до 35 ID за запрос.
+Блок, товары которого не найдены, скрыт. Стили текста статьи не действуют на
+карточки, а в узкой статье карточка с обтеканием стоит отдельно по центру.
+Вспомогательный модуль — `lib/orionplace/blogProductPlacements.ts`.
+
 `related_products` передаёт полные объекты товаров в `ProductGroup`, поэтому
 обычные карточки есть уже в серверном HTML. Обработчики товаров получают те
 же данные, что и в `ProductGroup`; `productActionsDisabled` блокирует
@@ -142,6 +165,7 @@ ID тарифов, ссылка также передаёт их в `ids`. Дл
 | `initialPost?: IBlogPost`                                                                                               | Начальное значение статьи, полученное на сервере для первого рендера и гидратации.                                     |
 | `commentsProps?: Omit<BlogCommentsProps, "postId">`                                                                     | Свойства, передаваемые дочернему компоненту комментариев.                                                              |
 | `onLoad?: (action: BlogArticleLoadAction) => Promise<IBlogPost \| null \| undefined> \| IBlogPost \| null \| undefined` | Вызывается, когда компоненту нужны основные данные. Данные обработчика указаны в его типе.                             |
+| `onLoadPlacements?: (action: BlogPlacementLoadAction) => Promise<BlogPlacementData \| null \| undefined> \| BlogPlacementData \| null \| undefined` | Вызывается, когда товаров, размещённых в тексте статьи, нет в `related_products`: `products_search` с `filters.id_in`, до 35 ID. Без него размещения заполняют только прикреплённые товары. |
 | `onReading?: (action: BlogReadingAction) => Promise<IBlogReadingData> \| IBlogReadingData`                              | Вызывается, когда сеанс чтения статьи начинается, продолжается или завершается. Данные обработчика указаны в его типе. |
 | `onBack?: () => void`                                                                                                   | Вызывается, когда покупатель выбирает «Назад». Обработчик не получает данные.                                          |
 | `onLoaded?: (post: IBlogPost) => void`                                                                                  | Вызывается, когда запрошенные данные успешно загружены. Данные обработчика указаны в его типе.                         |