simplycms 0.4.0

package/dist/chunk-OYSLI33V.js

@@ -0,0 +1,192 @@
+import { Button } from './chunk-TZMNJIAU.js';
+import * as React from 'react';
+import useEmblaCarousel from 'embla-carousel-react';
+import { ArrowLeft, ArrowRight } from 'lucide-react';
+import { cn } from 'simplycms/ui/utils';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var CarouselContext = React.createContext(null);
+function useCarousel() {
+  const context = React.useContext(CarouselContext);
+  if (!context) {
+    throw new Error("useCarousel must be used within a <Carousel />");
+  }
+  return context;
+}
+var Carousel = React.forwardRef(
+  ({
+    orientation = "horizontal",
+    opts,
+    setApi,
+    plugins,
+    className,
+    children,
+    ...props
+  }, ref) => {
+    const [carouselRef, api] = useEmblaCarousel(
+      {
+        ...opts,
+        axis: orientation === "horizontal" ? "x" : "y"
+      },
+      plugins
+    );
+    const [canScrollPrev, setCanScrollPrev] = React.useState(false);
+    const [canScrollNext, setCanScrollNext] = React.useState(false);
+    const onSelect = React.useCallback((api2) => {
+      if (!api2) {
+        return;
+      }
+      setCanScrollPrev(api2.canScrollPrev());
+      setCanScrollNext(api2.canScrollNext());
+    }, []);
+    const scrollPrev = React.useCallback(() => {
+      api?.scrollPrev();
+    }, [api]);
+    const scrollNext = React.useCallback(() => {
+      api?.scrollNext();
+    }, [api]);
+    const handleKeyDown = React.useCallback(
+      (event) => {
+        if (event.key === "ArrowLeft") {
+          event.preventDefault();
+          scrollPrev();
+        } else if (event.key === "ArrowRight") {
+          event.preventDefault();
+          scrollNext();
+        }
+      },
+      [scrollPrev, scrollNext]
+    );
+    React.useEffect(() => {
+      if (!api || !setApi) {
+        return;
+      }
+      setApi(api);
+    }, [api, setApi]);
+    React.useEffect(() => {
+      if (!api) {
+        return;
+      }
+      onSelect(api);
+      api.on("reInit", onSelect);
+      api.on("select", onSelect);
+      return () => {
+        api?.off("select", onSelect);
+      };
+    }, [api, onSelect]);
+    return /* @__PURE__ */ jsx(
+      CarouselContext.Provider,
+      {
+        value: {
+          carouselRef,
+          api,
+          opts,
+          orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
+          scrollPrev,
+          scrollNext,
+          canScrollPrev,
+          canScrollNext
+        },
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref,
+            onKeyDownCapture: handleKeyDown,
+            className: cn("relative", className),
+            role: "region",
+            "aria-roledescription": "carousel",
+            ...props,
+            children
+          }
+        )
+      }
+    );
+  }
+);
+Carousel.displayName = "Carousel";
+var CarouselContent = React.forwardRef(({ className, ...props }, ref) => {
+  const { carouselRef, orientation } = useCarousel();
+  return /* @__PURE__ */ jsx("div", { ref: carouselRef, className: "overflow-hidden", children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex",
+        orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
+        className
+      ),
+      ...props
+    }
+  ) });
+});
+CarouselContent.displayName = "CarouselContent";
+var CarouselItem = React.forwardRef(({ className, ...props }, ref) => {
+  const { orientation } = useCarousel();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      role: "group",
+      "aria-roledescription": "slide",
+      className: cn(
+        "min-w-0 shrink-0 grow-0 basis-full",
+        orientation === "horizontal" ? "pl-4" : "pt-4",
+        className
+      ),
+      ...props
+    }
+  );
+});
+CarouselItem.displayName = "CarouselItem";
+var CarouselPrevious = React.forwardRef(({ className, variant = "outline", size = "icon", ...props }, ref) => {
+  const { orientation, scrollPrev, canScrollPrev } = useCarousel();
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      ref,
+      variant,
+      size,
+      className: cn(
+        "absolute h-8 w-8 rounded-full",
+        orientation === "horizontal" ? "-left-12 top-1/2 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
+        className
+      ),
+      disabled: !canScrollPrev,
+      onClick: scrollPrev,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Previous slide" })
+      ]
+    }
+  );
+});
+CarouselPrevious.displayName = "CarouselPrevious";
+var CarouselNext = React.forwardRef(({ className, variant = "outline", size = "icon", ...props }, ref) => {
+  const { orientation, scrollNext, canScrollNext } = useCarousel();
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      ref,
+      variant,
+      size,
+      className: cn(
+        "absolute h-8 w-8 rounded-full",
+        orientation === "horizontal" ? "-right-12 top-1/2 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
+        className
+      ),
+      disabled: !canScrollNext,
+      onClick: scrollNext,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ArrowRight, { className: "h-4 w-4" }),
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Next slide" })
+      ]
+    }
+  );
+});
+CarouselNext.displayName = "CarouselNext";
+
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious };
+//# sourceMappingURL=chunk-OYSLI33V.js.map
+//# sourceMappingURL=chunk-OYSLI33V.js.map

package/dist/chunk-OYSLI33V.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/ui/carousel.tsx"],"names":["api"],"mappings":"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","file":"chunk-OYSLI33V.js","sourcesContent":["import * as React from 'react';\nimport useEmblaCarousel, {\n  type UseEmblaCarouselType,\n} from 'embla-carousel-react';\nimport { ArrowLeft, ArrowRight } from 'lucide-react';\n\nimport { cn } from 'simplycms/ui/utils';\nimport { Button } from './button';\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n  opts?: CarouselOptions;\n  plugins?: CarouselPlugin;\n  orientation?: 'horizontal' | 'vertical';\n  setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n  carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n  api: ReturnType<typeof useEmblaCarousel>[1];\n  scrollPrev: () => void;\n  scrollNext: () => void;\n  canScrollPrev: boolean;\n  canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n  const context = React.useContext(CarouselContext);\n\n  if (!context) {\n    throw new Error('useCarousel must be used within a <Carousel />');\n  }\n\n  return context;\n}\n\nconst Carousel = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & CarouselProps\n>(\n  (\n    {\n      orientation = 'horizontal',\n      opts,\n      setApi,\n      plugins,\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const [carouselRef, api] = useEmblaCarousel(\n      {\n        ...opts,\n        axis: orientation === 'horizontal' ? 'x' : 'y',\n      },\n      plugins,\n    );\n    const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n    const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n    const onSelect = React.useCallback((api: CarouselApi) => {\n      if (!api) {\n        return;\n      }\n\n      setCanScrollPrev(api.canScrollPrev());\n      setCanScrollNext(api.canScrollNext());\n    }, []);\n\n    const scrollPrev = React.useCallback(() => {\n      api?.scrollPrev();\n    }, [api]);\n\n    const scrollNext = React.useCallback(() => {\n      api?.scrollNext();\n    }, [api]);\n\n    const handleKeyDown = React.useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.key === 'ArrowLeft') {\n          event.preventDefault();\n          scrollPrev();\n        } else if (event.key === 'ArrowRight') {\n          event.preventDefault();\n          scrollNext();\n        }\n      },\n      [scrollPrev, scrollNext],\n    );\n\n    React.useEffect(() => {\n      if (!api || !setApi) {\n        return;\n      }\n\n      setApi(api);\n    }, [api, setApi]);\n\n    React.useEffect(() => {\n      if (!api) {\n        return;\n      }\n\n      onSelect(api);\n      api.on('reInit', onSelect);\n      api.on('select', onSelect);\n\n      return () => {\n        api?.off('select', onSelect);\n      };\n    }, [api, onSelect]);\n\n    return (\n      <CarouselContext.Provider\n        value={{\n          carouselRef,\n          api: api,\n          opts,\n          orientation:\n            orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),\n          scrollPrev,\n          scrollNext,\n          canScrollPrev,\n          canScrollNext,\n        }}\n      >\n        <div\n          ref={ref}\n          onKeyDownCapture={handleKeyDown}\n          className={cn('relative', className)}\n          role=\"region\"\n          aria-roledescription=\"carousel\"\n          {...props}\n        >\n          {children}\n        </div>\n      </CarouselContext.Provider>\n    );\n  },\n);\nCarousel.displayName = 'Carousel';\n\nconst CarouselContent = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n  const { carouselRef, orientation } = useCarousel();\n\n  return (\n    <div ref={carouselRef} className=\"overflow-hidden\">\n      <div\n        ref={ref}\n        className={cn(\n          'flex',\n          orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col',\n          className,\n        )}\n        {...props}\n      />\n    </div>\n  );\n});\nCarouselContent.displayName = 'CarouselContent';\n\nconst CarouselItem = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n  const { orientation } = useCarousel();\n\n  return (\n    <div\n      ref={ref}\n      role=\"group\"\n      aria-roledescription=\"slide\"\n      className={cn(\n        'min-w-0 shrink-0 grow-0 basis-full',\n        orientation === 'horizontal' ? 'pl-4' : 'pt-4',\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nCarouselItem.displayName = 'CarouselItem';\n\nconst CarouselPrevious = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof Button>\n>(({ className, variant = 'outline', size = 'icon', ...props }, ref) => {\n  const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n  return (\n    <Button\n      ref={ref}\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute h-8 w-8 rounded-full',\n        orientation === 'horizontal'\n          ? '-left-12 top-1/2 -translate-y-1/2'\n          : '-top-12 left-1/2 -translate-x-1/2 rotate-90',\n        className,\n      )}\n      disabled={!canScrollPrev}\n      onClick={scrollPrev}\n      {...props}\n    >\n      <ArrowLeft className=\"h-4 w-4\" />\n      <span className=\"sr-only\">Previous slide</span>\n    </Button>\n  );\n});\nCarouselPrevious.displayName = 'CarouselPrevious';\n\nconst CarouselNext = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof Button>\n>(({ className, variant = 'outline', size = 'icon', ...props }, ref) => {\n  const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n  return (\n    <Button\n      ref={ref}\n      variant={variant}\n      size={size}\n      className={cn(\n        'absolute h-8 w-8 rounded-full',\n        orientation === 'horizontal'\n          ? '-right-12 top-1/2 -translate-y-1/2'\n          : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',\n        className,\n      )}\n      disabled={!canScrollNext}\n      onClick={scrollNext}\n      {...props}\n    >\n      <ArrowRight className=\"h-4 w-4\" />\n      <span className=\"sr-only\">Next slide</span>\n    </Button>\n  );\n});\nCarouselNext.displayName = 'CarouselNext';\n\nexport {\n  type CarouselApi,\n  Carousel,\n  CarouselContent,\n  CarouselItem,\n  CarouselPrevious,\n  CarouselNext,\n};\n"]}

package/dist/chunk-P6OAVA6S.js

@@ -0,0 +1,301 @@
+import { useState } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import { getSectionFilters } from 'simplycms/core/lib/section-filters';
+import { X } from 'lucide-react';
+import { useT } from 'simplycms/i18n';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/catalog-ui/FilterSidebar.tsx
+function FilterSidebar({
+  sectionId,
+  filters,
+  onFilterChange,
+  priceRange,
+  numericPropertyRanges = {},
+  products = []
+}) {
+  const t = useT();
+  const [localPriceRange, setLocalPriceRange] = useState([
+    priceRange?.min || 0,
+    priceRange?.max || 1e5
+  ]);
+  const [prevPriceRange, setPrevPriceRange] = useState(priceRange);
+  if (priceRange && priceRange !== prevPriceRange) {
+    setPrevPriceRange(priceRange);
+    setLocalPriceRange([priceRange.min, priceRange.max]);
+  }
+  const { data } = useQuery({
+    queryKey: ["section-filters", sectionId],
+    queryFn: () => getSectionFilters({ data: { sectionId } }),
+    enabled: !!sectionId
+  });
+  const filterableProperties = data?.properties ?? [];
+  const propertyOptions = data?.optionsByProperty;
+  const [localNumericRanges, setLocalNumericRanges] = useState({});
+  const [prevNumericRanges, setPrevNumericRanges] = useState(
+    numericPropertyRanges
+  );
+  if (numericPropertyRanges !== prevNumericRanges) {
+    setPrevNumericRanges(numericPropertyRanges);
+    const newRanges = {};
+    Object.entries(numericPropertyRanges).forEach(([code, range]) => {
+      newRanges[code] = [range.min, range.max];
+    });
+    setLocalNumericRanges(newRanges);
+  }
+  const handleCheckboxChange = (propertySlug, optionId, checked) => {
+    const raw = filters[propertySlug];
+    const current = Array.isArray(raw) ? raw : [];
+    const updated = checked ? [...current, optionId] : current.filter((v) => v !== optionId);
+    onFilterChange({
+      ...filters,
+      [propertySlug]: updated.length > 0 ? updated : void 0
+    });
+  };
+  const handlePriceCommit = () => {
+    onFilterChange({
+      ...filters,
+      priceMin: localPriceRange[0],
+      priceMax: localPriceRange[1]
+    });
+  };
+  const handleNumericRangeChange = (propertySlug, values) => {
+    setLocalNumericRanges((prev) => ({
+      ...prev,
+      [propertySlug]: [values[0], values[1]]
+    }));
+  };
+  const handleNumericRangeCommit = (propertySlug) => {
+    const range = localNumericRanges[propertySlug];
+    if (range) {
+      onFilterChange({
+        ...filters,
+        [`${propertySlug}Min`]: range[0],
+        [`${propertySlug}Max`]: range[1]
+      });
+    }
+  };
+  const handleClearFilters = () => {
+    setLocalPriceRange([priceRange?.min || 0, priceRange?.max || 1e5]);
+    const newRanges = {};
+    Object.entries(numericPropertyRanges).forEach(([slug, range]) => {
+      newRanges[slug] = [range.min, range.max];
+    });
+    setLocalNumericRanges(newRanges);
+    onFilterChange({});
+  };
+  const hasActiveFilters = Object.keys(filters).some(
+    (key) => filters[key] !== void 0 && (Array.isArray(filters[key]) ? filters[key].length > 0 : true)
+  );
+  const getOptionsForProperty = (property) => {
+    return propertyOptions?.[property.id] || [];
+  };
+  const getOptionCount = (optionId) => {
+    return products.filter(
+      (product) => product.propertyValues.some((pv) => {
+        if (!pv.option_id) return false;
+        const productOptionIds = pv.option_id.split(",").filter(Boolean);
+        return productOptionIds.includes(optionId);
+      })
+    ).length;
+  };
+  if (!sectionId) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsx("h3", { className: "font-semibold text-lg", children: t("catalog.filters") }),
+      hasActiveFilters && /* @__PURE__ */ jsxs(
+        "button",
+        {
+          className: "text-sm text-muted-foreground hover:text-foreground flex items-center gap-1",
+          onClick: handleClearFilters,
+          children: [
+            /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
+            t("common.reset")
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 py-2 border-b", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "checkbox",
+          id: "inStockOnly",
+          checked: filters.inStockOnly === true,
+          onChange: (e) => onFilterChange({
+            ...filters,
+            inStockOnly: e.target.checked ? true : void 0
+          }),
+          className: "rounded"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "label",
+        {
+          htmlFor: "inStockOnly",
+          className: "text-sm font-normal cursor-pointer",
+          children: t("catalog.filters.inStockOnly")
+        }
+      )
+    ] }),
+    priceRange && /* @__PURE__ */ jsxs("div", { className: "space-y-2 border-b pb-4", children: [
+      /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium", children: t("common.price") }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "number",
+            value: localPriceRange[0],
+            onChange: (e) => {
+              const val = parseInt(e.target.value) || 0;
+              setLocalPriceRange([val, localPriceRange[1]]);
+            },
+            onBlur: handlePriceCommit,
+            className: "h-8 w-full text-sm border rounded px-2"
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2014" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "number",
+            value: localPriceRange[1],
+            onChange: (e) => {
+              const val = parseInt(e.target.value) || priceRange.max;
+              setLocalPriceRange([localPriceRange[0], val]);
+            },
+            onBlur: handlePriceCommit,
+            className: "h-8 w-full text-sm border rounded px-2"
+          }
+        )
+      ] })
+    ] }),
+    filterableProperties.map((property) => {
+      const options = getOptionsForProperty(property);
+      if (property.property_type === "select" || property.property_type === "multiselect" || property.property_type === "color") {
+        return /* @__PURE__ */ jsxs("div", { className: "space-y-2 border-b pb-4", children: [
+          /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium", children: property.name }),
+          options.length > 0 ? (() => {
+            const filterVal = filters[property.slug];
+            const selectedIds = Array.isArray(filterVal) ? filterVal : [];
+            return options.map((option) => {
+              const count = getOptionCount(option.id);
+              return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: "checkbox",
+                    id: `${property.slug}-${option.id}`,
+                    checked: selectedIds.includes(option.id),
+                    onChange: (e) => handleCheckboxChange(
+                      property.slug,
+                      option.id,
+                      e.target.checked
+                    ),
+                    className: "rounded"
+                  }
+                ),
+                property.property_type === "color" && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: "w-4 h-4 rounded-full border",
+                    style: { backgroundColor: option.name }
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "label",
+                  {
+                    htmlFor: `${property.slug}-${option.id}`,
+                    className: "text-sm font-normal cursor-pointer flex-1",
+                    children: option.name
+                  }
+                ),
+                /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+                  "(",
+                  count,
+                  ")"
+                ] })
+              ] }, option.id);
+            });
+          })() : /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: t("catalog.filters.noOptions") })
+        ] }, property.id);
+      }
+      if (property.property_type === "boolean") {
+        return /* @__PURE__ */ jsxs("div", { className: "space-y-2 border-b pb-4", children: [
+          /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium", children: property.name }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "checkbox",
+                id: `${property.slug}-true`,
+                checked: filters[property.slug] === true,
+                onChange: (e) => onFilterChange({
+                  ...filters,
+                  [property.slug]: e.target.checked ? true : void 0
+                }),
+                className: "rounded"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "label",
+              {
+                htmlFor: `${property.slug}-true`,
+                className: "text-sm font-normal cursor-pointer",
+                children: t("common.yes")
+              }
+            )
+          ] })
+        ] }, property.id);
+      }
+      if ((property.property_type === "number" || property.property_type === "range") && numericPropertyRanges[property.slug]) {
+        const range = numericPropertyRanges[property.slug];
+        return /* @__PURE__ */ jsxs("div", { className: "space-y-2 border-b pb-4", children: [
+          /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium", children: property.name }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "number",
+                value: localNumericRanges[property.slug]?.[0] ?? range.min,
+                onChange: (e) => {
+                  const val = parseInt(e.target.value) || range.min;
+                  handleNumericRangeChange(property.slug, [
+                    val,
+                    localNumericRanges[property.slug]?.[1] ?? range.max
+                  ]);
+                },
+                onBlur: () => handleNumericRangeCommit(property.slug),
+                className: "h-8 w-full text-sm border rounded px-2"
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2014" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "number",
+                value: localNumericRanges[property.slug]?.[1] ?? range.max,
+                onChange: (e) => {
+                  const val = parseInt(e.target.value) || range.max;
+                  handleNumericRangeChange(property.slug, [
+                    localNumericRanges[property.slug]?.[0] ?? range.min,
+                    val
+                  ]);
+                },
+                onBlur: () => handleNumericRangeCommit(property.slug),
+                className: "h-8 w-full text-sm border rounded px-2"
+              }
+            )
+          ] })
+        ] }, property.id);
+      }
+      return null;
+    })
+  ] });
+}
+
+export { FilterSidebar };
+//# sourceMappingURL=chunk-P6OAVA6S.js.map
+//# sourceMappingURL=chunk-P6OAVA6S.js.map

package/dist/chunk-P6OAVA6S.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/catalog-ui/FilterSidebar.tsx"],"names":[],"mappings":"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","file":"chunk-P6OAVA6S.js","sourcesContent":["import { useState } from 'react';\nimport { useQuery } from '@tanstack/react-query';\nimport { getSectionFilters } from 'simplycms/core/lib/section-filters';\nimport { X } from 'lucide-react';\nimport { useT } from 'simplycms/i18n';\n\ninterface Property {\n  id: string;\n  name: string;\n  slug: string;\n  property_type: string;\n  is_filterable: boolean;\n}\n\ninterface PropertyOption {\n  id: string;\n  property_id: string;\n  name: string;\n  slug: string;\n  sort_order: number;\n}\n\ninterface ProductForCounting {\n  propertyValues: Array<{\n    property_id: string;\n    option_id?: string | null;\n  }>;\n}\n\n/** Тип значення фільтра */\nexport type FilterValue = boolean | number | string[] | undefined;\n\ninterface FilterSidebarProps {\n  sectionId?: string;\n  filters: Record<string, FilterValue>;\n  onFilterChange: (filters: Record<string, FilterValue>) => void;\n  priceRange?: { min: number; max: number };\n  numericPropertyRanges?: Record<string, { min: number; max: number }>;\n  products?: ProductForCounting[];\n  /** Render UI components - the host app should provide these */\n  renderButton?: (props: Record<string, unknown>) => React.ReactNode;\n  renderCheckbox?: (props: Record<string, unknown>) => React.ReactNode;\n  renderLabel?: (props: Record<string, unknown>) => React.ReactNode;\n  renderSlider?: (props: Record<string, unknown>) => React.ReactNode;\n  renderInput?: (props: Record<string, unknown>) => React.ReactNode;\n  renderAccordion?: (props: Record<string, unknown>) => React.ReactNode;\n}\n\nexport function FilterSidebar({\n  sectionId,\n  filters,\n  onFilterChange,\n  priceRange,\n  numericPropertyRanges = {},\n  products = [],\n}: FilterSidebarProps) {\n  const t = useT();\n  const [localPriceRange, setLocalPriceRange] = useState<[number, number]>([\n    priceRange?.min || 0,\n    priceRange?.max || 100000,\n  ]);\n\n  // Синхронізація діапазону цін при зміні (adjust state during render)\n  const [prevPriceRange, setPrevPriceRange] = useState(priceRange);\n  if (priceRange && priceRange !== prevPriceRange) {\n    setPrevPriceRange(priceRange);\n    setLocalPriceRange([priceRange.min, priceRange.max]);\n  }\n\n  /**\n   * 🔴 Один серверний виклик замість двох послідовних запитів браузера:\n   * другий чекав на перший, бо будував `in (…)` з його ж результату. Тепер\n   * характеристики й опції приходять однією транзакцією.\n   */\n  const { data } = useQuery({\n    queryKey: ['section-filters', sectionId],\n    queryFn: () =>\n      getSectionFilters({ data: { sectionId: sectionId as string } }),\n    enabled: !!sectionId,\n  });\n\n  const filterableProperties: Property[] = data?.properties ?? [];\n  const propertyOptions: Record<string, PropertyOption[]> | undefined =\n    data?.optionsByProperty as Record<string, PropertyOption[]> | undefined;\n\n  const [localNumericRanges, setLocalNumericRanges] = useState<\n    Record<string, [number, number]>\n  >({});\n\n  // Синхронізація числових діапазонів при зміні (adjust state during render)\n  const [prevNumericRanges, setPrevNumericRanges] = useState(\n    numericPropertyRanges,\n  );\n  if (numericPropertyRanges !== prevNumericRanges) {\n    setPrevNumericRanges(numericPropertyRanges);\n    const newRanges: Record<string, [number, number]> = {};\n    Object.entries(numericPropertyRanges).forEach(([code, range]) => {\n      newRanges[code] = [range.min, range.max];\n    });\n    setLocalNumericRanges(newRanges);\n  }\n\n  const handleCheckboxChange = (\n    propertySlug: string,\n    optionId: string,\n    checked: boolean,\n  ) => {\n    const raw = filters[propertySlug];\n    const current = Array.isArray(raw) ? raw : [];\n    const updated = checked\n      ? [...current, optionId]\n      : current.filter((v: string) => v !== optionId);\n\n    onFilterChange({\n      ...filters,\n      [propertySlug]: updated.length > 0 ? updated : undefined,\n    });\n  };\n\n  const handlePriceCommit = () => {\n    onFilterChange({\n      ...filters,\n      priceMin: localPriceRange[0],\n      priceMax: localPriceRange[1],\n    });\n  };\n\n  const handleNumericRangeChange = (propertySlug: string, values: number[]) => {\n    setLocalNumericRanges((prev) => ({\n      ...prev,\n      [propertySlug]: [values[0], values[1]],\n    }));\n  };\n\n  const handleNumericRangeCommit = (propertySlug: string) => {\n    const range = localNumericRanges[propertySlug];\n    if (range) {\n      onFilterChange({\n        ...filters,\n        [`${propertySlug}Min`]: range[0],\n        [`${propertySlug}Max`]: range[1],\n      });\n    }\n  };\n\n  const handleClearFilters = () => {\n    setLocalPriceRange([priceRange?.min || 0, priceRange?.max || 100000]);\n    const newRanges: Record<string, [number, number]> = {};\n    Object.entries(numericPropertyRanges).forEach(([slug, range]) => {\n      newRanges[slug] = [range.min, range.max];\n    });\n    setLocalNumericRanges(newRanges);\n    onFilterChange({});\n  };\n\n  const hasActiveFilters = Object.keys(filters).some(\n    (key) =>\n      filters[key] !== undefined &&\n      (Array.isArray(filters[key]) ? filters[key].length > 0 : true),\n  );\n\n  const getOptionsForProperty = (property: Property): PropertyOption[] => {\n    return propertyOptions?.[property.id] || [];\n  };\n\n  const getOptionCount = (optionId: string): number => {\n    return products.filter((product) =>\n      product.propertyValues.some((pv) => {\n        if (!pv.option_id) return false;\n        const productOptionIds = pv.option_id.split(',').filter(Boolean);\n        return productOptionIds.includes(optionId);\n      }),\n    ).length;\n  };\n\n  if (!sectionId) {\n    return null;\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      <div className=\"flex items-center justify-between\">\n        <h3 className=\"font-semibold text-lg\">{t('catalog.filters')}</h3>\n        {hasActiveFilters && (\n          <button\n            className=\"text-sm text-muted-foreground hover:text-foreground flex items-center gap-1\"\n            onClick={handleClearFilters}\n          >\n            <X className=\"h-4 w-4\" />\n            {t('common.reset')}\n          </button>\n        )}\n      </div>\n\n      {/* In Stock Only filter */}\n      <div className=\"flex items-center gap-2 py-2 border-b\">\n        <input\n          type=\"checkbox\"\n          id=\"inStockOnly\"\n          checked={filters.inStockOnly === true}\n          onChange={(e) =>\n            onFilterChange({\n              ...filters,\n              inStockOnly: e.target.checked ? true : undefined,\n            })\n          }\n          className=\"rounded\"\n        />\n        <label\n          htmlFor=\"inStockOnly\"\n          className=\"text-sm font-normal cursor-pointer\"\n        >\n          {t('catalog.filters.inStockOnly')}\n        </label>\n      </div>\n\n      {/* Price filter */}\n      {priceRange && (\n        <div className=\"space-y-2 border-b pb-4\">\n          <h4 className=\"text-sm font-medium\">{t('common.price')}</h4>\n          <div className=\"flex items-center gap-2\">\n            <input\n              type=\"number\"\n              value={localPriceRange[0]}\n              onChange={(e) => {\n                const val = parseInt(e.target.value) || 0;\n                setLocalPriceRange([val, localPriceRange[1]]);\n              }}\n              onBlur={handlePriceCommit}\n              className=\"h-8 w-full text-sm border rounded px-2\"\n            />\n            <span className=\"text-muted-foreground\">&mdash;</span>\n            <input\n              type=\"number\"\n              value={localPriceRange[1]}\n              onChange={(e) => {\n                const val = parseInt(e.target.value) || priceRange.max;\n                setLocalPriceRange([localPriceRange[0], val]);\n              }}\n              onBlur={handlePriceCommit}\n              className=\"h-8 w-full text-sm border rounded px-2\"\n            />\n          </div>\n        </div>\n      )}\n\n      {/* Property filters */}\n      {filterableProperties.map((property) => {\n        const options = getOptionsForProperty(property);\n\n        if (\n          property.property_type === 'select' ||\n          property.property_type === 'multiselect' ||\n          property.property_type === 'color'\n        ) {\n          return (\n            <div key={property.id} className=\"space-y-2 border-b pb-4\">\n              <h4 className=\"text-sm font-medium\">{property.name}</h4>\n              {options.length > 0 ? (\n                (() => {\n                  const filterVal = filters[property.slug];\n                  const selectedIds = Array.isArray(filterVal) ? filterVal : [];\n                  return options.map((option) => {\n                    const count = getOptionCount(option.id);\n                    return (\n                      <div key={option.id} className=\"flex items-center gap-2\">\n                        <input\n                          type=\"checkbox\"\n                          id={`${property.slug}-${option.id}`}\n                          checked={selectedIds.includes(option.id)}\n                          onChange={(e) =>\n                            handleCheckboxChange(\n                              property.slug,\n                              option.id,\n                              e.target.checked,\n                            )\n                          }\n                          className=\"rounded\"\n                        />\n                        {property.property_type === 'color' && (\n                          <div\n                            className=\"w-4 h-4 rounded-full border\"\n                            style={{ backgroundColor: option.name }}\n                          />\n                        )}\n                        <label\n                          htmlFor={`${property.slug}-${option.id}`}\n                          className=\"text-sm font-normal cursor-pointer flex-1\"\n                        >\n                          {option.name}\n                        </label>\n                        <span className=\"text-xs text-muted-foreground\">\n                          ({count})\n                        </span>\n                      </div>\n                    );\n                  });\n                })()\n              ) : (\n                <p className=\"text-sm text-muted-foreground\">\n                  {t('catalog.filters.noOptions')}\n                </p>\n              )}\n            </div>\n          );\n        }\n\n        if (property.property_type === 'boolean') {\n          return (\n            <div key={property.id} className=\"space-y-2 border-b pb-4\">\n              <h4 className=\"text-sm font-medium\">{property.name}</h4>\n              <div className=\"flex items-center gap-2\">\n                <input\n                  type=\"checkbox\"\n                  id={`${property.slug}-true`}\n                  checked={filters[property.slug] === true}\n                  onChange={(e) =>\n                    onFilterChange({\n                      ...filters,\n                      [property.slug]: e.target.checked ? true : undefined,\n                    })\n                  }\n                  className=\"rounded\"\n                />\n                <label\n                  htmlFor={`${property.slug}-true`}\n                  className=\"text-sm font-normal cursor-pointer\"\n                >\n                  {t('common.yes')}\n                </label>\n              </div>\n            </div>\n          );\n        }\n\n        if (\n          (property.property_type === 'number' ||\n            property.property_type === 'range') &&\n          numericPropertyRanges[property.slug]\n        ) {\n          const range = numericPropertyRanges[property.slug];\n          return (\n            <div key={property.id} className=\"space-y-2 border-b pb-4\">\n              <h4 className=\"text-sm font-medium\">{property.name}</h4>\n              <div className=\"flex items-center gap-2\">\n                <input\n                  type=\"number\"\n                  value={localNumericRanges[property.slug]?.[0] ?? range.min}\n                  onChange={(e) => {\n                    const val = parseInt(e.target.value) || range.min;\n                    handleNumericRangeChange(property.slug, [\n                      val,\n                      localNumericRanges[property.slug]?.[1] ?? range.max,\n                    ]);\n                  }}\n                  onBlur={() => handleNumericRangeCommit(property.slug)}\n                  className=\"h-8 w-full text-sm border rounded px-2\"\n                />\n                <span className=\"text-muted-foreground\">&mdash;</span>\n                <input\n                  type=\"number\"\n                  value={localNumericRanges[property.slug]?.[1] ?? range.max}\n                  onChange={(e) => {\n                    const val = parseInt(e.target.value) || range.max;\n                    handleNumericRangeChange(property.slug, [\n                      localNumericRanges[property.slug]?.[0] ?? range.min,\n                      val,\n                    ]);\n                  }}\n                  onBlur={() => handleNumericRangeCommit(property.slug)}\n                  className=\"h-8 w-full text-sm border rounded px-2\"\n                />\n              </div>\n            </div>\n          );\n        }\n\n        return null;\n      })}\n    </div>\n  );\n}\n"]}