@seekora-ai/ui-sdk-react 0.2.5 → 0.2.7

package/dist/components/suggestions-primitives/SuggestionItem.js

@@ -0,0 +1,34 @@
+/**
+ * SuggestionItem – single text suggestion row (primitive)
+ *
+ * Highlights when isActive; onClick calls context selectSuggestion. Overridable via className/style.
+ */
+import React from 'react';
+import { clsx } from 'clsx';
+const defaultItemStyle = {
+    padding: '10px 12px',
+    cursor: 'pointer',
+    listStyle: 'none',
+    border: 'none',
+    width: '100%',
+    textAlign: 'left',
+    fontSize: 'inherit',
+    fontFamily: 'inherit',
+    backgroundColor: 'transparent',
+    color: 'var(--seekora-text-primary, #111827)',
+    transition: 'background-color 120ms ease',
+};
+export function SuggestionItem({ suggestion, index, isActive, onSelect, className, style, renderHighlight, }) {
+    const displayText = suggestion.highlightedQuery ?? suggestion.query;
+    const content = renderHighlight ? renderHighlight(displayText) : displayText;
+    return (React.createElement("li", { role: "option", "aria-selected": isActive, id: `seekora-suggestion-${index}`, className: clsx('seekora-suggestions-item', isActive && 'seekora-suggestions-item--active', className), style: {
+            ...defaultItemStyle,
+            ...(isActive ? { backgroundColor: 'var(--seekora-bg-hover, #f3f4f6)' } : {}),
+            ...style,
+        }, onMouseDown: (e) => {
+            e.preventDefault();
+            onSelect();
+        } },
+        content,
+        suggestion.count != null ? (React.createElement("span", { className: "seekora-suggestions-item-count", style: { marginLeft: 8, color: 'var(--seekora-text-secondary, #6b7280)', fontSize: '0.875em' } }, suggestion.count)) : null));
+}

package/dist/components/suggestions-primitives/SuggestionList.d.ts

@@ -0,0 +1,15 @@
+/**
+ * SuggestionList – container for text suggestions (primitive)
+ *
+ * Renders list of SuggestionItem from context; uses activeIndex for highlight. Optional renderItem.
+ */
+import React from 'react';
+export interface SuggestionListProps {
+    maxItems?: number;
+    className?: string;
+    style?: React.CSSProperties;
+    listClassName?: string;
+    renderItem?: (suggestion: import('@seekora-ai/ui-sdk-types').SuggestionItem, index: number, isActive: boolean, onSelect: () => void) => React.ReactNode;
+}
+export declare function SuggestionList({ maxItems, className, style, listClassName, renderItem, }: SuggestionListProps): React.JSX.Element | null;
+//# sourceMappingURL=SuggestionList.d.ts.map

package/dist/components/suggestions-primitives/SuggestionList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionList.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions-primitives/SuggestionList.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,CACX,UAAU,EAAE,OAAO,0BAA0B,EAAE,cAAc,EAC7D,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,MAAM,IAAI,KACjB,KAAK,CAAC,SAAS,CAAC;CACtB;AAOD,wBAAgB,cAAc,CAAC,EAC7B,QAAa,EACb,SAAS,EACT,KAAK,EACL,aAAa,EACb,UAAU,GACX,EAAE,mBAAmB,4BA+CrB"}

package/dist/components/suggestions-primitives/SuggestionList.js

@@ -0,0 +1,36 @@
+/**
+ * SuggestionList – container for text suggestions (primitive)
+ *
+ * Renders list of SuggestionItem from context; uses activeIndex for highlight. Optional renderItem.
+ */
+import React from 'react';
+import { useSuggestionsContext } from './SuggestionsContext';
+import { SuggestionItem } from './SuggestionItem';
+import { SuggestionsLoading } from './SuggestionsLoading';
+import { clsx } from 'clsx';
+const listStyle = {
+    margin: 0,
+    padding: '4px 0',
+};
+export function SuggestionList({ maxItems = 10, className, style, listClassName, renderItem, }) {
+    const { suggestions, activeIndex, loading, selectSuggestion, getAllNavigableItems, } = useSuggestionsContext();
+    const items = suggestions.slice(0, maxItems);
+    const navigableItems = getAllNavigableItems();
+    const suggestionStartIndex = navigableItems.findIndex((n) => n.type === 'suggestion');
+    const activeIsInSuggestions = suggestionStartIndex >= 0 && activeIndex >= suggestionStartIndex && activeIndex < suggestionStartIndex + items.length;
+    if (loading) {
+        return React.createElement(SuggestionsLoading, { className: className, style: style });
+    }
+    if (items.length === 0)
+        return null;
+    return (React.createElement("div", { className: clsx('seekora-suggestions-list', className), style: style },
+        React.createElement("ul", { className: clsx('seekora-suggestions-list-ul', listClassName), style: listStyle, role: "listbox" }, items.map((suggestion, i) => {
+            const globalIndex = suggestionStartIndex >= 0 ? suggestionStartIndex + i : i;
+            const isActive = activeIsInSuggestions && activeIndex === globalIndex;
+            const onSelect = () => selectSuggestion(suggestion, globalIndex);
+            if (renderItem) {
+                return (React.createElement("li", { key: suggestion.objectID ?? suggestion.query ?? i, role: "option" }, renderItem(suggestion, globalIndex, isActive, onSelect)));
+            }
+            return (React.createElement(SuggestionItem, { key: suggestion.objectID ?? suggestion.query ?? i, suggestion: suggestion, index: globalIndex, isActive: isActive, onSelect: onSelect }));
+        }))));
+}

package/dist/components/suggestions-primitives/SuggestionsContext.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Suggestions Context
+ *
+ * Type definitions and React context for composable suggestions primitives.
+ * Consuming components use useSuggestionsContext() for state and actions.
+ */
+import React from 'react';
+import type { SuggestionItem, ProductItem, RecentSearch, TrendingSearch, FilteredTab } from '@seekora-ai/ui-sdk-types';
+import type { NavigableItem } from '../../hooks/useQuerySuggestionsEnhanced';
+export interface SuggestionsContextValue {
+    query: string;
+    setQuery: (query: string) => void;
+    isOpen: boolean;
+    setIsOpen: (open: boolean) => void;
+    activeIndex: number;
+    setActiveIndex: (index: number) => void;
+    suggestions: SuggestionItem[];
+    recentSearches: RecentSearch[];
+    trendingSearches: TrendingSearch[];
+    trendingProducts: ProductItem[];
+    filteredTabs: FilteredTab[];
+    activeTabId: string;
+    setActiveTabId: (id: string) => void;
+    loading: boolean;
+    error: Error | null;
+    hasContent: boolean;
+    getAllNavigableItems: () => NavigableItem[];
+    selectSuggestion: (suggestion: SuggestionItem, position: number) => void;
+    selectProduct: (product: ProductItem, position: number, section?: string, tabId?: string) => void;
+    selectRecentSearch: (search: RecentSearch) => void;
+    selectTrendingSearch: (trending: TrendingSearch, position: number) => void;
+    setActiveTab: (tab: FilteredTab) => void;
+    submitSearch: (query: string, fromSuggestion?: boolean, suggestion?: SuggestionItem) => void;
+    close: () => void;
+    navigateNext: () => void;
+    navigatePrev: () => void;
+    selectActive: () => void;
+}
+export declare const SuggestionsContext: React.Context<SuggestionsContextValue | null>;
+export declare function useSuggestionsContext(): SuggestionsContextValue;
+//# sourceMappingURL=SuggestionsContext.d.ts.map

package/dist/components/suggestions-primitives/SuggestionsContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsContext.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions-primitives/SuggestionsContext.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAoC,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EACV,cAAc,EACd,WAAW,EACX,YAAY,EACZ,cAAc,EACd,WAAW,EACZ,MAAM,0BAA0B,CAAC;AAClC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,MAAM,WAAW,uBAAuB;IAEtC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAExC,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,cAAc,EAAE,YAAY,EAAE,CAAC;IAC/B,gBAAgB,EAAE,cAAc,EAAE,CAAC;IACnC,gBAAgB,EAAE,WAAW,EAAE,CAAC;IAChC,YAAY,EAAE,WAAW,EAAE,CAAC;IAC5B,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAErC,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,oBAAoB,EAAE,MAAM,aAAa,EAAE,CAAC;IAG5C,gBAAgB,EAAE,CAAC,UAAU,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACzE,aAAa,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAClG,kBAAkB,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IACnD,oBAAoB,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,YAAY,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAC;IACzC,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,cAAc,CAAC,EAAE,OAAO,EAAE,UAAU,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IAC7F,KAAK,EAAE,MAAM,IAAI,CAAC;IAGlB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED,eAAO,MAAM,kBAAkB,+CAAsD,CAAC;AAEtF,wBAAgB,qBAAqB,IAAI,uBAAuB,CAQ/D"}

package/dist/components/suggestions-primitives/SuggestionsContext.js

@@ -0,0 +1,18 @@
+/**
+ * Suggestions Context
+ *
+ * Type definitions and React context for composable suggestions primitives.
+ * Consuming components use useSuggestionsContext() for state and actions.
+ */
+import { createContext, useContext } from 'react';
+import { log } from '@seekora-ai/ui-sdk-core';
+export const SuggestionsContext = createContext(null);
+export function useSuggestionsContext() {
+    const context = useContext(SuggestionsContext);
+    if (!context) {
+        const error = new Error('useSuggestionsContext must be used within a SuggestionsProvider');
+        log.error('SuggestionsContext: not available', { error: error.message });
+        throw error;
+    }
+    return context;
+}

package/dist/components/suggestions-primitives/SuggestionsDropdownComposition.d.ts

@@ -0,0 +1,24 @@
+/**
+ * SuggestionsDropdownComposition – reference composition
+ *
+ * Example layout built from primitives: SearchInput + DropdownPanel containing
+ * RecentSearchesList (when query empty), SuggestionList, CategoriesTabs, ProductGrid, TrendingList.
+ * Wrap with SearchProvider and SuggestionsProvider. Use as reference or replace
+ * with your own arrangement of the same primitives.
+ */
+import React from 'react';
+import type { SuggestionsProviderProps } from './SuggestionsProvider';
+export interface SuggestionsDropdownCompositionProps extends Omit<SuggestionsProviderProps, 'children'> {
+    /** Show recent searches when query is empty */
+    showRecentSearches?: boolean;
+    /** Show trending list */
+    showTrending?: boolean;
+    /** Show categories/filtered tabs */
+    showTabs?: boolean;
+    /** Show product grid */
+    showProducts?: boolean;
+    /** SearchInput placeholder */
+    placeholder?: string;
+}
+export declare function SuggestionsDropdownComposition({ showRecentSearches, showTrending, showTabs, showProducts, placeholder, ...providerProps }: SuggestionsDropdownCompositionProps): React.JSX.Element;
+//# sourceMappingURL=SuggestionsDropdownComposition.d.ts.map

package/dist/components/suggestions-primitives/SuggestionsDropdownComposition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsDropdownComposition.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions-primitives/SuggestionsDropdownComposition.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AAEtE,MAAM,WAAW,mCAAoC,SAAQ,IAAI,CAAC,wBAAwB,EAAE,UAAU,CAAC;IACrG,+CAA+C;IAC/C,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,yBAAyB;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wBAAwB;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,8BAA8B;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,8BAA8B,CAAC,EAC7C,kBAAyB,EACzB,YAAmB,EACnB,QAAe,EACf,YAAmB,EACnB,WAAW,EACX,GAAG,aAAa,EACjB,EAAE,mCAAmC,qBAiBrC"}

package/dist/components/suggestions-primitives/SuggestionsDropdownComposition.js

@@ -0,0 +1,32 @@
+/**
+ * SuggestionsDropdownComposition – reference composition
+ *
+ * Example layout built from primitives: SearchInput + DropdownPanel containing
+ * RecentSearchesList (when query empty), SuggestionList, CategoriesTabs, ProductGrid, TrendingList.
+ * Wrap with SearchProvider and SuggestionsProvider. Use as reference or replace
+ * with your own arrangement of the same primitives.
+ */
+import React from 'react';
+import { SuggestionsProvider } from './SuggestionsProvider';
+import { SearchInput } from './SearchInput';
+import { DropdownPanel } from './DropdownPanel';
+import { RecentSearchesList } from './RecentSearchesList';
+import { SuggestionList } from './SuggestionList';
+import { CategoriesTabs } from './CategoriesTabs';
+import { ProductGrid } from './ProductGrid';
+import { TrendingList } from './TrendingList';
+import { SuggestionsLoading } from './SuggestionsLoading';
+import { SuggestionsError } from './SuggestionsError';
+export function SuggestionsDropdownComposition({ showRecentSearches = true, showTrending = true, showTabs = true, showProducts = true, placeholder, ...providerProps }) {
+    return (React.createElement(SuggestionsProvider, { ...providerProps },
+        React.createElement("div", { className: "seekora-suggestions-dropdown-composition", style: { position: 'relative', width: '100%' } },
+            React.createElement(SearchInput, { placeholder: placeholder }),
+            React.createElement(DropdownPanel, null,
+                React.createElement(SuggestionsError, null),
+                React.createElement(SuggestionsLoading, null),
+                showRecentSearches ? React.createElement(RecentSearchesList, null) : null,
+                React.createElement(SuggestionList, null),
+                showTabs ? React.createElement(CategoriesTabs, null) : null,
+                showProducts ? React.createElement(ProductGrid, null) : null,
+                showTrending ? React.createElement(TrendingList, null) : null))));
+}

package/dist/components/suggestions-primitives/SuggestionsError.d.ts

@@ -0,0 +1,11 @@
+/**
+ * SuggestionsError – error message (primitive)
+ */
+import React from 'react';
+export interface SuggestionsErrorProps {
+    className?: string;
+    style?: React.CSSProperties;
+    render?: (error: Error) => React.ReactNode;
+}
+export declare function SuggestionsError({ className, style, render }: SuggestionsErrorProps): React.JSX.Element | null;
+//# sourceMappingURL=SuggestionsError.d.ts.map

package/dist/components/suggestions-primitives/SuggestionsError.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsError.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions-primitives/SuggestionsError.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,qBAAqB;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,KAAK,CAAC,SAAS,CAAC;CAC5C;AAED,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,qBAAqB,4BAmBnF"}

package/dist/components/suggestions-primitives/SuggestionsError.js

@@ -0,0 +1,19 @@
+/**
+ * SuggestionsError – error message (primitive)
+ */
+import React from 'react';
+import { useSuggestionsContext } from './SuggestionsContext';
+import { clsx } from 'clsx';
+export function SuggestionsError({ className, style, render }) {
+    const { error } = useSuggestionsContext();
+    if (!error)
+        return null;
+    if (render)
+        return React.createElement(React.Fragment, null, render(error));
+    return (React.createElement("div", { className: clsx('seekora-suggestions-error', className), style: {
+            padding: 16,
+            color: 'var(--seekora-error, #dc2626)',
+            fontSize: '0.875rem',
+            ...style,
+        } }, error.message));
+}

package/dist/components/suggestions-primitives/SuggestionsLoading.d.ts

@@ -0,0 +1,11 @@
+/**
+ * SuggestionsLoading – loading indicator (primitive)
+ */
+import React from 'react';
+export interface SuggestionsLoadingProps {
+    className?: string;
+    style?: React.CSSProperties;
+    text?: string;
+}
+export declare function SuggestionsLoading({ className, style, text }: SuggestionsLoadingProps): React.JSX.Element | null;
+//# sourceMappingURL=SuggestionsLoading.d.ts.map

package/dist/components/suggestions-primitives/SuggestionsLoading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsLoading.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions-primitives/SuggestionsLoading.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,uBAAuB;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,kBAAkB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAmB,EAAE,EAAE,uBAAuB,4BAiBpG"}

package/dist/components/suggestions-primitives/SuggestionsLoading.js

@@ -0,0 +1,17 @@
+/**
+ * SuggestionsLoading – loading indicator (primitive)
+ */
+import React from 'react';
+import { useSuggestionsContext } from './SuggestionsContext';
+import { clsx } from 'clsx';
+export function SuggestionsLoading({ className, style, text = 'Loading...' }) {
+    const { loading } = useSuggestionsContext();
+    if (!loading)
+        return null;
+    return (React.createElement("div", { className: clsx('seekora-suggestions-loading', className), style: {
+            padding: 16,
+            color: 'var(--seekora-text-secondary, #6b7280)',
+            fontSize: '0.875rem',
+            ...style,
+        } }, text));
+}

package/dist/components/suggestions-primitives/SuggestionsProvider.d.ts

@@ -0,0 +1,38 @@
+/**
+ * SuggestionsProvider
+ *
+ * Provides suggestions state (query, suggestions, products, recent, trending, tabs),
+ * actions (selectSuggestion, selectProduct, submitSearch, etc.), and keyboard navigation.
+ * Uses useQuerySuggestionsEnhanced and useSuggestionsAnalytics; must be inside SearchProvider.
+ */
+import React from 'react';
+import type { SuggestionItem, ProductItem } from '@seekora-ai/ui-sdk-types';
+export interface SuggestionsProviderProps {
+    children: React.ReactNode;
+    /** Min query length to fetch suggestions */
+    minQueryLength?: number;
+    /** Debounce ms for suggestion fetch */
+    debounceMs?: number;
+    /** Max suggestions */
+    maxSuggestions?: number;
+    /** Include dropdown recommendations (trending, products, etc.) */
+    includeDropdownRecommendations?: boolean;
+    /** Filtered tabs config */
+    filteredTabs?: Array<{
+        id?: string;
+        label: string;
+        filter: string;
+    }>;
+    /** Enable analytics (V3) */
+    enableAnalytics?: boolean;
+    /** Analytics tags */
+    analyticsTags?: string[];
+    /** Callback when user submits search (e.g. navigate to results page) */
+    onSearch?: (query: string) => void;
+    /** Callback when user selects a suggestion */
+    onSuggestionSelect?: (suggestion: SuggestionItem) => void;
+    /** Callback when user clicks a product */
+    onProductClick?: (product: ProductItem) => void;
+}
+export declare function SuggestionsProvider({ children, minQueryLength, debounceMs, maxSuggestions, includeDropdownRecommendations, filteredTabs, enableAnalytics, analyticsTags, onSearch, onSuggestionSelect, onProductClick, }: SuggestionsProviderProps): React.JSX.Element;
+//# sourceMappingURL=SuggestionsProvider.d.ts.map

package/dist/components/suggestions-primitives/SuggestionsProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestionsProvider.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions-primitives/SuggestionsProvider.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAMN,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAA6C,MAAM,0BAA0B,CAAC;AAGvH,MAAM,WAAW,wBAAwB;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,4CAA4C;IAC5C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,uCAAuC;IACvC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sBAAsB;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kEAAkE;IAClE,8BAA8B,CAAC,EAAE,OAAO,CAAC;IACzC,2BAA2B;IAC3B,YAAY,CAAC,EAAE,KAAK,CAAC;QAAE,EAAE,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACrE,4BAA4B;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,qBAAqB;IACrB,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,8CAA8C;IAC9C,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,cAAc,KAAK,IAAI,CAAC;IAC1D,0CAA0C;IAC1C,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;CACjD;AAED,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,cAAkB,EAClB,UAAgB,EAChB,cAAmB,EACnB,8BAAqC,EACrC,YAAY,EACZ,eAAsB,EACtB,aAAa,EACb,QAAQ,EACR,kBAAkB,EAClB,cAAc,GACf,EAAE,wBAAwB,qBA8O1B"}

package/dist/components/suggestions-primitives/SuggestionsProvider.js

@@ -0,0 +1,222 @@
+/**
+ * SuggestionsProvider
+ *
+ * Provides suggestions state (query, suggestions, products, recent, trending, tabs),
+ * actions (selectSuggestion, selectProduct, submitSearch, etc.), and keyboard navigation.
+ * Uses useQuerySuggestionsEnhanced and useSuggestionsAnalytics; must be inside SearchProvider.
+ */
+import React, { useState, useCallback, useMemo, useEffect, useRef, } from 'react';
+import { useSearchContext } from '../SearchProvider';
+import { useQuerySuggestionsEnhanced } from '../../hooks/useQuerySuggestionsEnhanced';
+import { useSuggestionsAnalytics } from '../../hooks/useSuggestionsAnalytics';
+import { SuggestionsContext } from './SuggestionsContext';
+export function SuggestionsProvider({ children, minQueryLength = 1, debounceMs = 200, maxSuggestions = 10, includeDropdownRecommendations = true, filteredTabs, enableAnalytics = true, analyticsTags, onSearch, onSuggestionSelect, onProductClick, }) {
+    const { client } = useSearchContext();
+    const [query, setQueryState] = useState('');
+    const [isOpen, setIsOpenState] = useState(false);
+    const [activeIndex, setActiveIndex] = useState(-1);
+    const [activeTabId, setActiveTabId] = useState('');
+    const suggestionsData = useQuerySuggestionsEnhanced({
+        client,
+        query,
+        enabled: isOpen,
+        minQueryLength,
+        debounceMs,
+        maxSuggestions,
+        includeDropdownRecommendations,
+        filteredTabs,
+        includeCategories: true,
+        enableRecentSearches: true,
+        maxRecentSearches: 8,
+        analyticsTags,
+    });
+    const analytics = useSuggestionsAnalytics({
+        client,
+        enabled: enableAnalytics,
+        analyticsTags,
+        trackClicks: true,
+        trackImpressions: true,
+    });
+    const { suggestions, recentSearches, trendingSearches, trendingProducts, filteredTabs: filteredTabsData, loading, error, hasContent, getAllNavigableItems, addRecentSearch, } = suggestionsData;
+    const onSearchRef = useRef(onSearch);
+    const onSuggestionSelectRef = useRef(onSuggestionSelect);
+    const onProductClickRef = useRef(onProductClick);
+    onSearchRef.current = onSearch;
+    onSuggestionSelectRef.current = onSuggestionSelect;
+    onProductClickRef.current = onProductClick;
+    const setQuery = useCallback((q) => {
+        setQueryState(q);
+        setActiveIndex(-1);
+    }, []);
+    const close = useCallback(() => {
+        analytics.trackDropdownClose(query);
+        setIsOpenState(false);
+        setActiveIndex(-1);
+    }, [analytics, query]);
+    const setIsOpen = useCallback((open) => {
+        if (open) {
+            setIsOpenState(true);
+            analytics.trackDropdownOpen(query);
+        }
+        else {
+            close();
+        }
+    }, [analytics, query, close]);
+    const selectSuggestion = useCallback((suggestion, position) => {
+        analytics.trackSuggestionClick({
+            suggestion,
+            position,
+            query,
+            totalSuggestions: suggestions.length,
+        });
+        setQuery(suggestion.query);
+        onSuggestionSelectRef.current?.(suggestion);
+        analytics.trackSearchSubmit(suggestion.query, true, suggestion);
+        addRecentSearch(suggestion.query);
+        close();
+        onSearchRef.current?.(suggestion.query);
+    }, [analytics, query, suggestions.length, addRecentSearch, close]);
+    const selectProduct = useCallback((product, position, section, tabId) => {
+        analytics.trackProductClick({
+            product,
+            position,
+            section: section ?? 'products',
+            tabId,
+            query,
+        });
+        close();
+        onProductClickRef.current?.(product);
+    }, [analytics, query, close]);
+    const selectRecentSearch = useCallback((search) => {
+        analytics.trackRecentSearchClick(search);
+        setQuery(search.query);
+        close();
+        onSearchRef.current?.(search.query);
+        analytics.trackSearchSubmit(search.query, false);
+    }, [analytics, close]);
+    const selectTrendingSearch = useCallback((trending, position) => {
+        analytics.trackTrendingClick(trending, position);
+        setQuery(trending.query);
+        close();
+        onSearchRef.current?.(trending.query);
+        analytics.trackSearchSubmit(trending.query, false);
+    }, [analytics, close]);
+    const setActiveTab = useCallback((tab) => {
+        setActiveTabId(tab.id);
+        analytics.trackTabSelect(tab, query);
+    }, [analytics, query]);
+    const submitSearch = useCallback((q, fromSuggestion, suggestion) => {
+        const trimmed = q.trim();
+        if (!trimmed)
+            return;
+        analytics.trackSearchSubmit(trimmed, !!fromSuggestion, suggestion);
+        addRecentSearch(trimmed);
+        close();
+        onSearchRef.current?.(trimmed);
+    }, [analytics, addRecentSearch, close]);
+    const navigateNext = useCallback(() => {
+        const items = getAllNavigableItems();
+        if (items.length === 0)
+            return;
+        setActiveIndex((i) => (i < items.length - 1 ? i + 1 : 0));
+    }, [getAllNavigableItems]);
+    const navigatePrev = useCallback(() => {
+        const items = getAllNavigableItems();
+        if (items.length === 0)
+            return;
+        setActiveIndex((i) => (i <= 0 ? items.length - 1 : i - 1));
+    }, [getAllNavigableItems]);
+    const selectActive = useCallback(() => {
+        const items = getAllNavigableItems();
+        if (activeIndex < 0 || activeIndex >= items.length) {
+            submitSearch(query);
+            return;
+        }
+        const item = items[activeIndex];
+        switch (item.type) {
+            case 'suggestion':
+                selectSuggestion(item.data, item.index);
+                break;
+            case 'product':
+                selectProduct(item.data, item.index, 'products');
+                break;
+            case 'recent':
+                selectRecentSearch(item.data);
+                break;
+            case 'trending':
+                selectTrendingSearch(item.data, item.index);
+                break;
+            default:
+                submitSearch(query);
+        }
+    }, [activeIndex, getAllNavigableItems, query, submitSearch, selectSuggestion, selectProduct, selectRecentSearch, selectTrendingSearch]);
+    // Impression when open and content changes
+    useEffect(() => {
+        if (!isOpen || !hasContent || !query)
+            return;
+        analytics.trackImpression({
+            suggestions,
+            products: trendingProducts,
+            query,
+            timestamp: Date.now(),
+        });
+    }, [isOpen, hasContent, query, suggestions, trendingProducts, analytics]);
+    const value = useMemo(() => ({
+        query,
+        setQuery,
+        isOpen,
+        setIsOpen,
+        activeIndex,
+        setActiveIndex,
+        suggestions,
+        recentSearches,
+        trendingSearches,
+        trendingProducts,
+        filteredTabs: filteredTabsData,
+        activeTabId,
+        setActiveTabId,
+        loading,
+        error,
+        hasContent,
+        getAllNavigableItems,
+        selectSuggestion,
+        selectProduct,
+        selectRecentSearch,
+        selectTrendingSearch,
+        setActiveTab,
+        submitSearch,
+        close,
+        navigateNext,
+        navigatePrev,
+        selectActive,
+    }), [
+        query,
+        setQuery,
+        isOpen,
+        setIsOpen,
+        activeIndex,
+        setActiveIndex,
+        suggestions,
+        recentSearches,
+        trendingSearches,
+        trendingProducts,
+        filteredTabsData,
+        activeTabId,
+        setActiveTabId,
+        loading,
+        error,
+        hasContent,
+        getAllNavigableItems,
+        selectSuggestion,
+        selectProduct,
+        selectRecentSearch,
+        selectTrendingSearch,
+        setActiveTab,
+        submitSearch,
+        close,
+        navigateNext,
+        navigatePrev,
+        selectActive,
+    ]);
+    return (React.createElement(SuggestionsContext.Provider, { value: value }, children));
+}

package/dist/components/suggestions-primitives/TrendingList.d.ts

@@ -0,0 +1,17 @@
+/**
+ * TrendingList – list of trending searches (primitive)
+ *
+ * Reads trendingSearches from context; each click calls selectTrendingSearch. Optional title/render.
+ */
+import React from 'react';
+import type { TrendingSearch } from '@seekora-ai/ui-sdk-types';
+export interface TrendingListProps {
+    title?: string;
+    maxItems?: number;
+    className?: string;
+    style?: React.CSSProperties;
+    listClassName?: string;
+    renderItem?: (trending: TrendingSearch, index: number, onSelect: () => void) => React.ReactNode;
+}
+export declare function TrendingList({ title, maxItems, className, style, listClassName, renderItem, }: TrendingListProps): React.JSX.Element | null;
+//# sourceMappingURL=TrendingList.d.ts.map

package/dist/components/suggestions-primitives/TrendingList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrendingList.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions-primitives/TrendingList.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE/D,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,IAAI,KAAK,KAAK,CAAC,SAAS,CAAC;CACjG;AAeD,wBAAgB,YAAY,CAAC,EAC3B,KAAkB,EAClB,QAAY,EACZ,SAAS,EACT,KAAK,EACL,aAAa,EACb,UAAU,GACX,EAAE,iBAAiB,4BA4CnB"}

package/dist/components/suggestions-primitives/TrendingList.js

@@ -0,0 +1,41 @@
+/**
+ * TrendingList – list of trending searches (primitive)
+ *
+ * Reads trendingSearches from context; each click calls selectTrendingSearch. Optional title/render.
+ */
+import React from 'react';
+import { useSuggestionsContext } from './SuggestionsContext';
+import { clsx } from 'clsx';
+const itemStyle = {
+    padding: '10px 12px',
+    cursor: 'pointer',
+    border: 'none',
+    width: '100%',
+    textAlign: 'left',
+    fontSize: 'inherit',
+    fontFamily: 'inherit',
+    backgroundColor: 'transparent',
+    color: 'var(--seekora-text-primary, #111827)',
+    transition: 'background-color 120ms ease',
+};
+export function TrendingList({ title = 'Trending', maxItems = 8, className, style, listClassName, renderItem, }) {
+    const { trendingSearches, selectTrendingSearch } = useSuggestionsContext();
+    const items = trendingSearches.slice(0, maxItems);
+    if (items.length === 0)
+        return null;
+    return (React.createElement("div", { className: clsx('seekora-suggestions-trending-list', className), style: style },
+        title ? (React.createElement("div", { className: "seekora-suggestions-trending-title", style: { padding: '8px 12px', fontSize: '0.75rem', fontWeight: 600, color: 'var(--seekora-text-secondary, #6b7280)', textTransform: 'uppercase' } }, title)) : null,
+        React.createElement("ul", { className: clsx('seekora-suggestions-trending-ul', listClassName), style: { margin: 0, padding: 0, listStyle: 'none' } }, items.map((trending, i) => {
+            const onSelect = () => selectTrendingSearch(trending, i);
+            if (renderItem) {
+                return React.createElement("li", { key: `${trending.query}-${i}` }, renderItem(trending, i, onSelect));
+            }
+            return (React.createElement("li", { key: `${trending.query}-${i}` },
+                React.createElement("button", { type: "button", className: "seekora-suggestions-trending-item", style: itemStyle, onMouseDown: (e) => {
+                        e.preventDefault();
+                        onSelect();
+                    } },
+                    trending.query,
+                    trending.count != null ? (React.createElement("span", { style: { marginLeft: 8, color: 'var(--seekora-text-secondary, #6b7280)', fontSize: '0.875em' } }, trending.count)) : null)));
+        }))));
+}