first commit

2025-06-26 06:59:59 +03:00
commit d44874775c
450 changed files with 76635 additions and 0 deletions
--- a/src/components/CatalogSortDropdown.tsx
+++ b/src/components/CatalogSortDropdown.tsx
@ -0,0 +1,75 @@
+import React, { useState, useRef, useEffect } from 'react';
+
+interface CatalogSortDropdownProps {
+  active: number;
+  onChange: (index: number) => void;
+}
+
+const sortOptions = [
+  'По популярности',
+  'Сначала дешевле',
+  'Сначала дороже',
+  'Высокий рейтинг',
+];
+
+const CatalogSortDropdown: React.FC<CatalogSortDropdownProps> = ({ active, onChange }) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const dropdownRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    function handleClick(e: MouseEvent) {
+      if (dropdownRef.current && !dropdownRef.current.contains(e.target as Node)) {
+        setIsOpen(false);
+      }
+    }
+    if (isOpen) document.addEventListener('mousedown', handleClick);
+    return () => document.removeEventListener('mousedown', handleClick);
+  }, [isOpen]);
+
+  return (
+    <div
+      data-hover="false"
+      data-delay="0"
+      className="dropdown-2 w-dropdown desktop-only"
+      ref={dropdownRef}
+    >
+      <div
+        className="flex-block-85 w-dropdown-toggle"
+        onClick={() => setIsOpen((v) => !v)}
+        tabIndex={0}
+        role="button"
+        aria-haspopup="listbox"
+        aria-expanded={isOpen}
+      >
+        <div className="code-embed-9 w-embed">
+          <svg width="currentwidth" height="currentheight" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M3 16L7 20L11 16" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+            <path d="M7 20V4" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+            <path d="M21 8L17 4L13 8" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+            <path d="M17 4V20" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+          </svg>
+        </div>
+        <div>Сортировка</div>
+      </div>
+      <nav className={`dropdown-list-2 w-dropdown-list${isOpen ? ' w--open' : ''}`} style={{ minWidth: 180, whiteSpace: 'normal' }}>
+        {sortOptions.map((option, index) => (
+          <a
+            key={index}
+            href="#"
+            className={`w-dropdown-link${active === index ? ' w--current' : ''}`}
+            tabIndex={0}
+            onClick={e => {
+              e.preventDefault();
+              onChange(index);
+              setIsOpen(false);
+            }}
+          >
+            {option}
+          </a>
+        ))}
+      </nav>
+    </div>
+  );
+};
+
+export default CatalogSortDropdown;