@enadhq/enad-react-sdk 1.0.0 → 1.1.0

package/dist/client/storefront/components/country-redirect.d.ts

@@ -0,0 +1,41 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/storefront/components/country-redirect.d.ts
+interface CountryInfo {
+  code: string;
+  name: string;
+  flag?: string;
+}
+interface CountryRedirectProps {
+  /** The country detected from the visitor's location */
+  detectedCountry: CountryInfo;
+  /** The country the store is currently serving */
+  currentCountry: CountryInfo;
+  /** URL to redirect to for the detected country's store */
+  redirectUrl: string;
+  /** Called before navigating to the redirect URL */
+  onAccept?: () => void;
+  /** Called when the visitor dismisses the banner */
+  onDismiss?: () => void;
+  /** localStorage key for persisting dismissal. Set to `false` to disable persistence. */
+  persistKey?: string | false;
+  labels?: {
+    /** e.g. "It looks like you're visiting from {country}." */message?: string; /** e.g. "Go to {country} store" */
+    accept?: string; /** e.g. "Stay on {country} store" */
+    dismiss?: string;
+  };
+  className?: string;
+}
+declare function CountryRedirect({
+  detectedCountry,
+  currentCountry,
+  redirectUrl,
+  onAccept,
+  onDismiss,
+  persistKey,
+  labels,
+  className
+}: CountryRedirectProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { CountryInfo, CountryRedirect, CountryRedirectProps };
+//# sourceMappingURL=country-redirect.d.ts.map

package/dist/client/storefront/components/country-redirect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"country-redirect.d.ts","names":[],"sources":["../../../../src/client/storefront/components/country-redirect.tsx"],"mappings":";;;UAMiB,WAAA;EACf,IAAA;EACA,IAAA;EACA,IAAA;AAAA;AAAA,UAGe,oBAAA;EANW;EAQ1B,eAAA,EAAiB,WAAA;EANjB;EAQA,cAAA,EAAgB,WAAA;EAPZ;EASJ,WAAA;EANe;EAQf,QAAA;;EAEA,SAAA;EARA;EAUA,UAAA;EACA,MAAA;IATgB,2DAWd,OAAA,WAPF;IASE,MAAA,WALF;IAOE,OAAA;EAAA;EAEF,SAAA;AAAA;AAAA,iBAuBc,eAAA,CAAA;EACd,eAAA;EACA,cAAA;EACA,WAAA;EACA,QAAA;EACA,SAAA;EACA,UAAA;EACA,MAAA;EACA;AAAA,GACC,oBAAA,GAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/client/storefront/components/country-redirect.mjs

@@ -0,0 +1,97 @@
+"use client";
+import { useIcon } from "../../icons/icon-context.mjs";
+import { cn } from "../../ui/utils.mjs";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/client/storefront/components/country-redirect.tsx
+const STORAGE_KEY_DEFAULT = "enad-country-redirect-dismissed";
+function isDismissed(key) {
+	if (key === false) return false;
+	try {
+		return localStorage.getItem(key || STORAGE_KEY_DEFAULT) === "true";
+	} catch {
+		return false;
+	}
+}
+function persistDismissal(key) {
+	if (key === false) return;
+	try {
+		localStorage.setItem(key || STORAGE_KEY_DEFAULT, "true");
+	} catch {}
+}
+function CountryRedirect({ detectedCountry, currentCountry, redirectUrl, onAccept, onDismiss, persistKey, labels = {}, className }) {
+	const CloseIcon = useIcon("close");
+	const GlobeIcon = useIcon("globe");
+	const [visible, setVisible] = React$1.useState(false);
+	React$1.useEffect(() => {
+		if (detectedCountry.code === currentCountry.code) return;
+		if (isDismissed(persistKey ?? STORAGE_KEY_DEFAULT)) return;
+		setVisible(true);
+	}, [
+		detectedCountry.code,
+		currentCountry.code,
+		persistKey
+	]);
+	const dismiss = React$1.useCallback(() => {
+		setVisible(false);
+		persistDismissal(persistKey ?? STORAGE_KEY_DEFAULT);
+		onDismiss?.();
+	}, [persistKey, onDismiss]);
+	const accept = React$1.useCallback(() => {
+		onAccept?.();
+		window.location.href = redirectUrl;
+	}, [onAccept, redirectUrl]);
+	if (!visible) return null;
+	const message = labels.message ?? `It looks like you're visiting from ${detectedCountry.flag ? `${detectedCountry.flag} ` : ""}${detectedCountry.name}.`;
+	const acceptLabel = labels.accept ?? `Go to ${detectedCountry.name} store`;
+	const dismissLabel = labels.dismiss ?? `Stay on ${currentCountry.name} store`;
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "country-redirect",
+		role: "status",
+		"aria-label": "Country store suggestion",
+		className: cn("font-enad animate-slide-down-banner", "border-b border-(--enad-border-color) bg-(--enad-surface, var(--background))", "motion-reduce:animate-none", className),
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "mx-auto flex max-w-7xl items-center justify-between gap-4 px-4 py-3 sm:px-6",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-3 min-w-0",
+				children: [/* @__PURE__ */ jsx(GlobeIcon, {
+					className: "size-5 shrink-0 text-(--enad-text-muted-color)",
+					"aria-hidden": "true"
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-sm text-(--enad-text-primary-color) truncate",
+					children: message
+				})]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2 shrink-0",
+				children: [
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: accept,
+						className: cn("rounded-(--enad-border-radius) bg-(--enad-button-bg) px-3.5 py-1.5 text-sm font-medium text-(--enad-button-color)", "hover:bg-(--enad-button-hover-bg) transition-colors", "motion-reduce:transition-none"),
+						children: acceptLabel
+					}),
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: dismiss,
+						className: cn("rounded-(--enad-border-radius) border border-(--enad-border-color) bg-transparent px-3.5 py-1.5 text-sm font-medium text-(--enad-text-primary-color)", "hover:bg-(--enad-hover-bg) transition-colors", "motion-reduce:transition-none", "hidden sm:inline-flex"),
+						children: dismissLabel
+					}),
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: dismiss,
+						"aria-label": "Dismiss",
+						className: cn("inline-flex items-center justify-center rounded-(--enad-border-radius) p-1.5 text-(--enad-text-muted-color)", "hover:text-(--enad-text-primary-color) hover:bg-(--enad-hover-bg) transition-colors", "motion-reduce:transition-none", "sm:hidden"),
+						children: /* @__PURE__ */ jsx(CloseIcon, {
+							className: "size-4",
+							"aria-hidden": "true"
+						})
+					})
+				]
+			})]
+		})
+	});
+}
+//#endregion
+export { CountryRedirect };
+
+//# sourceMappingURL=country-redirect.mjs.map

package/dist/client/storefront/components/country-redirect.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"country-redirect.mjs","names":["React"],"sources":["../../../../src/client/storefront/components/country-redirect.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport { useIcon } from \"../../icons/icon-context\"\n\nexport interface CountryInfo {\n  code: string\n  name: string\n  flag?: string\n}\n\nexport interface CountryRedirectProps {\n  /** The country detected from the visitor's location */\n  detectedCountry: CountryInfo\n  /** The country the store is currently serving */\n  currentCountry: CountryInfo\n  /** URL to redirect to for the detected country's store */\n  redirectUrl: string\n  /** Called before navigating to the redirect URL */\n  onAccept?: () => void\n  /** Called when the visitor dismisses the banner */\n  onDismiss?: () => void\n  /** localStorage key for persisting dismissal. Set to `false` to disable persistence. */\n  persistKey?: string | false\n  labels?: {\n    /** e.g. \"It looks like you're visiting from {country}.\" */\n    message?: string\n    /** e.g. \"Go to {country} store\" */\n    accept?: string\n    /** e.g. \"Stay on {country} store\" */\n    dismiss?: string\n  }\n  className?: string\n}\n\nconst STORAGE_KEY_DEFAULT = \"enad-country-redirect-dismissed\"\n\nfunction isDismissed(key: string | false): boolean {\n  if (key === false) return false\n  try {\n    return localStorage.getItem(key || STORAGE_KEY_DEFAULT) === \"true\"\n  } catch {\n    return false\n  }\n}\n\nfunction persistDismissal(key: string | false): void {\n  if (key === false) return\n  try {\n    localStorage.setItem(key || STORAGE_KEY_DEFAULT, \"true\")\n  } catch {\n    // storage unavailable (SSR, private browsing quota exceeded, etc.)\n  }\n}\n\nexport function CountryRedirect({\n  detectedCountry,\n  currentCountry,\n  redirectUrl,\n  onAccept,\n  onDismiss,\n  persistKey,\n  labels = {},\n  className,\n}: CountryRedirectProps) {\n  const CloseIcon = useIcon(\"close\")\n  const GlobeIcon = useIcon(\"globe\")\n\n  const [visible, setVisible] = React.useState(false)\n\n  React.useEffect(() => {\n    if (detectedCountry.code === currentCountry.code) return\n    if (isDismissed(persistKey ?? STORAGE_KEY_DEFAULT)) return\n    setVisible(true)\n  }, [detectedCountry.code, currentCountry.code, persistKey])\n\n  const dismiss = React.useCallback(() => {\n    setVisible(false)\n    persistDismissal(persistKey ?? STORAGE_KEY_DEFAULT)\n    onDismiss?.()\n  }, [persistKey, onDismiss])\n\n  const accept = React.useCallback(() => {\n    onAccept?.()\n    window.location.href = redirectUrl\n  }, [onAccept, redirectUrl])\n\n  if (!visible) return null\n\n  const message =\n    labels.message ??\n    `It looks like you're visiting from ${detectedCountry.flag ? `${detectedCountry.flag} ` : \"\"}${detectedCountry.name}.`\n  const acceptLabel =\n    labels.accept ?? `Go to ${detectedCountry.name} store`\n  const dismissLabel =\n    labels.dismiss ?? `Stay on ${currentCountry.name} store`\n\n  return (\n    <div\n      data-slot=\"country-redirect\"\n      role=\"status\"\n      aria-label=\"Country store suggestion\"\n      className={cn(\n        \"font-enad animate-slide-down-banner\",\n        \"border-b border-(--enad-border-color) bg-(--enad-surface, var(--background))\",\n        \"motion-reduce:animate-none\",\n        className,\n      )}\n    >\n      <div className=\"mx-auto flex max-w-7xl items-center justify-between gap-4 px-4 py-3 sm:px-6\">\n        <div className=\"flex items-center gap-3 min-w-0\">\n          <GlobeIcon className=\"size-5 shrink-0 text-(--enad-text-muted-color)\" aria-hidden=\"true\" />\n          <p className=\"text-sm text-(--enad-text-primary-color) truncate\">\n            {message}\n          </p>\n        </div>\n\n        <div className=\"flex items-center gap-2 shrink-0\">\n          <button\n            type=\"button\"\n            onClick={accept}\n            className={cn(\n              \"rounded-(--enad-border-radius) bg-(--enad-button-bg) px-3.5 py-1.5 text-sm font-medium text-(--enad-button-color)\",\n              \"hover:bg-(--enad-button-hover-bg) transition-colors\",\n              \"motion-reduce:transition-none\",\n            )}\n          >\n            {acceptLabel}\n          </button>\n          <button\n            type=\"button\"\n            onClick={dismiss}\n            className={cn(\n              \"rounded-(--enad-border-radius) border border-(--enad-border-color) bg-transparent px-3.5 py-1.5 text-sm font-medium text-(--enad-text-primary-color)\",\n              \"hover:bg-(--enad-hover-bg) transition-colors\",\n              \"motion-reduce:transition-none\",\n              \"hidden sm:inline-flex\",\n            )}\n          >\n            {dismissLabel}\n          </button>\n          <button\n            type=\"button\"\n            onClick={dismiss}\n            aria-label=\"Dismiss\"\n            className={cn(\n              \"inline-flex items-center justify-center rounded-(--enad-border-radius) p-1.5 text-(--enad-text-muted-color)\",\n              \"hover:text-(--enad-text-primary-color) hover:bg-(--enad-hover-bg) transition-colors\",\n              \"motion-reduce:transition-none\",\n              \"sm:hidden\",\n            )}\n          >\n            <CloseIcon className=\"size-4\" aria-hidden=\"true\" />\n          </button>\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;;;AAoCA,MAAM,sBAAsB;AAE5B,SAAS,YAAY,KAA8B;AACjD,KAAI,QAAQ,MAAO,QAAO;AAC1B,KAAI;AACF,SAAO,aAAa,QAAQ,OAAO,oBAAoB,KAAK;SACtD;AACN,SAAO;;;AAIX,SAAS,iBAAiB,KAA2B;AACnD,KAAI,QAAQ,MAAO;AACnB,KAAI;AACF,eAAa,QAAQ,OAAO,qBAAqB,OAAO;SAClD;;AAKV,SAAgB,gBAAgB,EAC9B,iBACA,gBACA,aACA,UACA,WACA,YACA,SAAS,EAAE,EACX,aACuB;CACvB,MAAM,YAAY,QAAQ,QAAQ;CAClC,MAAM,YAAY,QAAQ,QAAQ;CAElC,MAAM,CAAC,SAAS,cAAcA,QAAM,SAAS,MAAM;AAEnD,SAAM,gBAAgB;AACpB,MAAI,gBAAgB,SAAS,eAAe,KAAM;AAClD,MAAI,YAAY,cAAc,oBAAoB,CAAE;AACpD,aAAW,KAAK;IACf;EAAC,gBAAgB;EAAM,eAAe;EAAM;EAAW,CAAC;CAE3D,MAAM,UAAUA,QAAM,kBAAkB;AACtC,aAAW,MAAM;AACjB,mBAAiB,cAAc,oBAAoB;AACnD,eAAa;IACZ,CAAC,YAAY,UAAU,CAAC;CAE3B,MAAM,SAASA,QAAM,kBAAkB;AACrC,cAAY;AACZ,SAAO,SAAS,OAAO;IACtB,CAAC,UAAU,YAAY,CAAC;AAE3B,KAAI,CAAC,QAAS,QAAO;CAErB,MAAM,UACJ,OAAO,WACP,sCAAsC,gBAAgB,OAAO,GAAG,gBAAgB,KAAK,KAAK,KAAK,gBAAgB,KAAK;CACtH,MAAM,cACJ,OAAO,UAAU,SAAS,gBAAgB,KAAK;CACjD,MAAM,eACJ,OAAO,WAAW,WAAW,eAAe,KAAK;AAEnD,QACE,oBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,cAAW;EACX,WAAW,GACT,uCACA,gFACA,8BACA,UACD;YAED,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,oBAAC,WAAD;KAAW,WAAU;KAAiD,eAAY;KAAS,CAAA,EAC3F,oBAAC,KAAD;KAAG,WAAU;eACV;KACC,CAAA,CACA;OAEN,qBAAC,OAAD;IAAK,WAAU;cAAf;KACE,oBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAW,GACT,qHACA,uDACA,gCACD;gBAEA;MACM,CAAA;KACT,oBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAW,GACT,wJACA,gDACA,iCACA,wBACD;gBAEA;MACM,CAAA;KACT,oBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,cAAW;MACX,WAAW,GACT,+GACA,uFACA,iCACA,YACD;gBAED,oBAAC,WAAD;OAAW,WAAU;OAAS,eAAY;OAAS,CAAA;MAC5C,CAAA;KACL;MACF;;EACF,CAAA"}

package/dist/client/storefront/components/empty-state.d.ts

@@ -0,0 +1,49 @@
+import * as React$1 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/storefront/components/empty-state.d.ts
+declare const presets: {
+  readonly "no-results": {
+    readonly title: "No results found";
+    readonly description: "Try adjusting your search or filters to find what you're looking for.";
+  };
+  readonly "empty-cart": {
+    readonly title: "Your cart is empty";
+    readonly description: "Browse our collection and add items to your cart.";
+  };
+  readonly "no-reviews": {
+    readonly title: "No reviews yet";
+    readonly description: "Be the first to share your experience.";
+  };
+  readonly "no-wishlist": {
+    readonly title: "Your wishlist is empty";
+    readonly description: "Save your favorite items here for later.";
+  };
+  readonly "end-of-list": {
+    readonly title: "You've seen it all";
+    readonly description: "Check back later for new arrivals.";
+  };
+};
+type PresetVariant = keyof typeof presets;
+interface EmptyStateProps {
+  /** Use a preset for default title/description */
+  variant?: PresetVariant;
+  /** Custom icon or illustration slot */
+  icon?: React$1.ReactNode;
+  title?: string;
+  description?: string;
+  /** CTA button or link */
+  action?: React$1.ReactNode;
+  className?: string;
+}
+declare function EmptyState({
+  variant,
+  icon,
+  title,
+  description,
+  action,
+  className
+}: EmptyStateProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { EmptyState, EmptyStateProps };
+//# sourceMappingURL=empty-state.d.ts.map

package/dist/client/storefront/components/empty-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-state.d.ts","names":[],"sources":["../../../../src/client/storefront/components/empty-state.tsx"],"mappings":";;;;cAKM,OAAA;EAAA;;;;;;;;;;;;;;;;;;;;;KAuBD,aAAA,gBAA6B,OAAA;AAAA,UAIjB,eAAA;EAJZ;EAMH,OAAA,GAAU,aAAA;;EAEV,IAAA,GAAO,OAAA,CAAM,SAAA;EACb,KAAA;EACA,WAAA;EAN8B;EAQ9B,MAAA,GAAS,OAAA,CAAM,SAAA;EACf,SAAA;AAAA;AAAA,iBAKc,UAAA,CAAA;EACd,OAAA;EACA,IAAA;EACA,KAAA;EACA,WAAA;EACA,MAAA;EACA;AAAA,GACC,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/client/storefront/components/empty-state.mjs

@@ -0,0 +1,56 @@
+import { cn } from "../../ui/utils.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/client/storefront/components/empty-state.tsx
+const presets = {
+	"no-results": {
+		title: "No results found",
+		description: "Try adjusting your search or filters to find what you're looking for."
+	},
+	"empty-cart": {
+		title: "Your cart is empty",
+		description: "Browse our collection and add items to your cart."
+	},
+	"no-reviews": {
+		title: "No reviews yet",
+		description: "Be the first to share your experience."
+	},
+	"no-wishlist": {
+		title: "Your wishlist is empty",
+		description: "Save your favorite items here for later."
+	},
+	"end-of-list": {
+		title: "You've seen it all",
+		description: "Check back later for new arrivals."
+	}
+};
+function EmptyState({ variant, icon, title, description, action, className }) {
+	const preset = variant ? presets[variant] : void 0;
+	const resolvedTitle = title ?? preset?.title;
+	const resolvedDescription = description ?? preset?.description;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col items-center justify-center gap-4 px-6 py-12 text-center", className),
+		children: [
+			icon && /* @__PURE__ */ jsx("div", {
+				className: "flex size-16 items-center justify-center rounded-full bg-muted text-muted-foreground border border-(--enad-border-color)",
+				children: icon
+			}),
+			resolvedTitle && /* @__PURE__ */ jsx("h3", {
+				className: "text-lg font-semibold font-enad",
+				children: resolvedTitle
+			}),
+			resolvedDescription && /* @__PURE__ */ jsx("p", {
+				className: "max-w-sm text-sm text-muted-foreground leading-relaxed",
+				children: resolvedDescription
+			}),
+			action && /* @__PURE__ */ jsx("div", {
+				className: "mt-2",
+				children: action
+			})
+		]
+	});
+}
+//#endregion
+export { EmptyState };
+
+//# sourceMappingURL=empty-state.mjs.map

package/dist/client/storefront/components/empty-state.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-state.mjs","names":[],"sources":["../../../../src/client/storefront/components/empty-state.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../ui/utils\";\n\n/* ─── Preset defaults ─── */\n\nconst presets = {\n  \"no-results\": {\n    title: \"No results found\",\n    description: \"Try adjusting your search or filters to find what you're looking for.\",\n  },\n  \"empty-cart\": {\n    title: \"Your cart is empty\",\n    description: \"Browse our collection and add items to your cart.\",\n  },\n  \"no-reviews\": {\n    title: \"No reviews yet\",\n    description: \"Be the first to share your experience.\",\n  },\n  \"no-wishlist\": {\n    title: \"Your wishlist is empty\",\n    description: \"Save your favorite items here for later.\",\n  },\n  \"end-of-list\": {\n    title: \"You've seen it all\",\n    description: \"Check back later for new arrivals.\",\n  },\n} as const;\n\ntype PresetVariant = keyof typeof presets;\n\n/* ─── Types ─── */\n\nexport interface EmptyStateProps {\n  /** Use a preset for default title/description */\n  variant?: PresetVariant;\n  /** Custom icon or illustration slot */\n  icon?: React.ReactNode;\n  title?: string;\n  description?: string;\n  /** CTA button or link */\n  action?: React.ReactNode;\n  className?: string;\n}\n\n/* ─── Component ─── */\n\nexport function EmptyState({\n  variant,\n  icon,\n  title,\n  description,\n  action,\n  className,\n}: EmptyStateProps) {\n  const preset = variant ? presets[variant] : undefined;\n  const resolvedTitle = title ?? preset?.title;\n  const resolvedDescription = description ?? preset?.description;\n\n  return (\n    <div\n      className={cn(\n        \"flex flex-col items-center justify-center gap-4 px-6 py-12 text-center\",\n        className,\n      )}\n    >\n      {icon && (\n        <div className=\"flex size-16 items-center justify-center rounded-full bg-muted text-muted-foreground border border-(--enad-border-color)\">\n          {icon}\n        </div>\n      )}\n\n      {resolvedTitle && <h3 className=\"text-lg font-semibold font-enad\">{resolvedTitle}</h3>}\n\n      {resolvedDescription && (\n        <p className=\"max-w-sm text-sm text-muted-foreground leading-relaxed\">\n          {resolvedDescription}\n        </p>\n      )}\n\n      {action && <div className=\"mt-2\">{action}</div>}\n    </div>\n  );\n}\n"],"mappings":";;;;AAKA,MAAM,UAAU;CACd,cAAc;EACZ,OAAO;EACP,aAAa;EACd;CACD,cAAc;EACZ,OAAO;EACP,aAAa;EACd;CACD,cAAc;EACZ,OAAO;EACP,aAAa;EACd;CACD,eAAe;EACb,OAAO;EACP,aAAa;EACd;CACD,eAAe;EACb,OAAO;EACP,aAAa;EACd;CACF;AAoBD,SAAgB,WAAW,EACzB,SACA,MACA,OACA,aACA,QACA,aACkB;CAClB,MAAM,SAAS,UAAU,QAAQ,WAAW,KAAA;CAC5C,MAAM,gBAAgB,SAAS,QAAQ;CACvC,MAAM,sBAAsB,eAAe,QAAQ;AAEnD,QACE,qBAAC,OAAD;EACE,WAAW,GACT,0EACA,UACD;YAJH;GAMG,QACC,oBAAC,OAAD;IAAK,WAAU;cACZ;IACG,CAAA;GAGP,iBAAiB,oBAAC,MAAD;IAAI,WAAU;cAAmC;IAAmB,CAAA;GAErF,uBACC,oBAAC,KAAD;IAAG,WAAU;cACV;IACC,CAAA;GAGL,UAAU,oBAAC,OAAD;IAAK,WAAU;cAAQ;IAAa,CAAA;GAC3C"}

package/dist/client/storefront/components/image-lightbox.d.ts

@@ -0,0 +1,25 @@
+import { ImageAsset } from "../types.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/storefront/components/image-lightbox.d.ts
+interface ImageLightboxProps {
+  images: ImageAsset[];
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  /** Starting image index */
+  startIndex?: number;
+  /** Show thumbnail strip */
+  showThumbnails?: boolean;
+  className?: string;
+}
+declare function ImageLightbox({
+  images,
+  open,
+  onOpenChange,
+  startIndex,
+  showThumbnails,
+  className
+}: ImageLightboxProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { ImageLightbox, ImageLightboxProps };
+//# sourceMappingURL=image-lightbox.d.ts.map

package/dist/client/storefront/components/image-lightbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-lightbox.d.ts","names":[],"sources":["../../../../src/client/storefront/components/image-lightbox.tsx"],"mappings":";;;;UAUiB,kBAAA;EACf,MAAA,EAAQ,UAAA;EACR,IAAA;EACA,YAAA,GAAe,IAAA;EAHkB;EAKjC,UAAA;EAJkB;EAMlB,cAAA;EACA,SAAA;AAAA;AAAA,iBAKc,aAAA,CAAA;EACd,MAAA;EACA,IAAA;EACA,YAAA;EACA,UAAA;EACA,cAAA;EACA;AAAA,GACC,kBAAA,GAAkB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/client/storefront/components/image-lightbox.mjs

@@ -0,0 +1,256 @@
+"use client";
+import { useIcon } from "../../icons/icon-context.mjs";
+import { cn } from "../../ui/utils.mjs";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { TransformComponent, TransformWrapper, useControls } from "react-zoom-pan-pinch";
+//#region src/client/storefront/components/image-lightbox.tsx
+function ImageLightbox({ images, open, onOpenChange, startIndex = 0, showThumbnails = true, className }) {
+	const CloseIcon = useIcon("close");
+	const ChevronLeftIcon = useIcon("chevronLeft");
+	const ChevronRightIcon = useIcon("chevronRight");
+	const [activeIndex, setActiveIndex] = React$1.useState(startIndex);
+	const dialogRef = React$1.useRef(null);
+	const previousFocusRef = React$1.useRef(null);
+	React$1.useEffect(() => {
+		if (open) setActiveIndex(startIndex);
+	}, [open, startIndex]);
+	React$1.useEffect(() => {
+		if (open) {
+			previousFocusRef.current = document.activeElement;
+			requestAnimationFrame(() => dialogRef.current?.focus());
+		} else if (previousFocusRef.current) {
+			previousFocusRef.current.focus();
+			previousFocusRef.current = null;
+		}
+	}, [open]);
+	React$1.useEffect(() => {
+		if (!open) return;
+		const prev = document.body.style.overflow;
+		document.body.style.overflow = "hidden";
+		return () => {
+			document.body.style.overflow = prev;
+		};
+	}, [open]);
+	React$1.useEffect(() => {
+		if (!open) return;
+		const handleKey = (e) => {
+			switch (e.key) {
+				case "Escape":
+					onOpenChange(false);
+					break;
+				case "ArrowLeft":
+					setActiveIndex((i) => i > 0 ? i - 1 : images.length - 1);
+					break;
+				case "ArrowRight":
+					setActiveIndex((i) => i < images.length - 1 ? i + 1 : 0);
+					break;
+				case "Tab": {
+					const dialog = dialogRef.current;
+					if (!dialog) return;
+					const focusable = dialog.querySelectorAll("button:not([disabled]), [tabindex]:not([tabindex=\"-1\"])");
+					if (focusable.length === 0) return;
+					const first = focusable[0];
+					const last = focusable[focusable.length - 1];
+					if (e.shiftKey && document.activeElement === first) {
+						e.preventDefault();
+						last.focus();
+					} else if (!e.shiftKey && document.activeElement === last) {
+						e.preventDefault();
+						first.focus();
+					}
+					break;
+				}
+			}
+		};
+		document.addEventListener("keydown", handleKey);
+		return () => document.removeEventListener("keydown", handleKey);
+	}, [
+		open,
+		images.length,
+		onOpenChange
+	]);
+	if (!open || images.length === 0) return null;
+	const active = images[activeIndex];
+	const hasMultiple = images.length > 1;
+	return /* @__PURE__ */ jsxs("div", {
+		ref: dialogRef,
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-label": "Image lightbox",
+		tabIndex: -1,
+		className: cn("fixed inset-0 z-50 flex flex-col bg-black/95 select-none outline-none", className),
+		children: [/* @__PURE__ */ jsxs(TransformWrapper, {
+			initialScale: 1,
+			minScale: 1,
+			maxScale: 5,
+			centerOnInit: true,
+			doubleClick: {
+				mode: "toggle",
+				step: 2
+			},
+			wheel: { step: .15 },
+			panning: { velocityDisabled: true },
+			children: [/* @__PURE__ */ jsx(ZoomToolbar, {
+				activeIndex,
+				total: images.length,
+				onClose: () => onOpenChange(false),
+				CloseIcon
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "relative flex-1 flex items-center justify-center overflow-hidden",
+				children: [
+					hasMultiple && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: () => setActiveIndex((i) => i > 0 ? i - 1 : images.length - 1),
+						className: "absolute left-4 z-10 rounded-full bg-white/10 p-2 text-white hover:bg-white/20 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none",
+						"aria-label": "Previous image",
+						children: /* @__PURE__ */ jsx(ChevronLeftIcon, { className: "size-6" })
+					}),
+					/* @__PURE__ */ jsx(TransformComponent, {
+						wrapperClass: "!w-full !h-full",
+						contentClass: "!w-full !h-full !flex !items-center !justify-center",
+						children: /* @__PURE__ */ jsx("img", {
+							src: active.src,
+							alt: active.alt ?? "",
+							draggable: false,
+							className: "max-h-[calc(100vh-10rem)] max-w-[calc(100vw-6rem)] object-contain"
+						})
+					}),
+					hasMultiple && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: () => setActiveIndex((i) => i < images.length - 1 ? i + 1 : 0),
+						className: "absolute right-4 z-10 rounded-full bg-white/10 p-2 text-white hover:bg-white/20 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none",
+						"aria-label": "Next image",
+						children: /* @__PURE__ */ jsx(ChevronRightIcon, { className: "size-6" })
+					})
+				]
+			})]
+		}), showThumbnails && hasMultiple && /* @__PURE__ */ jsx("div", {
+			className: "flex justify-center gap-2 px-4 py-3 overflow-x-auto",
+			children: images.map((img, i) => /* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: () => setActiveIndex(i),
+				className: cn("relative size-14 shrink-0 overflow-hidden rounded border-2 transition-colors", i === activeIndex ? "border-white" : "border-transparent opacity-50 hover:opacity-80"),
+				children: /* @__PURE__ */ jsx("img", {
+					src: img.src,
+					alt: img.alt ?? "",
+					loading: "lazy",
+					className: "size-full object-cover"
+				})
+			}, i))
+		})]
+	});
+}
+function ZoomToolbar({ activeIndex, total, onClose, CloseIcon }) {
+	const { zoomIn, zoomOut, resetTransform } = useControls();
+	const prevIndex = React$1.useRef(activeIndex);
+	React$1.useEffect(() => {
+		if (prevIndex.current !== activeIndex) {
+			resetTransform(0);
+			prevIndex.current = activeIndex;
+		}
+	}, [activeIndex, resetTransform]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex items-center justify-between px-4 py-3 text-white/80",
+		children: [/* @__PURE__ */ jsxs("span", {
+			className: "text-sm tabular-nums",
+			children: [
+				activeIndex + 1,
+				" / ",
+				total
+			]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2",
+			children: [
+				/* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: () => zoomIn(),
+					className: "rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none",
+					"aria-label": "Zoom in",
+					children: /* @__PURE__ */ jsxs("svg", {
+						className: "size-5",
+						viewBox: "0 0 24 24",
+						fill: "none",
+						stroke: "currentColor",
+						strokeWidth: "2",
+						children: [
+							/* @__PURE__ */ jsx("circle", {
+								cx: "11",
+								cy: "11",
+								r: "8"
+							}),
+							/* @__PURE__ */ jsx("line", {
+								x1: "21",
+								y1: "21",
+								x2: "16.65",
+								y2: "16.65"
+							}),
+							/* @__PURE__ */ jsx("line", {
+								x1: "11",
+								y1: "8",
+								x2: "11",
+								y2: "14"
+							}),
+							/* @__PURE__ */ jsx("line", {
+								x1: "8",
+								y1: "11",
+								x2: "14",
+								y2: "11"
+							})
+						]
+					})
+				}),
+				/* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: () => zoomOut(),
+					className: "rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none",
+					"aria-label": "Zoom out",
+					children: /* @__PURE__ */ jsxs("svg", {
+						className: "size-5",
+						viewBox: "0 0 24 24",
+						fill: "none",
+						stroke: "currentColor",
+						strokeWidth: "2",
+						children: [
+							/* @__PURE__ */ jsx("circle", {
+								cx: "11",
+								cy: "11",
+								r: "8"
+							}),
+							/* @__PURE__ */ jsx("line", {
+								x1: "21",
+								y1: "21",
+								x2: "16.65",
+								y2: "16.65"
+							}),
+							/* @__PURE__ */ jsx("line", {
+								x1: "8",
+								y1: "11",
+								x2: "14",
+								y2: "11"
+							})
+						]
+					})
+				}),
+				/* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: () => resetTransform(),
+					className: "rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none text-xs font-medium",
+					"aria-label": "Reset zoom",
+					children: "1:1"
+				}),
+				/* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: onClose,
+					className: "rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none",
+					"aria-label": "Close lightbox",
+					children: /* @__PURE__ */ jsx(CloseIcon, { className: "size-5" })
+				})
+			]
+		})]
+	});
+}
+//#endregion
+export { ImageLightbox };
+
+//# sourceMappingURL=image-lightbox.mjs.map

package/dist/client/storefront/components/image-lightbox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-lightbox.mjs","names":["React"],"sources":["../../../../src/client/storefront/components/image-lightbox.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { TransformWrapper, TransformComponent, useControls } from \"react-zoom-pan-pinch\";\nimport { cn } from \"../../ui/utils\";\nimport { useIcon } from \"../../icons/icon-context\";\nimport type { ImageAsset } from \"../types\";\n\n/* ─── Types ─── */\n\nexport interface ImageLightboxProps {\n  images: ImageAsset[];\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  /** Starting image index */\n  startIndex?: number;\n  /** Show thumbnail strip */\n  showThumbnails?: boolean;\n  className?: string;\n}\n\n/* ─── Component ─── */\n\nexport function ImageLightbox({\n  images,\n  open,\n  onOpenChange,\n  startIndex = 0,\n  showThumbnails = true,\n  className,\n}: ImageLightboxProps) {\n  const CloseIcon = useIcon(\"close\");\n  const ChevronLeftIcon = useIcon(\"chevronLeft\");\n  const ChevronRightIcon = useIcon(\"chevronRight\");\n\n  const [activeIndex, setActiveIndex] = React.useState(startIndex);\n  const dialogRef = React.useRef<HTMLDivElement>(null);\n  const previousFocusRef = React.useRef<HTMLElement | null>(null);\n\n  React.useEffect(() => {\n    if (open) setActiveIndex(startIndex);\n  }, [open, startIndex]);\n\n  // Focus management: capture trigger, restore on close\n  React.useEffect(() => {\n    if (open) {\n      previousFocusRef.current = document.activeElement as HTMLElement | null;\n      requestAnimationFrame(() => dialogRef.current?.focus());\n    } else if (previousFocusRef.current) {\n      previousFocusRef.current.focus();\n      previousFocusRef.current = null;\n    }\n  }, [open]);\n\n  // Lock body scroll when open\n  React.useEffect(() => {\n    if (!open) return;\n    const prev = document.body.style.overflow;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = prev;\n    };\n  }, [open]);\n\n  // Keyboard navigation + focus trap\n  React.useEffect(() => {\n    if (!open) return;\n    const handleKey = (e: KeyboardEvent) => {\n      switch (e.key) {\n        case \"Escape\":\n          onOpenChange(false);\n          break;\n        case \"ArrowLeft\":\n          setActiveIndex((i) => (i > 0 ? i - 1 : images.length - 1));\n          break;\n        case \"ArrowRight\":\n          setActiveIndex((i) => (i < images.length - 1 ? i + 1 : 0));\n          break;\n        case \"Tab\": {\n          const dialog = dialogRef.current;\n          if (!dialog) return;\n          const focusable = dialog.querySelectorAll<HTMLElement>(\n            'button:not([disabled]), [tabindex]:not([tabindex=\"-1\"])',\n          );\n          if (focusable.length === 0) return;\n          const first = focusable[0]!;\n          const last = focusable[focusable.length - 1]!;\n          if (e.shiftKey && document.activeElement === first) {\n            e.preventDefault();\n            last.focus();\n          } else if (!e.shiftKey && document.activeElement === last) {\n            e.preventDefault();\n            first.focus();\n          }\n          break;\n        }\n      }\n    };\n    document.addEventListener(\"keydown\", handleKey);\n    return () => document.removeEventListener(\"keydown\", handleKey);\n  }, [open, images.length, onOpenChange]);\n\n  if (!open || images.length === 0) return null;\n\n  const active = images[activeIndex]!;\n  const hasMultiple = images.length > 1;\n\n  return (\n    <div\n      ref={dialogRef}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label=\"Image lightbox\"\n      tabIndex={-1}\n      className={cn(\n        \"fixed inset-0 z-50 flex flex-col bg-black/95 select-none outline-none\",\n        className,\n      )}\n    >\n      <TransformWrapper\n        initialScale={1}\n        minScale={1}\n        maxScale={5}\n        centerOnInit\n        doubleClick={{ mode: \"toggle\", step: 2 }}\n        wheel={{ step: 0.15 }}\n        panning={{ velocityDisabled: true }}\n      >\n        {/* Toolbar */}\n        <ZoomToolbar\n          activeIndex={activeIndex}\n          total={images.length}\n          onClose={() => onOpenChange(false)}\n          CloseIcon={CloseIcon}\n        />\n\n        {/* Main image area */}\n        <div className=\"relative flex-1 flex items-center justify-center overflow-hidden\">\n          {hasMultiple && (\n            <button\n              type=\"button\"\n              onClick={() => setActiveIndex((i) => (i > 0 ? i - 1 : images.length - 1))}\n              className=\"absolute left-4 z-10 rounded-full bg-white/10 p-2 text-white hover:bg-white/20 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none\"\n              aria-label=\"Previous image\"\n            >\n              <ChevronLeftIcon className=\"size-6\" />\n            </button>\n          )}\n\n          <TransformComponent\n            wrapperClass=\"!w-full !h-full\"\n            contentClass=\"!w-full !h-full !flex !items-center !justify-center\"\n          >\n            <img\n              src={active.src}\n              alt={active.alt ?? \"\"}\n              draggable={false}\n              className=\"max-h-[calc(100vh-10rem)] max-w-[calc(100vw-6rem)] object-contain\"\n            />\n          </TransformComponent>\n\n          {hasMultiple && (\n            <button\n              type=\"button\"\n              onClick={() => setActiveIndex((i) => (i < images.length - 1 ? i + 1 : 0))}\n              className=\"absolute right-4 z-10 rounded-full bg-white/10 p-2 text-white hover:bg-white/20 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none\"\n              aria-label=\"Next image\"\n            >\n              <ChevronRightIcon className=\"size-6\" />\n            </button>\n          )}\n        </div>\n      </TransformWrapper>\n\n      {/* Thumbnails */}\n      {showThumbnails && hasMultiple && (\n        <div className=\"flex justify-center gap-2 px-4 py-3 overflow-x-auto\">\n          {images.map((img, i) => (\n            <button\n              key={i}\n              type=\"button\"\n              onClick={() => setActiveIndex(i)}\n              className={cn(\n                \"relative size-14 shrink-0 overflow-hidden rounded border-2 transition-colors\",\n                i === activeIndex\n                  ? \"border-white\"\n                  : \"border-transparent opacity-50 hover:opacity-80\",\n              )}\n            >\n              <img\n                src={img.src}\n                alt={img.alt ?? \"\"}\n                loading=\"lazy\"\n                className=\"size-full object-cover\"\n              />\n            </button>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\n/* ─── Zoom toolbar (uses useControls from the library) ─── */\n\nfunction ZoomToolbar({\n  activeIndex,\n  total,\n  onClose,\n  CloseIcon,\n}: {\n  activeIndex: number;\n  total: number;\n  onClose: () => void;\n  CloseIcon: React.ComponentType<{ className?: string }>;\n}) {\n  const { zoomIn, zoomOut, resetTransform } = useControls();\n\n  // Reset zoom when switching images (avoids full TransformWrapper remount)\n  const prevIndex = React.useRef(activeIndex);\n  React.useEffect(() => {\n    if (prevIndex.current !== activeIndex) {\n      resetTransform(0);\n      prevIndex.current = activeIndex;\n    }\n  }, [activeIndex, resetTransform]);\n\n  return (\n    <div className=\"flex items-center justify-between px-4 py-3 text-white/80\">\n      <span className=\"text-sm tabular-nums\">\n        {activeIndex + 1} / {total}\n      </span>\n      <div className=\"flex items-center gap-2\">\n        <button\n          type=\"button\"\n          onClick={() => zoomIn()}\n          className=\"rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none\"\n          aria-label=\"Zoom in\"\n        >\n          <svg\n            className=\"size-5\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n          >\n            <circle cx=\"11\" cy=\"11\" r=\"8\" />\n            <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\" />\n            <line x1=\"11\" y1=\"8\" x2=\"11\" y2=\"14\" />\n            <line x1=\"8\" y1=\"11\" x2=\"14\" y2=\"11\" />\n          </svg>\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => zoomOut()}\n          className=\"rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none\"\n          aria-label=\"Zoom out\"\n        >\n          <svg\n            className=\"size-5\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n          >\n            <circle cx=\"11\" cy=\"11\" r=\"8\" />\n            <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\" />\n            <line x1=\"8\" y1=\"11\" x2=\"14\" y2=\"11\" />\n          </svg>\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => resetTransform()}\n          className=\"rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none text-xs font-medium\"\n          aria-label=\"Reset zoom\"\n        >\n          1:1\n        </button>\n        <button\n          type=\"button\"\n          onClick={onClose}\n          className=\"rounded p-1.5 hover:bg-white/10 transition-colors focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:outline-none\"\n          aria-label=\"Close lightbox\"\n        >\n          <CloseIcon className=\"size-5\" />\n        </button>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/client/storefront/components/infinite-scroll.d.ts

@@ -0,0 +1,59 @@
+import * as React$1 from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/storefront/components/infinite-scroll.d.ts
+interface UseInfiniteScrollOptions {
+  /** Called when sentinel enters viewport */
+  onLoadMore: () => void;
+  /** Whether more items can be loaded */
+  hasMore: boolean;
+  /** Whether currently loading */
+  loading?: boolean;
+  /** IntersectionObserver rootMargin — controls how early to trigger */
+  threshold?: string;
+  /** Root element for intersection (defaults to viewport) */
+  root?: React$1.RefObject<Element | null>;
+}
+interface UseInfiniteScrollReturn {
+  sentinelRef: React$1.RefCallback<HTMLElement>;
+  loading: boolean;
+  hasMore: boolean;
+}
+declare function useInfiniteScroll({
+  onLoadMore,
+  hasMore,
+  loading,
+  threshold,
+  root
+}: UseInfiniteScrollOptions): UseInfiniteScrollReturn;
+interface InfiniteScrollProps {
+  onLoadMore: () => void;
+  hasMore: boolean;
+  loading?: boolean;
+  /** IntersectionObserver rootMargin */
+  threshold?: string;
+  /** Fallback "Load more" button for accessibility */
+  showLoadMoreButton?: boolean;
+  loadMoreLabel?: string;
+  /** Loading indicator slot */
+  loadingIndicator?: React$1.ReactNode;
+  /** End-of-list indicator slot */
+  endIndicator?: React$1.ReactNode;
+  children: React$1.ReactNode;
+  className?: string;
+}
+declare function InfiniteScroll({
+  onLoadMore,
+  hasMore,
+  loading,
+  threshold,
+  showLoadMoreButton,
+  loadMoreLabel,
+  loadingIndicator,
+  endIndicator,
+  children,
+  className
+}: InfiniteScrollProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { InfiniteScroll, InfiniteScrollProps, UseInfiniteScrollOptions, UseInfiniteScrollReturn, useInfiniteScroll };
+//# sourceMappingURL=infinite-scroll.d.ts.map