orionplace-react 0.7.8 → 0.8.0

package/templates/components/orionplace/search/MainSearch.module.css

@@ -1,202 +0,0 @@
-.search {
-  container-type: inline-size;
-  container-name: search;
-  position: relative;
-  display: flex;
-  min-width: 0;
-  align-items: center;
-  border: 1px solid var(--orionplace-border);
-  background: var(--orionplace-surface);
-  color: var(--orionplace-text);
-  font-size: 0.875rem;
-  line-height: calc(1.25 / 0.875);
-  transition: border-color 150ms ease;
-}
-
-.history {
-  position: absolute;
-  z-index: 60;
-  top: calc(100% + 1px);
-  right: -1px;
-  left: -1px;
-  border: 1px solid var(--orionplace-border);
-  background: var(--orionplace-surface);
-  box-shadow: 0 12px 28px rgb(0 0 0 / 12%);
-}
-
-.history ul {
-  padding: 0;
-  margin: 0;
-  list-style: none;
-}
-
-.history li {
-  display: flex;
-  min-width: 0;
-  align-items: center;
-  border-bottom: 1px solid var(--orionplace-border);
-}
-
-.history li:last-child {
-  border-bottom: 0;
-}
-
-.historyQuery,
-.historyDelete {
-  min-height: 2.5rem;
-  border: 0;
-  background: transparent;
-  color: inherit;
-  font: inherit;
-  cursor: pointer;
-}
-
-.historyDelete svg {
-  width: 1rem;
-  height: 1rem;
-}
-
-.historyQuery {
-  min-width: 0;
-  flex: 1;
-  overflow: hidden;
-  padding: 0.625rem 0.875rem;
-  text-align: left;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.historyDelete {
-  flex: 0 0 2.5rem;
-  color: var(--orionplace-muted);
-  font-size: 1.25rem;
-  line-height: calc(1.75 / 1.25);
-}
-
-.historyQuery:focus-visible,
-.historyDelete:focus-visible {
-  background: var(--orionplace-hover);
-  outline: none;
-}
-
-@media (hover: hover) {
-  .historyQuery:hover:not(:disabled),
-  .historyDelete:hover:not(:disabled) {
-    background: var(--orionplace-hover);
-    outline: none;
-  }
-}
-
-.historyStatus {
-  display: block;
-  margin: 0;
-  padding: 0.75rem 0.875rem;
-  color: var(--orionplace-muted);
-}
-
-.search:focus-within {
-  border-color: var(--orionplace-text);
-}
-
-.field {
-  display: grid;
-  min-width: 0;
-  flex: 1;
-}
-
-.input {
-  box-sizing: border-box;
-  width: 100%;
-  min-width: 0;
-  height: 2.5rem;
-  padding: 1px 0.75rem;
-  border: 0;
-  background: transparent;
-  color: inherit;
-  font: inherit;
-  font-size: 0.875rem;
-  line-height: 20px;
-  outline: none;
-}
-
-.input::placeholder {
-  color: var(--orionplace-muted);
-}
-
-.input:disabled {
-  cursor: default;
-  opacity: 0.5;
-}
-
-.button {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  gap: 0.5rem;
-  min-width: 2.5rem;
-  height: 2.5rem;
-  padding: 1px 0.625rem;
-  border: 0;
-  background: transparent;
-  color: inherit;
-  font: inherit;
-  font-size: 0.75rem;
-  line-height: 16px;
-  letter-spacing: 0.08em;
-  text-transform: uppercase;
-  cursor: pointer;
-}
-
-.button:focus-visible {
-  background: var(--orionplace-hover);
-  outline: none;
-}
-
-@media (hover: hover) {
-  .button:hover:not(:disabled) {
-    background: var(--orionplace-hover);
-    outline: none;
-  }
-}
-
-.button:disabled {
-  cursor: default;
-}
-
-.icon {
-  width: 1.25rem;
-  height: 1.25rem;
-  flex-shrink: 0;
-}
-
-.visuallyHidden {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border: 0;
-}
-
-@container search (min-width: 480px) {
-  .input {
-    padding-right: 1rem;
-    padding-left: 1rem;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .search {
-    transition: none;
-  }
-}
-
-.historyQuery:disabled,
-.historyDelete:disabled {
-  opacity: 0.5;
-  cursor: default;
-}

package/templates/components/orionplace/search/MainSearch.tsx

@@ -1,217 +0,0 @@
-'use client';
-
-import { useEffect, useId, useRef, useState, type FormEvent } from 'react';
-import { usePathname, useSearchParams } from 'next/navigation';
-import {
-  useOrionplace,
-  useOrionplaceBrowse,
-  useOrionplaceBrowseStore,
-  useOrionplaceSelections,
-} from '@/providers/OrionplaceProvider';
-import { selectInit } from '@/stores/orionplace';
-import { getAvailableValueFromObject } from '@/lib/orionplace/presentation';
-import styles from './MainSearch.module.css';
-
-export interface MainSearchProps {
-  label?: string;
-  buttonLabel?: string;
-  disabled?: boolean;
-  history?: readonly MainSearchHistoryItem[];
-  historyPending?: boolean;
-  historyError?: string;
-  historyDeleting?: readonly number[];
-  onSearch?: (query: string) => void;
-  onHistorySearch?: (query: string) => void;
-  onHistoryDelete?: (id: number) => void;
-}
-
-export interface MainSearchHistoryItem {
-  id: number;
-  q: string;
-}
-
-export function MainSearch({
-  label           = 'Search',
-  buttonLabel     = 'Find',
-  disabled        = false,
-  history         = [],
-  historyPending  = false,
-  historyError    = '',
-  historyDeleting = [],
-  onSearch,
-  onHistorySearch,
-  onHistoryDelete,
-}: MainSearchProps) {
-  const init                          = useOrionplace(selectInit);
-  const locale                        = useOrionplaceSelections((state) => state.localeCode);
-  const query                         = useOrionplaceBrowse((state) => state.searchQuery);
-  const browseStore                   = useOrionplaceBrowseStore();
-  const pathname                      = usePathname();
-  const searchParams                  = useSearchParams();
-  const routeQuery                    =
-    pathname === '/browse' ? (searchParams.get('q') ?? '').trim() : '';
-  const value                         = query || routeQuery;
-  const hints                         = [
-    ...new Set(
-      (init?.search_hints ?? [])
-        .map((hint) => getAvailableValueFromObject(hint, locale))
-        .filter((hint): hint is string => Boolean(hint)),
-    ),
-  ];
-  const id                            = useId();
-  const historySearch                 = useRef(onHistorySearch);
-  historySearch.current               = onHistorySearch;
-  const [historyOpen, setHistoryOpen] = useState(false);
-  // The store's hints step aside while the history list is open: on a phone
-  // the browser's own hint list would cover it.
-  const historyVisible                = historyOpen &&
-    Boolean(historyPending || history.length || historyError);
-  const removeLabel                   = locale.toLowerCase().startsWith('ru')
-    ? 'Удалить из истории'
-    : locale.toLowerCase().startsWith('es') ? 'Quitar del historial' : 'Remove from history';
-
-  useEffect(() => {
-    if (!query && routeQuery) {
-      browseStore.getState().setSearchQuery(routeQuery);
-    }
-  }, [browseStore, query, routeQuery]);
-
-  useEffect(() => {
-    if (!historyOpen || disabled || !historySearch.current) {
-      return;
-    }
-    const timeout = setTimeout(
-      () => historySearch.current?.(value.trim()),
-      250,
-    );
-    return () => clearTimeout(timeout);
-  }, [historyOpen, value, disabled]);
-
-  function submit(event: FormEvent<HTMLFormElement>) {
-    event.preventDefault();
-    const normalized = value.trim();
-    if (!disabled && normalized) {
-      setHistoryOpen(false);
-      // A phone closes its keyboard, so the results are not covered.
-      event.currentTarget.querySelector('input')?.blur();
-      onSearch?.(normalized);
-    }
-  }
-
-  return (
-    <form
-      className={styles.search}
-      data-main-search
-      onSubmit={submit}
-      onBlur={(event) => {
-        if (!event.currentTarget.contains(event.relatedTarget)) {
-          setHistoryOpen(false);
-        }
-      }}
-    >
-      <label className={styles.field}>
-        <span className={styles.visuallyHidden}>{label}</span>
-        <input
-          type="search"
-          list={historyVisible ? undefined : id}
-          value={value}
-          placeholder={label}
-          disabled={disabled}
-          className={styles.input}
-          onChange={(event) =>
-            browseStore.getState().setSearchQuery(event.target.value)
-          }
-          onFocus={() => setHistoryOpen(true)}
-        />
-      </label>
-      <datalist id={id}>
-        {hints.map((hint) => (
-          <option
-            key={hint}
-            value={hint}
-          />
-        ))}
-      </datalist>
-      <button
-        type="submit"
-        disabled={disabled || !value.trim()}
-        className={styles.button}
-      >
-        <svg
-          viewBox="0 0 20 20"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth="1.5"
-          aria-hidden="true"
-          className={styles.icon}
-        >
-          <circle
-            cx="8.5"
-            cy="8.5"
-            r="5.5"
-          />
-          <path d="m13 13 4.5 4.5" />
-        </svg>
-        <span className={styles.visuallyHidden}>{buttonLabel}</span>
-      </button>
-      {historyVisible ? (
-        <div
-          className={styles.history}
-          data-search-history
-        >
-          {historyPending ? (
-            <span
-              className={styles.historyStatus}
-              role="status"
-            >
-              {locale.toLowerCase().startsWith('ru') ? 'Загрузка…' : locale.toLowerCase().startsWith('es') ? 'Cargando…' : 'Loading…'}
-            </span>
-          ) : historyError ? (
-            <p
-              className={styles.historyStatus}
-              role="alert"
-            >
-              {historyError}
-            </p>
-          ) : (
-            <ul>
-              {history.map((item) => (
-                <li key={item.id}>
-                  <button
-                    type="button"
-                    className={styles.historyQuery}
-                    disabled={disabled}
-                    onClick={() => {
-                      browseStore.getState().setSearchQuery(item.q);
-                      setHistoryOpen(false);
-                      onSearch?.(item.q);
-                    }}
-                  >
-                    {item.q}
-                  </button>
-                  <button
-                    type="button"
-                    className={styles.historyDelete}
-                    disabled={disabled || historyDeleting.includes(item.id)}
-                    aria-label={`${removeLabel}: ${item.q}`}
-                    onClick={() => onHistoryDelete?.(item.id)}
-                  >
-                    <svg
-                      viewBox="0 0 20 20"
-                      fill="none"
-                      stroke="currentColor"
-                      strokeWidth="1.5"
-                      aria-hidden="true"
-                    >
-                      <path d="m5 5 10 10M15 5 5 15" />
-                    </svg>
-                  </button>
-                </li>
-              ))}
-            </ul>
-          )}
-        </div>
-      ) : null}
-    </form>
-  );
-}

package/templates/components/orionplace/search/ProductSearchResults.README.md

@@ -1,166 +0,0 @@
-# ProductSearchResults · React
-
-## English
-
-Search and category result area with filters, product cards, loading, retry,
-empty and pagination states.
-
-## Contract and dependencies
-
-The host owns `products_search` and passes the resulting products or their
-cached `productIds`, pagination and request state. `products` lets a server page
-render newly returned products before they are present in Application Load.
-When both are supplied, `productIds` selects and orders entries from that array.
-The component never replaces missing results with home-page products and does
-not issue requests.
-
-`facets` and `filters` supply the server-loaded selector set and current
-selection to `SearchFilters`. Omitting them uses the isolated browse store.
-The supplied pages pass the choices of the first response for the current query
-or category (`useProductSearch().facets`), so a filtered response never removes
-a choice.
-Filter changes call `onChangeFilters` with the complete selection. Clear calls
-`onClearFilters`. `hideCategories` removes a category facet for a fixed category
-page, while `fixedFilters` hides every condition already fixed by a manufacturer,
-seller, store or featured scope.
-
-A defined `query` shorter than three trimmed characters displays the search
-prompt instead of filters and results. While the first request is pending, the
-component shows filter and product placeholders. A later pending request keeps
-existing cards visible, disables their actions and exposes a loading status.
-`failed` shows Retry; a loaded empty result shows the shared search empty state,
-the relevant search or category hint, Clear when filters are selected and Home.
-
-The filter disclosure is available in a narrow container; wider containers
-keep filters visible. The result area retains its measured height while result
-data shrinks and resets that retained height when facets are cleared.
-
-Pagination appears when a previous or next page can exist. Previous is disabled
-on page 1. Next is disabled while pending, after failure or when `hasNext` is
-false. The buttons call `onChangePage` with the requested page and do not mutate
-the current page themselves.
-
-All `ProductGroup` actions and variant events are forwarded with their physical
-payloads. Source is maintained in
-`components/orionplace/search/ProductSearchResults.tsx`; filter interfaces are
-in `interfaces/orionplace/products/IProductSearchFacets.ts`.
-
-### Props
-
-| Prop                                                                                                              | Meaning                                                                                                              |
-| ----------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- |
-| `products?: readonly IProduct[]`                                                                                  | Product records supplied for server rendering and hydration.                                                         |
-| `productIds?: number[]`                                                                                           | Product IDs rendered in the supplied order.                                                                          |
-| `query?: string`                                                                                                  | Current product or storefront search text.                                                                           |
-| `facets?: IProductSearchFacets`                                                                                   | Filter choices returned by the confirmed product search.                                                             |
-| `filters?: ProductFacetSelection`                                                                                 | Current confirmed filter selection.                                                                                  |
-| `hideCategories?: boolean`                                                                                        | Hides the category filter because the page already fixes the category.                                               |
-| `fixedFilters?: readonly string[]`                                                                                | Conditions fixed by the page scope and therefore hidden from editable filters.                                       |
-| `emptyDescription?: string`                                                                                       | Explanation shown when the confirmed result is empty.                                                                |
-| `filtersDisabled?: boolean`                                                                                       | Disables filter editing while keeping the current selection visible.                                                 |
-| `page?: number`                                                                                                   | Current result page.                                                                                                 |
-| `pages?: number`                                                                                                  | Number of pages reported by the API result.                                                                          |
-| `total?: number`                                                                                                  | Total records reported by the API result.                                                                            |
-| `hasNext?: boolean`                                                                                               | Whether the API result can have a following page.                                                                    |
-| `pending?: boolean`                                                                                               | Shows the loading state and blocks duplicate actions.                                                                |
-| `failed?: boolean`                                                                                                | Marks the current load as failed and exposes the retry state.                                                        |
-| `loaded?: boolean`                                                                                                | Distinguishes a confirmed empty result from data that has not loaded yet.                                            |
-| `productActionsDisabled?: boolean`                                                                                | Disables cart, wishlist, subscription and preorder actions.                                                          |
-| `productHref?: (productId: number) => string`                                                                     | Builds the product destination from the callback arguments.                                                          |
-| `onSelectHome?: () => void`                                                                                       | Called when the visitor opens the home page. The callback has no payload.                                            |
-| `onChangeFilters?: (selection: ProductFacetSelection) => void`                                                    | Called when the visitor changes the product filters. The callback payload is shown in its type.                      |
-| `onClearFilters?: () => void`                                                                                     | Called when the visitor clears the product filters. The callback has no payload.                                     |
-| `onChangePage?: (page: number) => void`                                                                           | Called when the visitor requests another result page. The callback payload is shown in its type.                     |
-| `onRetry?: () => void`                                                                                            | Called when the visitor retries the failed request. The callback has no payload.                                     |
-| `onSelect?: (product: IProduct) => void`                                                                          | Passes the displayed product object when its image or name is selected. The application handles product navigation. |
-| `onSelectSeller?: (seller: IProductSeller) => void`                                                               | Passes the displayed product’s seller object when the seller is selected. The application opens the seller page. |
-| `onSelectVariant?: (selection: ProductActionSelection & { variant: IProductVariantValue; }) => void`              | Passes the previously displayed product ID in `product` and chosen primary variant in `variant`. An available variant product replaces the card; the application loads missing product data. |
-| `onRequestSecondaryVariants?: (request: IProductSecondaryVariantRequest) => void`                                 | Passes the product ID in `product`, product group ID in `productGroup` and primary variant in `variant` when its secondary variants need loading. The application loads them and supplies them to the product store. |
-| `onSelectSecondaryVariant?: (selection: ProductActionSelection & { variant: IProductSecondaryVariant; }) => void` | Passes the previously displayed product ID in `product` and chosen secondary variant in `variant` after replacing the displayed product. The secondary-variant data remains available. |
-| `onToggleFavorite?: (selection: ProductActionSelection & { selected: boolean; }) => void`                         | Passes the product ID in `product` and desired wishlist state in `selected` after the heart is pressed. The application confirms the change with a request and updates product data. |
-| `onAdd?: (selection: ProductActionSelection & { quantity: number; }) => void`                                     | Passes the product ID in `product` and the requested total quantity in `quantity` when adding an item or changing its quantity. The application sends the request and supplies confirmed product data. |
-| `onRemove?: (selection: ProductActionSelection & { cartItem: number; }) => void`                                  | Passes the product ID in `product` and cart item ID in `cartItem` when removing the last unit. The application removes that cart item and supplies confirmed product data. |
-| `onSubscribe?: (selection: ProductActionSelection) => void`                                                       | Passes the product ID in `product` when an availability notification is requested. The application handles any required sign-in, sends the request and updates subscription state. |
-| `onUnsubscribe?: (selection: ProductActionSelection) => void`                                                     | Passes the product ID in `product` when cancelling an availability notification. The application sends the request and supplies the confirmed subscription state. |
-| `onPreorder?: (selection: ProductActionSelection) => void`                                                        | Passes the product ID in `product` when preorder is selected. The application collects the required contact details and submits the request. |
-
-## Русский
-
-Компонент объединяет фильтры, карточки товаров, загрузку, повтор запроса,
-пустой результат и пагинацию для поиска и страницы категории.
-
-Родитель управляет `products_search` и передаёт полученные товары либо их
-сохранённые `productIds`, пагинацию и состояние запроса. `products` позволяет
-серверной странице показать новые товары до их появления в Application Load.
-Если переданы оба свойства, `productIds` выбирает и упорядочивает товары из
-этого массива. Компонент не заменяет отсутствующие результаты товарами главной
-страницы и сам не выполняет запросы.
-
-`facets` и `filters` передают серверный набор вариантов и текущий выбор в
-`SearchFilters`. Без них используется отдельный browse store. Готовые страницы
-передают варианты из первого ответа для текущего запроса или категории
-(`useProductSearch().facets`), поэтому ответ с выбранными фильтрами не убирает
-варианты выбора. Изменение фильтра вызывает `onChangeFilters` с полным набором,
-а сброс — `onClearFilters`. `hideCategories` скрывает категории на странице с
-зафиксированной категорией, а `fixedFilters` скрывает условия, уже заданные
-производителем, продавцом, магазином или режимом рекомендуемых товаров.
-
-Если определённый `query` после удаления пробелов короче трёх символов, вместо
-фильтров и результатов показана подсказка поиска. Во время первого запроса
-видны заполнители фильтров и карточек. Следующее обновление сохраняет карточки,
-блокирует их действия и сообщает о загрузке. `failed` показывает кнопку повтора.
-Пустой подтверждённый результат использует общий вид пустого поиска, подходящую
-подсказку поиска или категории, сброс при выбранных фильтрах и кнопку «Главная».
-
-В узком контейнере фильтры раскрываются кнопкой, в широком остаются видимыми.
-Область результатов сохраняет измеренную высоту при уменьшении данных и
-сбрасывает её после очистки набора вариантов.
-
-Пагинация появляется, когда возможна предыдущая или следующая страница.
-«Назад» недоступна на первой странице. «Далее» недоступна во время запроса,
-после ошибки или при `hasNext = false`. Кнопки вызывают `onChangePage` с нужной
-страницей и сами не меняют текущее значение.
-
-Все действия и события вариантов `ProductGroup` передаются с физическими
-данными. Исходный файл:
-`components/orionplace/search/ProductSearchResults.tsx`; интерфейсы фильтров:
-`interfaces/orionplace/products/IProductSearchFacets.ts`.
-
-### Свойства
-
-| Свойство                                                                                                          | Назначение                                                                                                         |
-| ----------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ |
-| `products?: readonly IProduct[]`                                                                                  | Товары для серверного рендера и гидратации.                                                                        |
-| `productIds?: number[]`                                                                                           | ID для товара, используемые в переданном порядке.                                                                  |
-| `query?: string`                                                                                                  | Текущий текст поиска товаров или магазина.                                                                         |
-| `facets?: IProductSearchFacets`                                                                                   | Варианты фильтров из подтверждённого поиска товаров.                                                               |
-| `filters?: ProductFacetSelection`                                                                                 | Текущий подтверждённый набор фильтров.                                                                             |
-| `hideCategories?: boolean`                                                                                        | Скрывает фильтр категорий, когда категория уже задана страницей.                                                   |
-| `fixedFilters?: readonly string[]`                                                                                | Условия, заданные страницей и скрытые из редактируемых фильтров.                                                   |
-| `emptyDescription?: string`                                                                                       | Пояснение для пустого подтверждённого результата.                                                                  |
-| `filtersDisabled?: boolean`                                                                                       | Блокирует изменение фильтров, сохраняя текущий выбор видимым.                                                      |
-| `page?: number`                                                                                                   | Текущая страница результата.                                                                                       |
-| `pages?: number`                                                                                                  | Число страниц в ответе API.                                                                                        |
-| `total?: number`                                                                                                  | Общее число записей в ответе API.                                                                                  |
-| `hasNext?: boolean`                                                                                               | Есть ли у результата API следующая страница.                                                                       |
-| `pending?: boolean`                                                                                               | Показывает загрузку и блокирует повторные действия.                                                                |
-| `failed?: boolean`                                                                                                | Отмечает неудачную загрузку и показывает возможность повторить запрос.                                             |
-| `loaded?: boolean`                                                                                                | Отличает подтверждённый пустой результат от ещё не загруженных данных.                                             |
-| `productActionsDisabled?: boolean`                                                                                | Блокирует корзину, избранное, подписку и предзаказ.                                                                |
-| `productHref?: (productId: number) => string`                                                                     | Строит адрес ссылки товара из аргументов обработчика.                                                              |
-| `onSelectHome?: () => void`                                                                                       | Вызывается, когда покупатель открывает главную страницу. Обработчик не получает данные.                            |
-| `onChangeFilters?: (selection: ProductFacetSelection) => void`                                                    | Вызывается, когда покупатель изменяет фильтры товаров. Данные обработчика указаны в его типе.                      |
-| `onClearFilters?: () => void`                                                                                     | Вызывается, когда покупатель очищает фильтры товаров. Обработчик не получает данные.                               |
-| `onChangePage?: (page: number) => void`                                                                           | Вызывается, когда покупатель открывает другую страницу результатов. Данные обработчика указаны в его типе.         |
-| `onRetry?: () => void`                                                                                            | Вызывается, когда покупатель повторяет неудачный запрос. Обработчик не получает данные.                            |
-| `onSelect?: (product: IProduct) => void`                                                                          | Передаёт объект отображаемого товара при выборе его изображения или названия. Приложение выполняет переход к товару. |
-| `onSelectSeller?: (seller: IProductSeller) => void`                                                               | Передаёт объект продавца отображаемого товара при выборе продавца. Приложение открывает его страницу. |
-| `onSelectVariant?: (selection: ProductActionSelection & { variant: IProductVariantValue; }) => void`              | Передаёт ID ранее отображаемого товара в `product` и выбранный основной вариант в `variant`. Доступный товар выбранного варианта заменяет карточку; отсутствующие данные загружает приложение. |
-| `onRequestSecondaryVariants?: (request: IProductSecondaryVariantRequest) => void`                                 | Передаёт ID товара в `product`, ID группы товаров в `productGroup` и основной вариант в `variant`, когда для него нужно загрузить дополнительные варианты. Приложение загружает и передаёт их в хранилище товаров. |
-| `onSelectSecondaryVariant?: (selection: ProductActionSelection & { variant: IProductSecondaryVariant; }) => void` | Передаёт ID ранее отображаемого товара в `product` и выбранный дополнительный вариант в `variant` после замены отображаемого товара. Выбор сохраняет данные дополнительных вариантов. |
-| `onToggleFavorite?: (selection: ProductActionSelection & { selected: boolean; }) => void`                         | Передаёт ID товара в `product` и желаемое состояние избранного в `selected` после нажатия сердца. Приложение подтверждает изменение запросом и обновляет данные товара. |
-| `onAdd?: (selection: ProductActionSelection & { quantity: number; }) => void`                                     | Передаёт `product` — ID товара и `quantity` — запрошенное итоговое количество при добавлении или изменении количества. Приложение выполняет запрос и передаёт подтверждённые данные товара. |
-| `onRemove?: (selection: ProductActionSelection & { cartItem: number; }) => void`                                  | Передаёт ID товара в `product` и ID позиции корзины в `cartItem` при удалении последней единицы. Приложение удаляет эту позицию и передаёт подтверждённые данные товара. |
-| `onSubscribe?: (selection: ProductActionSelection) => void`                                                       | Передаёт ID товара в `product` при выборе уведомления о поступлении. Приложение выполняет вход, если он нужен, отправляет запрос и обновляет состояние подписки. |
-| `onUnsubscribe?: (selection: ProductActionSelection) => void`                                                     | Передаёт ID товара в `product` при отмене уведомления о поступлении. Приложение отправляет запрос и передаёт подтверждённое состояние подписки. |
-| `onPreorder?: (selection: ProductActionSelection) => void`                                                        | Передаёт ID товара в `product` при выборе предзаказа. Приложение собирает необходимые контактные данные и отправляет запрос. |