@envive-ai/react-toolkit 0.2.13-arthur-1 → 0.2.14

package/dist/components/SearchResultsFilterModal/index.js

@@ -1,47 +1,5 @@
 'use client';
 
+import { SearchResultsFilterModal } from "./SearchResultsFilterModal.js";
 
-import "../../Typography-xehJH05l.js";
-import "../../jsx-runtime-Dg2m6dxZ-CU_SzTu4.js";
-import "../../Accordion-8zFBEEaN.js";
-import "../../AnimatedChevron-DO_jcnJg.js";
-import "../../ButtonBase-Cjo-fBg2.js";
-import "../../ButtonBase-D2eXuapk.js";
-import "../../ModalSheet-C5f5abw1.js";
-import "../../RadioButton-DOc8g47U.js";
-import "../../RadioButtonGroup-YQIxmR7j.js";
-import { n as SearchFilter, o as SearchFilterHeader } from "../../SearchFilter-DvJx0b0W.js";
-import "../../ToggleButton-D8--AKKK.js";
-import "../../colorsConfig-CFI1KN8R.js";
-import { t as searchFilterSidebarVariantClasses } from "../../searchFilterSidebarVariants-gkgkflXx.js";
-import "../../SearchResultsFilterSidebar-DLzQoFGD.js";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/SearchResultsFilterModal/SearchResultsFilterModal.tsx
-const SearchResultsFilterModal = ({ productCount, isOpen, setIsOpen, searchFilters, searchFilterSidebarVariant, onSelectFilterItem, onClearAllFilters, filterButtonText }) => {
-	const { applyFiltersUnchangedClasses, applyFiltersChangedClasses, searchFilterHeaderClasses, radioButtonFillColor, radioButtonHoverColor, radioButtonUncheckedBorderColor, filterCloseIconVariant } = searchFilterSidebarVariantClasses[searchFilterSidebarVariant];
-	return /* @__PURE__ */ jsx(SearchFilter, {
-		isOpen,
-		setIsOpen,
-		filters: searchFilters,
-		productCount,
-		selectFilterItem: onSelectFilterItem,
-		clearAllFilters: onClearAllFilters,
-		applyFiltersUnchangedClasses,
-		applyFiltersChangedClasses,
-		filterButtonText,
-		radioButtonFillColor,
-		radioButtonHoverColor,
-		radioButtonUncheckedBorderColor,
-		filterCloseIconVariant,
-		headerContent: /* @__PURE__ */ jsx(SearchFilterHeader, {
-			closeModal: () => setIsOpen(false),
-			productCount,
-			headerClassName: searchFilterHeaderClasses,
-			filterCloseIconVariant
-		})
-	});
-};
-
-//#endregion
 export { SearchResultsFilterModal };

package/dist/components/SearchResultsFilterSidebar/SearchResultsFilter.cjs

@@ -0,0 +1,51 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_ButtonBase = require('../ButtonBase/ButtonBase.cjs');
+require('../ButtonBase/index.cjs');
+const require_SearchFilterHeader = require('../SearchFilter/SearchFilterHeader.cjs');
+const require_SearchFilter = require('../SearchFilter/SearchFilter.cjs');
+require('../SearchFilter/index.cjs');
+const require_searchFilterSidebarVariants = require('./searchFilterSidebarVariants.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let __envive_ai_react_icons_SettingsVariant = require("@envive-ai/react-icons/SettingsVariant");
+__envive_ai_react_icons_SettingsVariant = require_rolldown_runtime.__toESM(__envive_ai_react_icons_SettingsVariant);
+
+//#region src/components/SearchResultsFilterSidebar/SearchResultsFilter.tsx
+const SearchResultsFilter = ({ productCount, isOpen, setIsOpen, searchFilters, searchFilterSidebarVariant, onSelectFilterItem, onClearAllFilters, filterButtonText }) => {
+	const { applyFiltersUnchangedClasses, applyFiltersChangedClasses, searchFilterHeaderClasses, radioButtonFillColor, radioButtonHoverColor, radioButtonUncheckedBorderColor, filterCloseIconVariant } = require_searchFilterSidebarVariants.searchFilterSidebarVariantClasses[searchFilterSidebarVariant];
+	const openFilter = (0, react.useCallback)(() => {
+		setIsOpen(true);
+	}, [setIsOpen]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SearchFilter.SearchFilter, {
+		isOpen,
+		setIsOpen,
+		filters: searchFilters,
+		productCount,
+		selectFilterItem: onSelectFilterItem,
+		clearAllFilters: onClearAllFilters,
+		applyFiltersUnchangedClasses,
+		applyFiltersChangedClasses,
+		filterButtonText,
+		radioButtonFillColor,
+		radioButtonHoverColor,
+		radioButtonUncheckedBorderColor,
+		filterCloseIconVariant,
+		headerContent: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SearchFilterHeader.SearchFilterHeader, {
+			closeModal: () => setIsOpen(false),
+			productCount,
+			headerClassName: searchFilterHeaderClasses,
+			filterCloseIconVariant
+		})
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ButtonBase.ButtonBase, {
+		onClick: openFilter,
+		icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__envive_ai_react_icons_SettingsVariant.default, {}),
+		iconClass: "spiffy-tw-w-[28px] spiffy-tw-h-[28px] spiffy-tw-object-center",
+		text: filterButtonText,
+		textClass: "spiffy-tw-uppercase spiffy-tw-text-[--spiffy-colors-text-primary] spiffy-tw-hidden md:spiffy-tw-block",
+		buttonClass: "spiffy-tw-flex-row spiffy-tw-pl-[16px] sm:spiffy-tw-pl-0 sm:spiffy-tw-px-4 sm:spiffy-tw-gap-[8px]",
+		disablePadding: true
+	})] });
+};
+
+//#endregion
+exports.SearchResultsFilter = SearchResultsFilter;

package/dist/components/SearchResultsFilterSidebar/SearchResultsFilter.d.cts

@@ -0,0 +1,27 @@
+import { SearchFilterSidebarVariant } from "./types.cjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { SearchFilterDatum, SelectFilterItem } from "@envive-ai/react-hooks/types";
+
+//#region src/components/SearchResultsFilterSidebar/SearchResultsFilter.d.ts
+type SearchResultsFilterProps = {
+  productCount: number;
+  isOpen: boolean;
+  setIsOpen: (isOpen: boolean) => void;
+  searchFilters: SearchFilterDatum[];
+  searchFilterSidebarVariant: SearchFilterSidebarVariant;
+  onSelectFilterItem: SelectFilterItem;
+  onClearAllFilters: () => void;
+  filterButtonText: string;
+};
+declare const SearchResultsFilter: ({
+  productCount,
+  isOpen,
+  setIsOpen,
+  searchFilters,
+  searchFilterSidebarVariant,
+  onSelectFilterItem,
+  onClearAllFilters,
+  filterButtonText
+}: SearchResultsFilterProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+export { SearchResultsFilter, SearchResultsFilterProps };

package/dist/components/SearchResultsFilterSidebar/SearchResultsFilter.d.ts

@@ -0,0 +1,27 @@
+import { SearchFilterSidebarVariant } from "./types.js";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
+import { SearchFilterDatum, SelectFilterItem } from "@envive-ai/react-hooks/types";
+
+//#region src/components/SearchResultsFilterSidebar/SearchResultsFilter.d.ts
+type SearchResultsFilterProps = {
+  productCount: number;
+  isOpen: boolean;
+  setIsOpen: (isOpen: boolean) => void;
+  searchFilters: SearchFilterDatum[];
+  searchFilterSidebarVariant: SearchFilterSidebarVariant;
+  onSelectFilterItem: SelectFilterItem;
+  onClearAllFilters: () => void;
+  filterButtonText: string;
+};
+declare const SearchResultsFilter: ({
+  productCount,
+  isOpen,
+  setIsOpen,
+  searchFilters,
+  searchFilterSidebarVariant,
+  onSelectFilterItem,
+  onClearAllFilters,
+  filterButtonText
+}: SearchResultsFilterProps) => react_jsx_runtime12.JSX.Element;
+//#endregion
+export { SearchResultsFilter, SearchResultsFilterProps };

package/dist/{SearchResultsFilterSidebar-DLzQoFGD.js → components/SearchResultsFilterSidebar/SearchResultsFilter.js}

@@ -1,76 +1,13 @@
-import { t as ButtonBase } from "./ButtonBase-Cjo-fBg2.js";
-import { n as SearchFilter, o as SearchFilterHeader } from "./SearchFilter-DvJx0b0W.js";
-import { t as searchFilterSidebarVariantClasses } from "./searchFilterSidebarVariants-gkgkflXx.js";
+import { ButtonBase } from "../ButtonBase/ButtonBase.js";
+import "../ButtonBase/index.js";
+import { SearchFilterHeader } from "../SearchFilter/SearchFilterHeader.js";
+import { SearchFilter } from "../SearchFilter/SearchFilter.js";
+import "../SearchFilter/index.js";
+import { searchFilterSidebarVariantClasses } from "./searchFilterSidebarVariants.js";
 import { useCallback } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import SettingsVariant from "@envive-ai/react-icons/SettingsVariant";
 
-//#region ../icons/src/SettingsVariant.tsx
-const SvgSettingsVariant = (props) => /* @__PURE__ */ jsxs("svg", {
-	width: 28,
-	height: 28,
-	viewBox: "0 0 28 28",
-	fill: "none",
-	xmlns: "http://www.w3.org/2000/svg",
-	...props,
-	children: [
-		/* @__PURE__ */ jsx("circle", {
-			cx: 3.5,
-			cy: 3.5,
-			r: 3.03346,
-			transform: "matrix(-1 0 0 1 22.4004 0)",
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("path", {
-			d: "M14 3.5L0 3.5",
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("path", {
-			d: "M28 3.5L23.5 3.5",
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("circle", {
-			cx: 9.09961,
-			cy: 13.5,
-			r: 3.03346,
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("path", {
-			d: "M14 13.5L28 13.5",
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("path", {
-			d: "M0 13.5L4.5 13.5",
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("circle", {
-			cx: 3.5,
-			cy: 3.5,
-			r: 3.03346,
-			transform: "matrix(-1 0 0 1 22.4004 20)",
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("path", {
-			d: "M14 23.5H0",
-			stroke: "#767676",
-			strokeWidth: .933083
-		}),
-		/* @__PURE__ */ jsx("path", {
-			d: "M28 23.5L23.5 23.5",
-			stroke: "#767676",
-			strokeWidth: .933083
-		})
-	]
-});
-var SettingsVariant_default = SvgSettingsVariant;
-
-//#endregion
 //#region src/components/SearchResultsFilterSidebar/SearchResultsFilter.tsx
 const SearchResultsFilter = ({ productCount, isOpen, setIsOpen, searchFilters, searchFilterSidebarVariant, onSelectFilterItem, onClearAllFilters, filterButtonText }) => {
 	const { applyFiltersUnchangedClasses, applyFiltersChangedClasses, searchFilterHeaderClasses, radioButtonFillColor, radioButtonHoverColor, radioButtonUncheckedBorderColor, filterCloseIconVariant } = searchFilterSidebarVariantClasses[searchFilterSidebarVariant];
@@ -99,7 +36,7 @@ const SearchResultsFilter = ({ productCount, isOpen, setIsOpen, searchFilters, s
 		})
 	}), /* @__PURE__ */ jsx(ButtonBase, {
 		onClick: openFilter,
-		icon: SettingsVariant_default,
+		icon: /* @__PURE__ */ jsx(SettingsVariant, {}),
 		iconClass: "spiffy-tw-w-[28px] spiffy-tw-h-[28px] spiffy-tw-object-center",
 		text: filterButtonText,
 		textClass: "spiffy-tw-uppercase spiffy-tw-text-[--spiffy-colors-text-primary] spiffy-tw-hidden md:spiffy-tw-block",
@@ -109,4 +46,4 @@ const SearchResultsFilter = ({ productCount, isOpen, setIsOpen, searchFilters, s
 };
 
 //#endregion
-export { SearchResultsFilter as t };
+export { SearchResultsFilter };

package/dist/components/SearchResultsFilterSidebar/index.cjs

@@ -1,17 +1,5 @@
-require('../../Typography-Ds4gfOJz.cjs');
-require('../../jsx-runtime-Dg2m6dxZ-B-pkyyHT.cjs');
-require('../../Accordion-DPUaEXiE.cjs');
-require('../../AnimatedChevron-CPW5KPLr.cjs');
-require('../../ButtonBase-C44g6llb.cjs');
-require('../../ButtonBase-Cb6Iec6f.cjs');
-require('../../ModalSheet-JZerJZ1T.cjs');
-require('../../RadioButton-DpF1wymL.cjs');
-require('../../RadioButtonGroup-ByzTXNAb.cjs');
-require('../../SearchFilter-BRtCSuAn.cjs');
-require('../../ToggleButton-Dxk3U1hR.cjs');
-require('../../colorsConfig-Dp7w5LPb.cjs');
-const require_searchFilterSidebarVariants = require('../../searchFilterSidebarVariants-CjyRGKK_.cjs');
-const require_SearchResultsFilterSidebar = require('../../SearchResultsFilterSidebar-BRFONIEq.cjs');
+const require_searchFilterSidebarVariants = require('./searchFilterSidebarVariants.cjs');
+const require_SearchResultsFilter = require('./SearchResultsFilter.cjs');
 
-exports.SearchResultsFilter = require_SearchResultsFilterSidebar.SearchResultsFilter;
+exports.SearchResultsFilter = require_SearchResultsFilter.SearchResultsFilter;
 exports.searchFilterSidebarVariantClasses = require_searchFilterSidebarVariants.searchFilterSidebarVariantClasses;

package/dist/components/SearchResultsFilterSidebar/index.d.cts

@@ -0,0 +1,4 @@
+import { CloseIconVariant, SearchFilterSidebarVariant } from "./types.cjs";
+import { searchFilterSidebarVariantClasses } from "./searchFilterSidebarVariants.cjs";
+import { SearchResultsFilter, SearchResultsFilterProps } from "./SearchResultsFilter.cjs";
+export { CloseIconVariant, SearchFilterSidebarVariant, SearchResultsFilter, SearchResultsFilterProps, searchFilterSidebarVariantClasses };

package/dist/components/SearchResultsFilterSidebar/index.d.ts

@@ -0,0 +1,4 @@
+import { CloseIconVariant, SearchFilterSidebarVariant } from "./types.js";
+import { searchFilterSidebarVariantClasses } from "./searchFilterSidebarVariants.js";
+import { SearchResultsFilter, SearchResultsFilterProps } from "./SearchResultsFilter.js";
+export { CloseIconVariant, SearchFilterSidebarVariant, SearchResultsFilter, SearchResultsFilterProps, searchFilterSidebarVariantClasses };

package/dist/components/SearchResultsFilterSidebar/index.js

@@ -1,16 +1,4 @@
-import "../../Typography-xehJH05l.js";
-import "../../jsx-runtime-Dg2m6dxZ-CU_SzTu4.js";
-import "../../Accordion-8zFBEEaN.js";
-import "../../AnimatedChevron-DO_jcnJg.js";
-import "../../ButtonBase-Cjo-fBg2.js";
-import "../../ButtonBase-D2eXuapk.js";
-import "../../ModalSheet-C5f5abw1.js";
-import "../../RadioButton-DOc8g47U.js";
-import "../../RadioButtonGroup-YQIxmR7j.js";
-import "../../SearchFilter-DvJx0b0W.js";
-import "../../ToggleButton-D8--AKKK.js";
-import "../../colorsConfig-CFI1KN8R.js";
-import { t as searchFilterSidebarVariantClasses } from "../../searchFilterSidebarVariants-gkgkflXx.js";
-import { t as SearchResultsFilter } from "../../SearchResultsFilterSidebar-DLzQoFGD.js";
+import { searchFilterSidebarVariantClasses } from "./searchFilterSidebarVariants.js";
+import { SearchResultsFilter } from "./SearchResultsFilter.js";
 
 export { SearchResultsFilter, searchFilterSidebarVariantClasses };

package/dist/{searchFilterSidebarVariants-CjyRGKK_.cjs → components/SearchResultsFilterSidebar/searchFilterSidebarVariants.cjs}

@@ -1,4 +1,4 @@
-const require_colorsConfig = require('./colorsConfig-Dp7w5LPb.cjs');
+const require_colorsConfig = require('../../models/colorsConfig.cjs');
 
 //#region src/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.ts
 const searchFilterSidebarVariantClasses = {
@@ -31,9 +31,4 @@ const searchFilterSidebarVariantClasses = {
 };
 
 //#endregion
-Object.defineProperty(exports, 'searchFilterSidebarVariantClasses', {
-  enumerable: true,
-  get: function () {
-    return searchFilterSidebarVariantClasses;
-  }
-});
+exports.searchFilterSidebarVariantClasses = searchFilterSidebarVariantClasses;

package/dist/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.d.cts

@@ -0,0 +1,19 @@
+import { CloseIconVariant, SearchFilterSidebarVariant } from "./types.cjs";
+
+//#region src/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.d.ts
+interface SearchFilterSidebarVariantClasses {
+  searchFilterHeaderClasses: string;
+  radioButtonFillColor: string;
+  radioButtonHoverColor: string;
+  radioButtonUncheckedBorderColor: string;
+  filterDefaultClasses: string;
+  filterActiveClasses: string;
+  filterHoverClasses: string;
+  appliedFilterBackgroundClasses: string;
+  applyFiltersUnchangedClasses: string;
+  applyFiltersChangedClasses: string;
+  filterCloseIconVariant: CloseIconVariant;
+}
+declare const searchFilterSidebarVariantClasses: Record<SearchFilterSidebarVariant, SearchFilterSidebarVariantClasses>;
+//#endregion
+export { searchFilterSidebarVariantClasses };

package/dist/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.d.ts

@@ -0,0 +1,19 @@
+import { CloseIconVariant, SearchFilterSidebarVariant } from "./types.js";
+
+//#region src/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.d.ts
+interface SearchFilterSidebarVariantClasses {
+  searchFilterHeaderClasses: string;
+  radioButtonFillColor: string;
+  radioButtonHoverColor: string;
+  radioButtonUncheckedBorderColor: string;
+  filterDefaultClasses: string;
+  filterActiveClasses: string;
+  filterHoverClasses: string;
+  appliedFilterBackgroundClasses: string;
+  applyFiltersUnchangedClasses: string;
+  applyFiltersChangedClasses: string;
+  filterCloseIconVariant: CloseIconVariant;
+}
+declare const searchFilterSidebarVariantClasses: Record<SearchFilterSidebarVariant, SearchFilterSidebarVariantClasses>;
+//#endregion
+export { searchFilterSidebarVariantClasses };

package/dist/{searchFilterSidebarVariants-gkgkflXx.js → components/SearchResultsFilterSidebar/searchFilterSidebarVariants.js}

@@ -1,4 +1,4 @@
-import { n as colorVar, t as ColorNames } from "./colorsConfig-CFI1KN8R.js";
+import { ColorNames, colorVar } from "../../models/colorsConfig.js";
 
 //#region src/components/SearchResultsFilterSidebar/searchFilterSidebarVariants.ts
 const searchFilterSidebarVariantClasses = {
@@ -31,4 +31,4 @@ const searchFilterSidebarVariantClasses = {
 };
 
 //#endregion
-export { searchFilterSidebarVariantClasses as t };
+export { searchFilterSidebarVariantClasses };

package/dist/components/SearchResultsFilterSidebar/types.d.cts

@@ -0,0 +1,5 @@
+//#region src/components/SearchResultsFilterSidebar/types.d.ts
+type SearchFilterSidebarVariant = 'darkButton' | 'lightButton';
+type CloseIconVariant = 'light' | 'tertiary' | 'dark';
+//#endregion
+export { CloseIconVariant, SearchFilterSidebarVariant };

package/dist/components/SearchResultsFilterSidebar/types.d.ts

@@ -0,0 +1,5 @@
+//#region src/components/SearchResultsFilterSidebar/types.d.ts
+type SearchFilterSidebarVariant = 'darkButton' | 'lightButton';
+type CloseIconVariant = 'light' | 'tertiary' | 'dark';
+//#endregion
+export { CloseIconVariant, SearchFilterSidebarVariant };

package/dist/components/SearchResultsStates/NoSearchResultsFound.cjs

@@ -0,0 +1,57 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_Typography = require('../Typography/Typography.cjs');
+require('../Typography/index.cjs');
+const require_RecommendedProducts = require('../RecommendedProducts/RecommendedProducts.cjs');
+require('../RecommendedProducts/index.cjs');
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+let __envive_ai_react_icons_Sparkles = require("@envive-ai/react-icons/Sparkles");
+__envive_ai_react_icons_Sparkles = require_rolldown_runtime.__toESM(__envive_ai_react_icons_Sparkles);
+
+//#region src/components/SearchResultsStates/NoSearchResultsFound.tsx
+const NoSearchResultsFound = ({ containerPaddingClasses, noResultsFoundText, sparkleIconColor = "var(--spiffy-colors-accent-primary)", recommendedProducts, searchText, merchantShortName, productGridVariant }) => {
+	const containerClasses = (0, classnames.default)(containerPaddingClasses, "spiffy-tw-mt-6", { "spiffy-tw-mb-[100vh]": recommendedProducts.length === 0 });
+	let textPrompt;
+	if (recommendedProducts.length > 0) textPrompt = noResultsFoundText ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: noResultsFoundText }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
+		"I’m sorry, I wasn’t able to find an exact match for",
+		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("strong", {
+			className: "spiffy-tw-font-semibold",
+			children: [" ", `"${searchText}".`]
+		}),
+		" Try changing your filters or adjusting your search query. In the meantime, explore some of our top-selling products below."
+	] });
+	else textPrompt = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
+		"I’m sorry, I wasn’t able to find an exact match for",
+		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("strong", {
+			className: "spiffy-tw-font-semibold",
+			children: [" ", `"${searchText}."`]
+		}),
+		" Try changing your filters or adjusting your search query."
+	] });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: containerClasses,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "spiffy-tw-flex spiffy-tw-items-start spiffy-tw-gap-2",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__envive_ai_react_icons_Sparkles.default, {
+				className: "spiffy-tw-h-[24px] spiffy-tw-w-[24px]",
+				style: { color: sparkleIconColor }
+			}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+				variant: "body2",
+				children: textPrompt
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_RecommendedProducts.RecommendedProducts, {
+			retrievedProducts: recommendedProducts,
+			merchantShortName,
+			productCardConfig: {
+				variant: "minimal",
+				hoverVariant: "none",
+				layoutVariant: "square"
+			},
+			productGridVariant
+		})]
+	});
+};
+
+//#endregion
+exports.NoSearchResultsFound = NoSearchResultsFound;

package/dist/components/SearchResultsStates/NoSearchResultsFound.d.cts

@@ -0,0 +1,25 @@
+import { ProductGridVariant } from "../ProductCard/types.cjs";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
+import { SearchResponseProductAttributes } from "@envive-ai/react-hooks/application/models";
+
+//#region src/components/SearchResultsStates/NoSearchResultsFound.d.ts
+interface NoSearchResultsFoundProps {
+  containerPaddingClasses: string;
+  noResultsFoundText?: string;
+  sparkleIconColor?: string;
+  recommendedProducts: SearchResponseProductAttributes['attributes'][];
+  searchText: string;
+  merchantShortName: string;
+  productGridVariant: ProductGridVariant;
+}
+declare const NoSearchResultsFound: ({
+  containerPaddingClasses,
+  noResultsFoundText,
+  sparkleIconColor,
+  recommendedProducts,
+  searchText,
+  merchantShortName,
+  productGridVariant
+}: NoSearchResultsFoundProps) => react_jsx_runtime4.JSX.Element;
+//#endregion
+export { NoSearchResultsFound };

package/dist/components/SearchResultsStates/NoSearchResultsFound.d.ts

@@ -0,0 +1,25 @@
+import { ProductGridVariant } from "../ProductCard/types.js";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
+import { SearchResponseProductAttributes } from "@envive-ai/react-hooks/application/models";
+
+//#region src/components/SearchResultsStates/NoSearchResultsFound.d.ts
+interface NoSearchResultsFoundProps {
+  containerPaddingClasses: string;
+  noResultsFoundText?: string;
+  sparkleIconColor?: string;
+  recommendedProducts: SearchResponseProductAttributes['attributes'][];
+  searchText: string;
+  merchantShortName: string;
+  productGridVariant: ProductGridVariant;
+}
+declare const NoSearchResultsFound: ({
+  containerPaddingClasses,
+  noResultsFoundText,
+  sparkleIconColor,
+  recommendedProducts,
+  searchText,
+  merchantShortName,
+  productGridVariant
+}: NoSearchResultsFoundProps) => react_jsx_runtime6.JSX.Element;
+//#endregion
+export { NoSearchResultsFound };

package/dist/components/SearchResultsStates/NoSearchResultsFound.js

@@ -0,0 +1,54 @@
+import { Typography } from "../Typography/Typography.js";
+import "../Typography/index.js";
+import { RecommendedProducts } from "../RecommendedProducts/RecommendedProducts.js";
+import "../RecommendedProducts/index.js";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Sparkles from "@envive-ai/react-icons/Sparkles";
+
+//#region src/components/SearchResultsStates/NoSearchResultsFound.tsx
+const NoSearchResultsFound = ({ containerPaddingClasses, noResultsFoundText, sparkleIconColor = "var(--spiffy-colors-accent-primary)", recommendedProducts, searchText, merchantShortName, productGridVariant }) => {
+	const containerClasses = classNames(containerPaddingClasses, "spiffy-tw-mt-6", { "spiffy-tw-mb-[100vh]": recommendedProducts.length === 0 });
+	let textPrompt;
+	if (recommendedProducts.length > 0) textPrompt = noResultsFoundText ? /* @__PURE__ */ jsx("span", { children: noResultsFoundText }) : /* @__PURE__ */ jsxs("span", { children: [
+		"I’m sorry, I wasn’t able to find an exact match for",
+		/* @__PURE__ */ jsxs("strong", {
+			className: "spiffy-tw-font-semibold",
+			children: [" ", `"${searchText}".`]
+		}),
+		" Try changing your filters or adjusting your search query. In the meantime, explore some of our top-selling products below."
+	] });
+	else textPrompt = /* @__PURE__ */ jsxs("span", { children: [
+		"I’m sorry, I wasn’t able to find an exact match for",
+		/* @__PURE__ */ jsxs("strong", {
+			className: "spiffy-tw-font-semibold",
+			children: [" ", `"${searchText}."`]
+		}),
+		" Try changing your filters or adjusting your search query."
+	] });
+	return /* @__PURE__ */ jsxs("div", {
+		className: containerClasses,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "spiffy-tw-flex spiffy-tw-items-start spiffy-tw-gap-2",
+			children: [/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Sparkles, {
+				className: "spiffy-tw-h-[24px] spiffy-tw-w-[24px]",
+				style: { color: sparkleIconColor }
+			}) }), /* @__PURE__ */ jsx(Typography, {
+				variant: "body2",
+				children: textPrompt
+			})]
+		}), /* @__PURE__ */ jsx(RecommendedProducts, {
+			retrievedProducts: recommendedProducts,
+			merchantShortName,
+			productCardConfig: {
+				variant: "minimal",
+				hoverVariant: "none",
+				layoutVariant: "square"
+			},
+			productGridVariant
+		})]
+	});
+};
+
+//#endregion
+export { NoSearchResultsFound };

package/dist/components/SearchResultsStates/SearchResultsGrid.cjs

@@ -0,0 +1,53 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_AppliedFiltersScrollbar = require('../FilterScrollbar/AppliedFiltersScrollbar.cjs');
+const require_DynamicFiltersScrollbar = require('../FilterScrollbar/DynamicFiltersScrollbar.cjs');
+const require_ProductGrid = require('../ProductGrid/ProductGrid.cjs');
+require('../ProductGrid/index.cjs');
+const require_searchFilterSidebarVariants = require('../SearchResultsFilterSidebar/searchFilterSidebarVariants.cjs');
+let framer_motion = require("framer-motion");
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/SearchResultsStates/SearchResultsGrid.tsx
+const SearchResultsGrid = ({ productList, productCardConfig, merchantShortName, availableDynamicFilters, searchFilterSidebarVariant, productGridVariant, selectedFilterOptions, containerXPaddingClasses, productGridClasses, onRemoveFilter, onToggleDynamicFilter, onProductClick }) => {
+	const sharedFilterBarClasses = (0, classnames.default)("spiffy-suggestion-bar", "spiffy-tw-no-scrollbar", "spiffy-tw-flex", "spiffy-tw-flex-row", "spiffy-tw-gap-2", "spiffy-tw-mb-[16px]", "spiffy-tw-overflow-x-scroll", containerXPaddingClasses);
+	const filterBarClasses = (0, classnames.default)(sharedFilterBarClasses, "spiffy-tw-mt-[24px]");
+	const appliedFilterBarClasses = (0, classnames.default)(sharedFilterBarClasses, "spiffy-tw-mb-[32px]", "spiffy-tw-mt-[8px]");
+	const { filterDefaultClasses, filterHoverClasses, appliedFilterBackgroundClasses } = require_searchFilterSidebarVariants.searchFilterSidebarVariantClasses[searchFilterSidebarVariant];
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(framer_motion.motion.div, {
+		className: "spiffy-tw-w-full spiffy-tw-justify-center spiffy-tw-overflow-hidden",
+		initial: { opacity: 0 },
+		animate: { opacity: 1 },
+		exit: { opacity: 0 },
+		transition: { duration: .2 },
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AppliedFiltersScrollbar.AppliedFiltersScrollbar, {
+				selectedFilterOptions,
+				filterBarClassNames: appliedFilterBarClasses,
+				filterDefaultClasses,
+				filterHoverClasses,
+				appliedFilterBackgroundClasses,
+				onRemoveFilter
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_DynamicFiltersScrollbar.DynamicFiltersScrollbar, {
+				availableDynamicFilters,
+				filterBarClassNames: filterBarClasses,
+				filterDefaultClasses,
+				filterHoverClasses,
+				onToggleDynamicFilter
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ProductGrid.ProductGrid, {
+				productList,
+				productGridVariant,
+				productGridClasses,
+				productCardConfig,
+				merchantShortName,
+				onProductClick
+			})
+		]
+	});
+};
+
+//#endregion
+exports.SearchResultsGrid = SearchResultsGrid;