npm - @seekora-ai/ui-sdk-react - Versions diffs - 0.2.15 → 0.2.16 - Mend

@seekora-ai/ui-sdk-react 0.2.15 → 0.2.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (122) hide show

package/dist/components/primitives/VariantSwatches.js CHANGED Viewed

@@ -5,6 +5,7 @@
  */
 import React, { useState } from 'react';
 import { clsx } from 'clsx';
+import { useIsMobile } from '../../utils/responsive';
 const COLOR_NAMES = {
     black: '#000', white: '#fff', red: '#ef4444', blue: '#3b82f6',
     green: '#22c55e', yellow: '#eab308', orange: '#f97316', purple: '#a855f7',
@@ -61,6 +62,12 @@ const getAvailability = (optionName, value, options, variants, selectedValues) =
 };
 export function VariantSwatches({ options, visibleOptions, maxValues = 5, colorMap, selectedValues, variants, showAvailability = true, onSwatchHover, onSwatchClick, className, style, }) {
     const [expandedOptions, setExpandedOptions] = useState(new Set());
+    const isMobile = useIsMobile();
+    // Responsive sizing
+    const colorSwatchSize = isMobile ? 20 : 14; // Larger on mobile for touch
+    const textSwatchPadding = isMobile ? '4px 10px' : '1px 6px';
+    const textSwatchFontSize = isMobile ? '0.75rem' : '0.6875rem';
+    const gap = isMobile ? 6 : 4;
     if (!options || options.length === 0)
         return null;
     const filtered = visibleOptions
@@ -81,14 +88,14 @@ export function VariantSwatches({ options, visibleOptions, maxValues = 5, colorM
             return next;
         });
     };
-    return (React.createElement("div", { className: clsx('seekora-variant-swatches', className), style: { display: 'flex', flexDirection: 'column', gap: 4, ...style } }, filtered.map((option) => {
+    return (React.createElement("div", { className: clsx('seekora-variant-swatches', className), style: { display: 'flex', flexDirection: 'column', gap, ...style } }, filtered.map((option) => {
         const isColor = isColorOption(option.name);
         const isExpanded = expandedOptions.has(option.name);
         const visible = isExpanded ? option.values : option.values.slice(0, maxValues);
         const overflow = option.values.length - maxValues;
         const hasOverflow = overflow > 0;
         const selectedValue = selectedValues?.[option.name];
-        return (React.createElement("div", { key: option.name, className: "seekora-variant-swatch-group", style: { display: 'flex', alignItems: 'center', gap: 4, flexWrap: 'wrap' } },
+        return (React.createElement("div", { key: option.name, className: "seekora-variant-swatch-group", style: { display: 'flex', alignItems: 'center', gap, flexWrap: 'wrap' } },
             visible.map((value) => {
                 const color = isColor ? resolveColor(value, colorMap) : null;
                 const isSelected = selectedValue === value;
@@ -97,9 +104,13 @@ export function VariantSwatches({ options, visibleOptions, maxValues = 5, colorM
                     : true;
                 if (color) {
                     return (React.createElement("span", { key: value, className: clsx('seekora-variant-swatch', 'seekora-variant-swatch--color', isSelected && 'seekora-variant-swatch--selected', !isAvailable && 'seekora-variant-swatch--unavailable'), title: `${value}${!isAvailable ? ' (Unavailable)' : ''}`, style: {
-                            display: 'inline-block',
-                            width: 14,
-                            height: 14,
+                            display: 'inline-flex',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            width: colorSwatchSize,
+                            height: colorSwatchSize,
+                            minWidth: colorSwatchSize,
+                            minHeight: colorSwatchSize,
                             borderRadius: '50%',
                             backgroundColor: color,
                             border: isSelected
@@ -131,9 +142,12 @@ export function VariantSwatches({ options, visibleOptions, maxValues = 5, colorM
                         } }))));
                 }
                 return (React.createElement("span", { key: value, className: clsx('seekora-variant-swatch', 'seekora-variant-swatch--text', isSelected && 'seekora-variant-swatch--selected', !isAvailable && 'seekora-variant-swatch--unavailable'), style: {
-                        display: 'inline-block',
-                        padding: '1px 6px',
-                        fontSize: '0.6875rem',
+                        display: 'inline-flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                        padding: textSwatchPadding,
+                        minHeight: isMobile ? 32 : 24, // Minimum touch target on mobile
+                        fontSize: textSwatchFontSize,
                         borderRadius: 3,
                         border: isSelected
                             ? '1px solid var(--seekora-primary, #111827)'
@@ -160,11 +174,12 @@ export function VariantSwatches({ options, visibleOptions, maxValues = 5, colorM
                     } }, value));
             }),
             hasOverflow && (React.createElement("button", { type: "button", className: "seekora-variant-swatch--overflow", onClick: (e) => toggleExpanded(option.name, e), style: {
-                    fontSize: '0.6875rem',
+                    fontSize: textSwatchFontSize,
                     color: 'var(--seekora-primary, #2563eb)',
                     background: 'none',
                     border: 'none',
-                    padding: 0,
+                    padding: isMobile ? '4px 8px' : 0,
+                    minHeight: isMobile ? 32 : 'auto', // Touch target on mobile
                     cursor: 'pointer',
                     textDecoration: 'underline',
                     fontWeight: 500,

package/dist/components/section-primitives/SectionItemGrid.d.ts CHANGED Viewed

@@ -7,8 +7,6 @@ export interface SectionItemGridProps {
     maxItems?: number;
     className?: string;
     style?: React.CSSProperties;
-    /** Show loading state when fetching and no previous items (default false: show previous results until new render) */
-    showLoadingState?: boolean;
     getItemId?: (item: unknown) => string;
     getItemTitle?: (item: unknown) => string;
     getItemImage?: (item: unknown) => string | undefined;
@@ -16,5 +14,5 @@ export interface SectionItemGridProps {
     getItemUrl?: (item: unknown) => string | undefined;
     renderItem?: (item: unknown, index: number) => React.ReactNode;
 }
-export declare function SectionItemGrid({ columns, maxItems, className, style, showLoadingState, getItemId, getItemTitle, getItemImage, getItemDescription, getItemUrl, renderItem, }: SectionItemGridProps): React.JSX.Element;
+export declare function SectionItemGrid({ columns, maxItems, className, style, getItemId, getItemTitle, getItemImage, getItemDescription, getItemUrl, renderItem, }: SectionItemGridProps): React.JSX.Element;
 //# sourceMappingURL=SectionItemGrid.d.ts.map

package/dist/components/section-primitives/SectionItemGrid.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SectionItemGrid.d.ts","sourceRoot":"","sources":["../../../src/components/section-primitives/SectionItemGrid.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;~~AAO1B~~,MAAM,WAAW,oBAAoB;IACnC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,~~qHAAqH;IACrH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,~~SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,CAAC;IACtC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IACrD,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IAC3D,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CAChE;AAED,wBAAgB,eAAe,CAAC,EAC9B,OAAW,EACX,QAAa,EACb,SAAS,EACT,KAAK,EACL,~~gBAAwB,EACxB,~~SAA8E,EAC9E,YAAyE,EACzE,YAAmE,EACnE,kBAAqF,EACrF,UAA6D,EAC7D,UAAU,GACX,EAAE,oBAAoB,~~qBAuBtB~~"}
1	+ {"version":3,"file":"SectionItemGrid.d.ts","sourceRoot":"","sources":["../../../src/components/section-primitives/SectionItemGrid.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,WAAW,oBAAoB;IACnC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,CAAC;IACtC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IACrD,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IAC3D,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,CAAC;IACnD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CAChE;AAED,wBAAgB,eAAe,CAAC,EAC9B,OAAW,EACX,QAAa,EACb,SAAS,EACT,KAAK,EACL,SAA8E,EAC9E,YAAyE,EACzE,YAAmE,EACnE,kBAAqF,EACrF,UAA6D,EAC7D,UAAU,GACX,EAAE,oBAAoB,qBAsBtB"}

package/dist/components/section-primitives/SectionItemGrid.js CHANGED Viewed

@@ -4,12 +4,9 @@
 import React from 'react';
 import { useSectionSearchContext } from './SectionSearchContext';
 import { ItemGrid } from '../suggestions-primitives/ItemGrid';
-import { SectionLoading } from './SectionLoading';
 import { SectionError } from './SectionError';
-export function SectionItemGrid({ columns = 4, maxItems = 12, className, style, showLoadingState = false, getItemId = (i) => i.id ?? String(i?.objectID ?? ''), getItemTitle = (i) => i.title ?? i?.title ?? '', getItemImage = (i) => i.image ?? i?.image, getItemDescription = (i) => i.description ?? i?.description, getItemUrl = (i) => i.url ?? i?.url, renderItem, }) {
+export function SectionItemGrid({ columns = 4, maxItems = 12, className, style, getItemId = (i) => i.id ?? String(i?.objectID ?? ''), getItemTitle = (i) => i.title ?? i?.title ?? '', getItemImage = (i) => i.image ?? i?.image, getItemDescription = (i) => i.description ?? i?.description, getItemUrl = (i) => i.url ?? i?.url, renderItem, }) {
     const { items, loading, error, trackClick } = useSectionSearchContext();
-    if (loading && items.length === 0 && showLoadingState)
-        return React.createElement(SectionLoading, { className: className, style: style });
     if (error)
         return React.createElement(SectionError, { className: className, style: style });
     // When loading with previous items, show them (no loading screen)

package/dist/components/section-primitives/index.d.ts CHANGED Viewed

@@ -1,6 +1,5 @@
 export { SectionSearchProvider, type RefinementInput, type SectionSearchProviderProps } from './SectionSearchProvider';
 export { SectionSearchContext, useSectionSearchContext, type SectionSearchContextValue } from './SectionSearchContext';
 export { SectionItemGrid, type SectionItemGridProps } from './SectionItemGrid';
-export { SectionLoading, type SectionLoadingProps } from './SectionLoading';
 export { SectionError, type SectionErrorProps } from './SectionError';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/section-primitives/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/section-primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,KAAK,eAAe,EAAE,KAAK,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AACvH,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AACvH,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC/E,OAAO,EAAE,~~cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5E,OAAO,EAAE,~~YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/section-primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,KAAK,eAAe,EAAE,KAAK,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AACvH,OAAO,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AACvH,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC/E,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/section-primitives/index.js CHANGED Viewed

@@ -1,5 +1,4 @@
 export { SectionSearchProvider } from './SectionSearchProvider';
 export { SectionSearchContext, useSectionSearchContext } from './SectionSearchContext';
 export { SectionItemGrid } from './SectionItemGrid';
-export { SectionLoading } from './SectionLoading';
 export { SectionError } from './SectionError';

package/dist/components/suggestions/AmazonDropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AmazonDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/AmazonDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;~~AAkV9D~~,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,6CAA6C;IAC7C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,4BAA4B;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnD,uBAAuB;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,cAAc,~~yFAid1B~~,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"AmazonDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/AmazonDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAkU9D,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,6CAA6C;IAC7C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,4BAA4B;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnD,uBAAuB;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,cAAc,yFAsc1B,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/suggestions/AmazonDropdown.js CHANGED Viewed

@@ -225,22 +225,6 @@ const createStyles = (theme = {}, isMobile = false) => ({
         fontWeight: 700,
         color: 'var(--seekora-text-primary, #0f1111)',
     },
-    loading: {
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        padding: '40px',
-        color: 'var(--seekora-text-secondary, #565959)',
-        gap: '10px',
-    },
-    spinner: {
-        width: '20px',
-        height: '20px',
-        border: '2px solid var(--seekora-border-color, #ddd)',
-        borderTopColor: 'var(--seekora-primary, #f90)',
-        borderRadius: '50%',
-        animation: 'seekora-spin 0.8s linear infinite',
-    },
     empty: {
         padding: '40px 20px',
         textAlign: 'center',
@@ -306,7 +290,7 @@ const RatingStars = ({ rating, count }) => {
             ")"))));
 };
 export const AmazonDropdown = forwardRef(function AmazonDropdown(props, ref) {
-    const { query, isOpen = true, loading = false, suggestions = [], products = [], categories = [], recentSearches = [], trendingSearches = [], filteredTabs = [], activeTab = 'all', suggestionFields = { query: 'query' }, productFields = { id: 'id', title: 'title' }, categoryFields = { id: 'id', label: 'label' }, productDisplay = {}, theme = {}, showDepartments = true, currentDepartment, departments = [], showPrime = false, width = '700px', maxHeight = '500px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onProductClick, onCategoryClick, onTabChange, onRecentClick, onRecentRemove, onRecentClearAll, onViewAll, onClose, header, footer, showLoadingState = false, renderLoading, renderEmpty, } = props;
+    const { query, isOpen = true, loading = false, suggestions = [], products = [], categories = [], recentSearches = [], trendingSearches = [], filteredTabs = [], activeTab = 'all', suggestionFields = { query: 'query' }, productFields = { id: 'id', title: 'title' }, categoryFields = { id: 'id', label: 'label' }, productDisplay = {}, theme = {}, showDepartments = true, currentDepartment, departments = [], showPrime = false, width = '700px', maxHeight = '500px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onProductClick, onCategoryClick, onTabChange, onRecentClick, onRecentRemove, onRecentClearAll, onViewAll, onClose, header, footer, renderEmpty, } = props;
     // Inject global responsive styles
     useInjectResponsiveStyles();
     // Responsive state
@@ -403,9 +387,7 @@ export const AmazonDropdown = forwardRef(function AmazonDropdown(props, ref) {
           }
         `),
         header,
-        (loading && showLoadingState) ? (renderLoading ? renderLoading() : (React.createElement("div", { style: styles.loading },
-            React.createElement("div", { style: styles.spinner }),
-            React.createElement("span", null, "Searching...")))) : (React.createElement(React.Fragment, null,
+        React.createElement(React.Fragment, null,
             filteredTabs.length > 0 && (React.createElement("div", { style: {
                     display: 'flex',
                     gap: '8px',
@@ -510,7 +492,7 @@ export const AmazonDropdown = forwardRef(function AmazonDropdown(props, ref) {
                                 currency: '',
                                 priceDecimals: productDisplay.priceDecimals
                             }))),
-                        product.rating && (React.createElement(RatingStars, { rating: parseFloat(String(product.rating)), count: product.reviewCount ? parseInt(String(product.reviewCount)) : undefined }))))))))))),
+                        product.rating && (React.createElement(RatingStars, { rating: parseFloat(String(product.rating)), count: product.reviewCount ? parseInt(String(product.reviewCount)) : undefined })))))))))),
         footer !== undefined ? footer : (React.createElement("div", { style: styles.footer },
             React.createElement("div", { style: styles.keyboard },
                 React.createElement("span", { style: styles.key }, "\u2191"),

package/dist/components/suggestions/GoogleDropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GoogleDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/GoogleDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;~~AAiP9D~~,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,sCAAsC;IACtC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+BAA+B;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,2BAA2B;IAC3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,4BAA4B;IAC5B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,8BAA8B;IAC9B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,eAAO,MAAM,cAAc,~~yFAuU1B~~,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"GoogleDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/GoogleDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAiO9D,MAAM,WAAW,mBAAoB,SAAQ,iBAAiB;IAC5D,sCAAsC;IACtC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,gCAAgC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,+BAA+B;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,2BAA2B;IAC3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,4BAA4B;IAC5B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,8BAA8B;IAC9B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED,eAAO,MAAM,cAAc,yFA6T1B,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/suggestions/GoogleDropdown.js CHANGED Viewed

@@ -177,22 +177,6 @@ const createStyles = (isMobile = false) => ({
         backgroundColor: 'var(--seekora-bg-hover, #f1f3f4)',
         color: 'var(--seekora-text-primary, #202124)',
     },
-    loading: {
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        padding: '24px',
-        color: 'var(--seekora-text-secondary, #5f6368)',
-        gap: '12px',
-    },
-    spinner: {
-        width: '24px',
-        height: '24px',
-        border: '3px solid var(--seekora-border-color, #e8eaed)',
-        borderTopColor: 'var(--seekora-primary, #4285f4)',
-        borderRadius: '50%',
-        animation: 'seekora-spin 0.8s linear infinite',
-    },
     empty: {
         padding: '24px',
         textAlign: 'center',
@@ -214,7 +198,7 @@ const RemoveIcon = () => (React.createElement("svg", { viewBox: "0 0 24 24", fil
 const ArrowIcon = () => (React.createElement("svg", { viewBox: "0 0 24 24", fill: "none", width: "20", height: "20" },
     React.createElement("path", { d: "M9 5l-4 4 4 4", stroke: "currentColor", strokeWidth: "2", fill: "none", transform: "rotate(-90 12 12)" })));
 export const GoogleDropdown = forwardRef(function GoogleDropdown(props, ref) {
-    const { query, isOpen = true, loading = false, suggestions = [], recentSearches = [], trendingSearches = [], suggestionFields = { query: 'query' }, theme = {}, showFeelingLucky = true, feelingLuckyText = "I'm Feeling Lucky", showRemoveRecent = true, showVoiceSearch = false, showTrendingIndicator = true, width = '100%', maxHeight = '400px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onRecentClick, onRecentRemove, onVoiceSearch, onFeelingLucky, onClose, onSearchSubmit, header, footer, showLoadingState = false, renderLoading, renderEmpty, } = props;
+    const { query, isOpen = true, loading = false, suggestions = [], recentSearches = [], trendingSearches = [], suggestionFields = { query: 'query' }, theme = {}, showFeelingLucky = true, feelingLuckyText = "I'm Feeling Lucky", showRemoveRecent = true, showVoiceSearch = false, showTrendingIndicator = true, width = '100%', maxHeight = '400px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onRecentClick, onRecentRemove, onVoiceSearch, onFeelingLucky, onClose, onSearchSubmit, header, footer, renderEmpty, } = props;
     // Inject global responsive styles
     useInjectResponsiveStyles();
     // Responsive state
@@ -329,8 +313,7 @@ export const GoogleDropdown = forwardRef(function GoogleDropdown(props, ref) {
           }
         `),
         header,
-        (loading && showLoadingState) ? (renderLoading ? renderLoading() : (React.createElement("div", { style: styles.loading },
-            React.createElement("div", { style: styles.spinner })))) : (React.createElement(React.Fragment, null,
+        React.createElement(React.Fragment, null,
             React.createElement("ul", { style: styles.list },
                 showRecent && (React.createElement(React.Fragment, null,
                     recentQueries.map((q, idx) => {
@@ -360,7 +343,7 @@ export const GoogleDropdown = forwardRef(function GoogleDropdown(props, ref) {
                     "\"")))),
             (showFeelingLucky || showVoiceSearch) && (React.createElement("div", { style: styles.footer }, showFeelingLucky && (React.createElement(React.Fragment, null,
                 React.createElement("button", { style: mergeStyles(styles.footerButton, hoveredBtn === 'search' ? styles.footerButtonHover : undefined), onMouseEnter: () => setHoveredBtn('search'), onMouseLeave: () => setHoveredBtn(null), onClick: () => onSearchSubmit?.(query || (activeIndex >= 0 ? allItems[activeIndex]?.query : '')) }, "Search"),
-                React.createElement("button", { style: mergeStyles(styles.footerButton, hoveredBtn === 'lucky' ? styles.footerButtonHover : undefined), onMouseEnter: () => setHoveredBtn('lucky'), onMouseLeave: () => setHoveredBtn(null), onClick: () => onFeelingLucky?.(query || (activeIndex >= 0 ? allItems[activeIndex]?.query : '')) }, feelingLuckyText))))))),
+                React.createElement("button", { style: mergeStyles(styles.footerButton, hoveredBtn === 'lucky' ? styles.footerButtonHover : undefined), onMouseEnter: () => setHoveredBtn('lucky'), onMouseLeave: () => setHoveredBtn(null), onClick: () => onFeelingLucky?.(query || (activeIndex >= 0 ? allItems[activeIndex]?.query : '')) }, feelingLuckyText)))))),
         footer));
 });
 export default GoogleDropdown;

package/dist/components/suggestions/MinimalDropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MinimalDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/MinimalDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AA6K9D,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC7D,wBAAwB;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4BAA4B;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qCAAqC;IACrC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,wBAAwB;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,eAAe,~~0FAkU3B~~,CAAC;AAEF,eAAe,eAAe,CAAC"}
1	+ {"version":3,"file":"MinimalDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/MinimalDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AA6K9D,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC7D,wBAAwB;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4BAA4B;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,qCAAqC;IACrC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,wBAAwB;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,eAAe,0FA4T3B,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/components/suggestions/MinimalDropdown.js CHANGED Viewed

@@ -164,7 +164,7 @@ const createStyles = () => ({
     },
 });
 export const MinimalDropdown = forwardRef(function MinimalDropdown(props, ref) {
-    const { query, isOpen = true, loading = false, suggestions = [], products = [], recentSearches = [], suggestionFields = { query: 'query' }, productFields = { id: 'id', title: 'title' }, productDisplay = {}, theme = {}, showIndices = false, showTypeLabels = false, showSectionDividers = true, width = '100%', maxHeight = '400px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onProductClick, onRecentClick, onClose, onSearchSubmit, header, footer, showLoadingState = false, renderLoading, renderEmpty, } = props;
+    const { query, isOpen = true, loading = false, suggestions = [], products = [], recentSearches = [], suggestionFields = { query: 'query' }, productFields = { id: 'id', title: 'title' }, productDisplay = {}, theme = {}, showIndices = false, showTypeLabels = false, showSectionDividers = true, width = '100%', maxHeight = '400px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onProductClick, onRecentClick, onClose, onSearchSubmit, header, footer, renderEmpty, } = props;
     // Inject global responsive styles
     useInjectResponsiveStyles();
     // Responsive state
@@ -250,7 +250,7 @@ export const MinimalDropdown = forwardRef(function MinimalDropdown(props, ref) {
           }
         `),
         header,
-        React.createElement("div", { ref: listRef, style: { maxHeight, overflowY: 'auto' } }, (loading && allItems.length === 0 && showLoadingState) ? (renderLoading ? renderLoading() : (React.createElement("div", { style: styles.loading }, "Loading..."))) : allItems.length === 0 ? (renderEmpty ? renderEmpty(query) : (React.createElement("div", { style: styles.empty }, query ? `No results for "${query}"` : 'Start typing to search'))) : (React.createElement(React.Fragment, null,
+        React.createElement("div", { ref: listRef, style: { maxHeight, overflowY: 'auto' } }, allItems.length === 0 ? (renderEmpty ? renderEmpty(query) : (React.createElement("div", { style: styles.empty }, query ? `No results for "${query}"` : 'Start typing to search'))) : (React.createElement(React.Fragment, null,
             showRecent && (React.createElement(React.Fragment, null,
                 showSectionDividers && (React.createElement("div", { style: styles.divider }, "Recent")),
                 recentQueries.map((q, idx) => {

package/dist/components/suggestions/MobileSheetDropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MobileSheetDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/MobileSheetDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAwS9D,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;IACjE,kCAAkC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,yBAAyB;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uBAAuB;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,8BAA8B;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,mBAAmB,~~8FA6b~~/B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1	+ {"version":3,"file":"MobileSheetDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/MobileSheetDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAwS9D,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;IACjE,kCAAkC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,yBAAyB;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yBAAyB;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uBAAuB;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,8BAA8B;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,mBAAmB,8FAmb/B,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/suggestions/MobileSheetDropdown.js CHANGED Viewed

@@ -267,7 +267,7 @@ const ChevronIcon = () => (React.createElement("svg", { viewBox: "0 0 24 24", fi
 const ArrowUpIcon = () => (React.createElement("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", width: "20", height: "20" },
     React.createElement("path", { d: "M7 17l5-5-5-5M13 17l5-5-5-5" })));
 export const MobileSheetDropdown = forwardRef(function MobileSheetDropdown(props, ref) {
-    const { query, isOpen = true, loading = false, suggestions = [], products = [], recentSearches = [], trendingSearches = [], suggestionFields = { query: 'query' }, productFields = { id: 'id', title: 'title' }, productDisplay = {}, theme = {}, showSearchInput = true, showCancel = true, cancelText = 'Cancel', showDragHandle = true, swipeToDismiss = true, footerButtonText = 'Search', showFooterButton = true, width = '100%', maxHeight = '85vh', zIndex = 9999, className, style, classNames = {}, inputRef, onSuggestionSelect, onProductClick, onRecentClick, onRecentClearAll, onSearchSubmit, onClose, header, footer, showLoadingState = false, renderLoading, renderEmpty, } = props;
+    const { query, isOpen = true, loading = false, suggestions = [], products = [], recentSearches = [], trendingSearches = [], suggestionFields = { query: 'query' }, productFields = { id: 'id', title: 'title' }, productDisplay = {}, theme = {}, showSearchInput = true, showCancel = true, cancelText = 'Cancel', showDragHandle = true, swipeToDismiss = true, footerButtonText = 'Search', showFooterButton = true, width = '100%', maxHeight = '85vh', zIndex = 9999, className, style, classNames = {}, inputRef, onSuggestionSelect, onProductClick, onRecentClick, onRecentClearAll, onSearchSubmit, onClose, header, footer, renderEmpty, } = props;
     // Inject global responsive styles
     useInjectResponsiveStyles();
     const styles = useMemo(() => createStyles(), []);
@@ -386,7 +386,7 @@ export const MobileSheetDropdown = forwardRef(function MobileSheetDropdown(props
                 React.createElement("div", { style: styles.searchContainer },
                     React.createElement("div", { style: styles.searchIcon },
                         React.createElement(SearchIcon, null)),
-                    React.createElement("input", { ref: inputRef, type: "text", placeholder: "Search...", value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: (e) => {
+                    React.createElement("input", { ref: inputRef, type: "text", placeholder: "Powered by Seekora", value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: (e) => {
                             if (e.key === 'Enter') {
                                 e.preventDefault();
                                 if (activeIndex >= 0) {
@@ -409,70 +409,70 @@ export const MobileSheetDropdown = forwardRef(function MobileSheetDropdown(props
                             }
                         }, style: styles.searchInput, autoFocus: true })),
                 showCancel && (React.createElement("button", { style: styles.cancelBtn, onClick: onClose }, cancelText)))))),
-            React.createElement("div", { style: styles.content }, (loading && showLoadingState) ? (renderLoading ? renderLoading() : (React.createElement("div", { style: styles.loading },
-                React.createElement("div", { style: styles.spinner })))) : (React.createElement(React.Fragment, null,
-                showRecent && (React.createElement("div", { style: styles.section },
-                    React.createElement("div", { style: styles.sectionHeader },
-                        React.createElement("span", { style: styles.sectionTitle }, "Recent"),
-                        React.createElement("button", { style: styles.clearBtn, onClick: onRecentClearAll }, "Clear")),
-                    recentQueries.map((q, idx) => (React.createElement("div", { key: `recent-${q}`, "data-index": idx, style: mergeStyles(styles.item, activeIndex === idx ? styles.itemActive : undefined), onClick: () => {
-                            onRecentClick?.(q);
-                            setInputValue(q);
-                        }, onMouseEnter: () => setActiveIndex(idx) },
-                        React.createElement("div", { style: styles.itemIcon },
-                            React.createElement(ClockIcon, null)),
-                        React.createElement("div", { style: styles.itemContent },
-                            React.createElement("div", { style: styles.itemTitle }, q)),
-                        React.createElement("div", { style: styles.itemAction },
-                            React.createElement(ArrowUpIcon, null))))))),
-                showTrending && (React.createElement("div", { style: styles.section },
-                    React.createElement("div", { style: styles.sectionHeader },
-                        React.createElement("span", { style: styles.sectionTitle }, "Trending")),
-                    trendingQueries.map((q, idx) => {
-                        const globalIdx = recentQueries.length + idx;
-                        return (React.createElement("div", { key: `trending-${q}`, "data-index": globalIdx, style: mergeStyles(styles.item, activeIndex === globalIdx ? styles.itemActive : undefined), onClick: () => {
+            React.createElement("div", { style: styles.content },
+                React.createElement(React.Fragment, null,
+                    showRecent && (React.createElement("div", { style: styles.section },
+                        React.createElement("div", { style: styles.sectionHeader },
+                            React.createElement("span", { style: styles.sectionTitle }, "Recent"),
+                            React.createElement("button", { style: styles.clearBtn, onClick: onRecentClearAll }, "Clear")),
+                        recentQueries.map((q, idx) => (React.createElement("div", { key: `recent-${q}`, "data-index": idx, style: mergeStyles(styles.item, activeIndex === idx ? styles.itemActive : undefined), onClick: () => {
                                 onRecentClick?.(q);
                                 setInputValue(q);
-                            }, onMouseEnter: () => setActiveIndex(globalIdx) },
+                            }, onMouseEnter: () => setActiveIndex(idx) },
                             React.createElement("div", { style: styles.itemIcon },
-                                React.createElement(TrendingIcon, null)),
+                                React.createElement(ClockIcon, null)),
                             React.createElement("div", { style: styles.itemContent },
                                 React.createElement("div", { style: styles.itemTitle }, q)),
                             React.createElement("div", { style: styles.itemAction },
-                                React.createElement(ChevronIcon, null))));
-                    }))),
-                inputValue && processedSuggestions.length > 0 && (React.createElement("div", { style: styles.section },
-                    React.createElement("div", { style: styles.sectionHeader },
-                        React.createElement("span", { style: styles.sectionTitle }, "Suggestions")),
-                    processedSuggestions.map((s, idx) => {
-                        const globalIdx = recentQueries.length + trendingQueries.length + idx;
-                        return (React.createElement("div", { key: s.id || idx, "data-index": globalIdx, style: mergeStyles(styles.item, activeIndex === globalIdx ? styles.itemActive : undefined), onClick: () => onSuggestionSelect?.(s._raw, idx), onMouseEnter: () => setActiveIndex(globalIdx) },
-                            React.createElement("div", { style: styles.itemIcon },
-                                React.createElement(SearchIcon, null)),
-                            React.createElement("div", { style: styles.itemContent },
-                                React.createElement("div", { style: styles.itemTitle }, highlightTextReact(s.query, inputValue, { tag: 'strong' })),
-                                s.count && (React.createElement("div", { style: styles.itemSubtitle },
-                                    s.count,
-                                    " results"))),
-                            React.createElement("div", { style: styles.itemAction },
-                                React.createElement(ChevronIcon, null))));
-                    }))),
-                showProducts && (React.createElement("div", { style: styles.section },
-                    React.createElement("div", { style: styles.sectionHeader },
-                        React.createElement("span", { style: styles.sectionTitle }, "Products")),
-                    React.createElement("div", { style: styles.productsScroll }, processedProducts.slice(0, 8).map((p, idx) => (React.createElement("div", { key: p.id, style: styles.productCard, onClick: () => onProductClick?.(p._raw, idx) },
-                        p.image ? (React.createElement("img", { src: p.image, alt: p.title, style: styles.productImage, loading: "lazy" })) : (React.createElement("div", { style: styles.productImage })),
-                        React.createElement("div", { style: styles.productTitle }, p.title),
-                        p.price !== undefined && (React.createElement("div", { style: styles.productPrice }, formatPrice(p.price, {
-                            currency: productDisplay.currency || p.currency || '$'
-                        }))))))))),
-                inputValue && processedSuggestions.length === 0 && !loading && (renderEmpty ? renderEmpty(inputValue) : (React.createElement("div", { style: styles.empty },
-                    React.createElement("div", { style: styles.emptyIcon },
-                        React.createElement(SearchIcon, null)),
-                    React.createElement("p", null,
-                        "No results for \"",
-                        inputValue,
-                        "\""))))))),
+                                React.createElement(ArrowUpIcon, null))))))),
+                    showTrending && (React.createElement("div", { style: styles.section },
+                        React.createElement("div", { style: styles.sectionHeader },
+                            React.createElement("span", { style: styles.sectionTitle }, "Trending")),
+                        trendingQueries.map((q, idx) => {
+                            const globalIdx = recentQueries.length + idx;
+                            return (React.createElement("div", { key: `trending-${q}`, "data-index": globalIdx, style: mergeStyles(styles.item, activeIndex === globalIdx ? styles.itemActive : undefined), onClick: () => {
+                                    onRecentClick?.(q);
+                                    setInputValue(q);
+                                }, onMouseEnter: () => setActiveIndex(globalIdx) },
+                                React.createElement("div", { style: styles.itemIcon },
+                                    React.createElement(TrendingIcon, null)),
+                                React.createElement("div", { style: styles.itemContent },
+                                    React.createElement("div", { style: styles.itemTitle }, q)),
+                                React.createElement("div", { style: styles.itemAction },
+                                    React.createElement(ChevronIcon, null))));
+                        }))),
+                    inputValue && processedSuggestions.length > 0 && (React.createElement("div", { style: styles.section },
+                        React.createElement("div", { style: styles.sectionHeader },
+                            React.createElement("span", { style: styles.sectionTitle }, "Suggestions")),
+                        processedSuggestions.map((s, idx) => {
+                            const globalIdx = recentQueries.length + trendingQueries.length + idx;
+                            return (React.createElement("div", { key: s.id || idx, "data-index": globalIdx, style: mergeStyles(styles.item, activeIndex === globalIdx ? styles.itemActive : undefined), onClick: () => onSuggestionSelect?.(s._raw, idx), onMouseEnter: () => setActiveIndex(globalIdx) },
+                                React.createElement("div", { style: styles.itemIcon },
+                                    React.createElement(SearchIcon, null)),
+                                React.createElement("div", { style: styles.itemContent },
+                                    React.createElement("div", { style: styles.itemTitle }, highlightTextReact(s.query, inputValue, { tag: 'strong' })),
+                                    s.count && (React.createElement("div", { style: styles.itemSubtitle },
+                                        s.count,
+                                        " results"))),
+                                React.createElement("div", { style: styles.itemAction },
+                                    React.createElement(ChevronIcon, null))));
+                        }))),
+                    showProducts && (React.createElement("div", { style: styles.section },
+                        React.createElement("div", { style: styles.sectionHeader },
+                            React.createElement("span", { style: styles.sectionTitle }, "Products")),
+                        React.createElement("div", { style: styles.productsScroll }, processedProducts.slice(0, 8).map((p, idx) => (React.createElement("div", { key: p.id, style: styles.productCard, onClick: () => onProductClick?.(p._raw, idx) },
+                            p.image ? (React.createElement("img", { src: p.image, alt: p.title, style: styles.productImage, loading: "lazy" })) : (React.createElement("div", { style: styles.productImage })),
+                            React.createElement("div", { style: styles.productTitle }, p.title),
+                            p.price !== undefined && (React.createElement("div", { style: styles.productPrice }, formatPrice(p.price, {
+                                currency: productDisplay.currency || p.currency || '$'
+                            }))))))))),
+                    inputValue && processedSuggestions.length === 0 && !loading && (renderEmpty ? renderEmpty(inputValue) : (React.createElement("div", { style: styles.empty },
+                        React.createElement("div", { style: styles.emptyIcon },
+                            React.createElement(SearchIcon, null)),
+                        React.createElement("p", null,
+                            "No results for \"",
+                            inputValue,
+                            "\"")))))),
             footer !== undefined ? footer : (showFooterButton && inputValue && (React.createElement("div", { style: styles.footer },
                 React.createElement("button", { style: styles.footerBtn, onClick: () => onSearchSubmit?.(inputValue) },
                     footerButtonText,

package/dist/components/suggestions/PinterestDropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PinterestDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/PinterestDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAuU9D,MAAM,WAAW,sBAAuB,SAAQ,iBAAiB;IAC/D,uCAAuC;IACvC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,0BAA0B;IAC1B,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,yBAAyB;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kCAAkC;IAClC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB;IACxB,eAAe,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAC;CACvD;AAED,eAAO,MAAM,iBAAiB,~~4FAsX7B~~,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"PinterestDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/PinterestDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAuU9D,MAAM,WAAW,sBAAuB,SAAQ,iBAAiB;IAC/D,uCAAuC;IACvC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,0BAA0B;IAC1B,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;IACvC,yBAAyB;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kCAAkC;IAClC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB;IACxB,eAAe,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAC;CACvD;AAED,eAAO,MAAM,iBAAiB,4FA4W7B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/suggestions/PinterestDropdown.js CHANGED Viewed

@@ -302,7 +302,7 @@ const ImageIcon = () => (React.createElement("svg", { viewBox: "0 0 24 24", fill
     React.createElement("polyline", { points: "21 15 16 10 5 21" })));
 export const PinterestDropdown = forwardRef(function PinterestDropdown(props, ref) {
     const { query, isOpen = true, loading = false, suggestions = [], products = [], categories = [], suggestionFields = { query: 'query' }, productFields = { id: 'id', title: 'title' }, categoryFields = { id: 'id', label: 'label' }, productDisplay = {}, theme = {}, showSaveButton = true, activeCategory: initialActiveCategory, activeTab, // From BaseDropdownProps
-    showPriceOverlay = true, gridColumns = 4, width = '800px', maxHeight = '600px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onProductClick, onCategoryClick, onTabChange, onSaveProduct, onViewAll, onClose, header, footer, showLoadingState = false, renderLoading, renderEmpty, } = props;
+    showPriceOverlay = true, gridColumns = 4, width = '800px', maxHeight = '600px', zIndex = 1000, className, style, classNames = {}, onSuggestionSelect, onProductClick, onCategoryClick, onTabChange, onSaveProduct, onViewAll, onClose, header, footer, renderEmpty, } = props;
     // Inject global responsive styles
     useInjectResponsiveStyles();
     // Responsive state
@@ -396,47 +396,47 @@ export const PinterestDropdown = forwardRef(function PinterestDropdown(props, re
                         "(",
                         cat.count,
                         ")"))))))))),
-        React.createElement("div", { style: { ...styles.content, maxHeight } }, (loading && showLoadingState) ? (renderLoading ? renderLoading() : (React.createElement("div", { style: styles.loading },
-            React.createElement("div", { style: styles.spinner })))) : (React.createElement(React.Fragment, null,
-            processedSuggestions.length > 0 && (React.createElement("div", { style: styles.suggestionsRow }, processedSuggestions.slice(0, 8).map((s, idx) => (React.createElement("button", { key: s.id || idx, "data-index": idx, style: mergeStyles(styles.suggestionPill, activeIndex === idx ? styles.suggestionPillActive : undefined, hoveredSuggestion === idx && activeIndex !== idx ? styles.suggestionPillHover : undefined), onClick: () => onSuggestionSelect?.(s._raw, idx), onMouseEnter: () => {
-                    setHoveredSuggestion(idx);
-                    setActiveIndex(idx);
-                }, onMouseLeave: () => setHoveredSuggestion(-1) },
-                React.createElement("span", { style: styles.suggestionIcon }, query ? highlightTextReact(s.query, query, { tag: 'strong' }) : s.query)))))),
-            displayProducts.length > 0 && (React.createElement(React.Fragment, null,
-                React.createElement("div", { style: styles.sectionTitle },
-                    React.createElement(TrendingIcon, null),
-                    "Ideas for you"),
-                React.createElement("div", { style: {
-                        ...styles.productsGrid,
-                        gridTemplateColumns: `repeat(${gridColumns}, 1fr)`,
-                    } }, displayProducts.slice(0, 12).map((product, idx) => (React.createElement("div", { key: product.id, style: mergeStyles(styles.productCard, hoveredProduct === product.id ? styles.productCardHover : undefined), onClick: () => onProductClick?.(product._raw, idx), onMouseEnter: () => setHoveredProduct(product.id), onMouseLeave: () => setHoveredProduct(null) },
-                    React.createElement("div", { style: styles.productImageContainer },
-                        product.image ? (React.createElement("img", { src: product.image, alt: product.title, style: styles.productImage, loading: "lazy" })) : (React.createElement("div", { style: styles.productImagePlaceholder },
-                            React.createElement(ImageIcon, null))),
-                        showSaveButton && (React.createElement("button", { style: mergeStyles(styles.productSaveBtn, hoveredProduct === product.id ? styles.productSaveBtnVisible : undefined), onClick: (e) => {
-                                e.stopPropagation();
-                                onSaveProduct?.(product._raw);
-                            }, "aria-label": "Save" },
-                            React.createElement(HeartIcon, null))),
-                        showPriceOverlay && product.price !== undefined && (React.createElement("div", { style: mergeStyles(styles.productOverlay, hoveredProduct === product.id ? styles.productOverlayVisible : undefined) },
-                            React.createElement("div", { style: styles.productTitleOverlay }, product.title),
-                            React.createElement("div", { style: styles.productPriceOverlay }, formatPrice(product.price, {
+        React.createElement("div", { style: { ...styles.content, maxHeight } },
+            React.createElement(React.Fragment, null,
+                processedSuggestions.length > 0 && (React.createElement("div", { style: styles.suggestionsRow }, processedSuggestions.slice(0, 8).map((s, idx) => (React.createElement("button", { key: s.id || idx, "data-index": idx, style: mergeStyles(styles.suggestionPill, activeIndex === idx ? styles.suggestionPillActive : undefined, hoveredSuggestion === idx && activeIndex !== idx ? styles.suggestionPillHover : undefined), onClick: () => onSuggestionSelect?.(s._raw, idx), onMouseEnter: () => {
+                        setHoveredSuggestion(idx);
+                        setActiveIndex(idx);
+                    }, onMouseLeave: () => setHoveredSuggestion(-1) },
+                    React.createElement("span", { style: styles.suggestionIcon }, query ? highlightTextReact(s.query, query, { tag: 'strong' }) : s.query)))))),
+                displayProducts.length > 0 && (React.createElement(React.Fragment, null,
+                    React.createElement("div", { style: styles.sectionTitle },
+                        React.createElement(TrendingIcon, null),
+                        "Ideas for you"),
+                    React.createElement("div", { style: {
+                            ...styles.productsGrid,
+                            gridTemplateColumns: `repeat(${gridColumns}, 1fr)`,
+                        } }, displayProducts.slice(0, 12).map((product, idx) => (React.createElement("div", { key: product.id, style: mergeStyles(styles.productCard, hoveredProduct === product.id ? styles.productCardHover : undefined), onClick: () => onProductClick?.(product._raw, idx), onMouseEnter: () => setHoveredProduct(product.id), onMouseLeave: () => setHoveredProduct(null) },
+                        React.createElement("div", { style: styles.productImageContainer },
+                            product.image ? (React.createElement("img", { src: product.image, alt: product.title, style: styles.productImage, loading: "lazy" })) : (React.createElement("div", { style: styles.productImagePlaceholder },
+                                React.createElement(ImageIcon, null))),
+                            showSaveButton && (React.createElement("button", { style: mergeStyles(styles.productSaveBtn, hoveredProduct === product.id ? styles.productSaveBtnVisible : undefined), onClick: (e) => {
+                                    e.stopPropagation();
+                                    onSaveProduct?.(product._raw);
+                                }, "aria-label": "Save" },
+                                React.createElement(HeartIcon, null))),
+                            showPriceOverlay && product.price !== undefined && (React.createElement("div", { style: mergeStyles(styles.productOverlay, hoveredProduct === product.id ? styles.productOverlayVisible : undefined) },
+                                React.createElement("div", { style: styles.productTitleOverlay }, product.title),
+                                React.createElement("div", { style: styles.productPriceOverlay }, formatPrice(product.price, {
+                                    currency: productDisplay.currency || product.currency || '$'
+                                }))))),
+                        !showPriceOverlay && (React.createElement("div", { style: styles.productInfo },
+                            React.createElement("div", { style: styles.productTitle }, product.title),
+                            product.price !== undefined && (React.createElement("div", { style: styles.productPrice }, formatPrice(product.price, {
                                 currency: productDisplay.currency || product.currency || '$'
-                            }))))),
-                    !showPriceOverlay && (React.createElement("div", { style: styles.productInfo },
-                        React.createElement("div", { style: styles.productTitle }, product.title),
-                        product.price !== undefined && (React.createElement("div", { style: styles.productPrice }, formatPrice(product.price, {
-                            currency: productDisplay.currency || product.currency || '$'
-                        }))))))))))),
-            !loading && displayProducts.length === 0 && processedSuggestions.length === 0 && (renderEmpty ? renderEmpty(query) : (React.createElement("div", { style: styles.empty },
-                React.createElement("div", { style: styles.emptyIcon },
-                    React.createElement(SearchIcon, null)),
-                React.createElement("p", null,
-                    "No ideas found for \"",
-                    query,
-                    "\""),
-                React.createElement("p", { style: { fontSize: '14px', marginTop: '8px' } }, "Try searching for something else"))))))),
+                            }))))))))))),
+                !loading && displayProducts.length === 0 && processedSuggestions.length === 0 && (renderEmpty ? renderEmpty(query) : (React.createElement("div", { style: styles.empty },
+                    React.createElement("div", { style: styles.emptyIcon },
+                        React.createElement(SearchIcon, null)),
+                    React.createElement("p", null,
+                        "No ideas found for \"",
+                        query,
+                        "\""),
+                    React.createElement("p", { style: { fontSize: '14px', marginTop: '8px' } }, "Try searching for something else")))))),
         footer !== undefined ? footer : (displayProducts.length > 0 && (React.createElement("div", { style: styles.footer },
             React.createElement("span", { style: { color: 'var(--seekora-text-secondary, #767676)', fontSize: '14px' } },
                 displayProducts.length,

package/dist/components/suggestions/ShopifyDropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ShopifyDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/ShopifyDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAuU9D,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC7D,wBAAwB;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kCAAkC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,8BAA8B;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,uBAAuB;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,eAAe,~~0FA2W3B~~,CAAC;AAEF,eAAe,eAAe,CAAC"}
1	+ {"version":3,"file":"ShopifyDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/suggestions/ShopifyDropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAuU9D,MAAM,WAAW,oBAAqB,SAAQ,iBAAiB;IAC7D,wBAAwB;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kCAAkC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,8BAA8B;IAC9B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,uBAAuB;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,eAAe,0FAiW3B,CAAC;AAEF,eAAe,eAAe,CAAC"}