willba-component-library 0.0.9 → 0.0.10

package/dist/cjs/index.js

@@ -2522,95 +2522,125 @@ const Button = (props) => {
 };
 
 function FilterBar() {
-    const [selectedFilter, setSelectedFilter] = reactExports.useState(false);
+    //const [selectedFilter, setSelectedFilter] = useState<number | boolean>(false)
     // const [startDate, setStartDate] = useState(0);
     // const [endDate, setEndDate] = useState(0);
-    const [guestsAdults, setGuestsAdults] = reactExports.useState(0);
-    const [guestsKids, setGuestsKids] = reactExports.useState(0);
-    const [categories, setCategories] = reactExports.useState(0);
-    const handleSelectedFilter = (id) => {
-        setSelectedFilter(id);
-    };
-    const handleSubmit = () => {
-        const queryParams = new URLSearchParams();
-        const params = {
-            // startDate,
-            // endDate,
-            guestsAdults,
-            guestsKids,
-            categories,
-        };
-        for (const [key, value] of Object.entries(params)) {
-            if (value) {
-                queryParams.append(key, value.toString());
-            }
-        }
-        const url = `http://localhost:4000/en/events/?${queryParams.toString()}`;
-        window.location.href = url;
-        handleSelectedFilter(false);
-    };
+    //const [guestsAdults, setGuestsAdults] = useState(0)
+    //const [guestsKids, setGuestsKids] = useState(0)
+    //const [categories, setCategories] = useState(0)
+    // const handleSelectedFilter = (id: any) => {
+    //   setSelectedFilter(id)
+    // }
+    // const handleSubmit = () => {
+    //   const queryParams = new URLSearchParams()
+    //   const params = {
+    //     // startDate,
+    //     // endDate,
+    //     guestsAdults,
+    //     guestsKids,
+    //     categories,
+    //   }
+    //   for (const [key, value] of Object.entries(params)) {
+    //     if (value) {
+    //       queryParams.append(key, value.toString())
+    //     }
+    //   }
+    //   const url = `http://localhost:4000/en/events/?${queryParams.toString()}`
+    //   window.location.href = url
+    //   handleSelectedFilter(false)
+    // }
     return (React.createElement("div", { className: "search-widget" },
         React.createElement("div", { className: "search-widget-header" },
-            React.createElement(SelectButton, { label: "Start date", onClick: () => handleSelectedFilter(1) }),
             React.createElement(Divider, null),
-            React.createElement(SelectButton, { label: "End date", onClick: () => handleSelectedFilter(2) }),
             React.createElement(Divider, null),
-            React.createElement(SelectButton, { label: "Guests", onClick: () => handleSelectedFilter(3) }),
-            React.createElement(Divider, null),
-            React.createElement(SelectButton, { label: "Categories", onClick: () => handleSelectedFilter(4) }),
-            React.createElement(SubmitButton, { onClick: handleSubmit })),
-        selectedFilter && (React.createElement("div", { className: "search-widget-container" },
-            selectedFilter === 1 && React.createElement(StartDate, null),
-            selectedFilter === 2 && React.createElement(EndDate, null),
-            selectedFilter === 3 && (React.createElement(Guests, { guestsAdults: guestsAdults, guestsKids: guestsKids, decrementAdults: () => setGuestsAdults(guestsAdults - 1), incrementAdults: () => setGuestsAdults(guestsAdults + 1), decrementKids: () => setGuestsKids(guestsKids - 1), incrementKids: () => setGuestsKids(guestsKids + 1) })),
-            selectedFilter === 4 && (React.createElement(Categories, { categories: categories, setCategories: setCategories }))))));
+            React.createElement(Divider, null))));
 }
 const Divider = () => {
     return React.createElement("div", { className: "search-widget-divider" });
 };
-const SubmitButton = ({ onClick }) => {
-    return (React.createElement("button", { className: "search-widget-submit-button", onClick: onClick }, "Apply filters"));
-};
-const SelectButton = ({ label, onClick }) => {
-    return (React.createElement("button", { className: "search-widget-select-button", onClick: onClick }, label));
-};
-const StartDate = () => {
-    return React.createElement("div", null, "Start date");
-};
-const EndDate = () => {
-    return React.createElement("div", null, "End date");
-};
-const Guests = ({ guestsAdults, guestsKids, decrementAdults, incrementAdults, decrementKids, incrementKids, }) => {
-    return (React.createElement("div", { className: "search-widget-guests" },
-        React.createElement("h3", null, "Guests"),
-        React.createElement("p", null, "Who's coming?"),
-        React.createElement("div", { className: "guests-filter-container" },
-            React.createElement("div", { className: "guests-filter-inner" },
-                React.createElement("span", null, "Adults"),
-                React.createElement("div", null,
-                    React.createElement("button", { onClick: decrementAdults, disabled: guestsAdults < 1 }, "-"),
-                    React.createElement("span", null, guestsAdults),
-                    React.createElement("button", { onClick: incrementAdults }, "+"))),
-            React.createElement("div", { className: "guests-filter-inner" },
-                React.createElement("span", null, "Kids"),
-                React.createElement("div", null,
-                    React.createElement("button", { onClick: decrementKids, disabled: guestsKids < 1 }, "-"),
-                    React.createElement("span", null, guestsKids),
-                    React.createElement("button", { onClick: incrementKids }, "+"))))));
-};
-const Categories = ({ categories, setCategories }) => {
-    const categoriesPlaceholder = ['Weekend', 'Week', 'Summer camp', 'Winter camp'];
-    const [selectedCategory, setSelectedCategory] = reactExports.useState('');
-    const handleCategoryChange = (selectedCategory) => {
-        setSelectedCategory(selectedCategory);
-        setCategories(selectedCategory); // Update the parent component's state with the selected category
-    };
-    return (React.createElement("div", { className: "search-widget-categories" },
-        React.createElement("h3", null, "CATEGORY"),
-        React.createElement("div", { className: "categories-filter-inner" }, categoriesPlaceholder.map((itm, idx) => (React.createElement("div", { key: idx },
-            React.createElement("input", { type: "radio", value: itm, checked: selectedCategory === itm, onChange: () => handleCategoryChange(itm) }),
-            React.createElement("span", null, itm)))))));
-};
+// const SubmitButton = ({ onClick }: any) => {
+//   return (
+//     <button className="search-widget-submit-button" onClick={onClick}>
+//       Apply filters
+//     </button>
+//   )
+// }
+// const SelectButton = ({ label, onClick }: any) => {
+//   return (
+//     <button className="search-widget-select-button" onClick={onClick}>
+//       {label}
+//     </button>
+//   )
+// }
+// const StartDate = () => {
+//   return <div>Start date</div>
+// }
+// const EndDate = () => {
+//   return <div>End date</div>
+// }
+// const Guests = ({
+//   guestsAdults,
+//   guestsKids,
+//   decrementAdults,
+//   incrementAdults,
+//   decrementKids,
+//   incrementKids,
+// }: any) => {
+//   return (
+//     <div className="search-widget-guests">
+//       <h3>Guests</h3>
+//       <p>Who's coming?</p>
+//       <div className="guests-filter-container">
+//         <div className="guests-filter-inner">
+//           <span>Adults</span>
+//           <div>
+//             <button onClick={decrementAdults} disabled={guestsAdults < 1}>
+//               -
+//             </button>
+//             <span>{guestsAdults}</span>
+//             <button onClick={incrementAdults}>+</button>
+//           </div>
+//         </div>
+//         <div className="guests-filter-inner">
+//           <span>Kids</span>
+//           <div>
+//             <button onClick={decrementKids} disabled={guestsKids < 1}>
+//               -
+//             </button>
+//             <span>{guestsKids}</span>
+//             <button onClick={incrementKids}>+</button>
+//           </div>
+//         </div>
+//       </div>
+//     </div>
+//   )
+// }
+// const Categories = ({ categories, setCategories }: any) => {
+//   const categoriesPlaceholder = ['Weekend', 'Week', 'Summer camp', 'Winter camp']
+//   const [selectedCategory, setSelectedCategory] = useState('')
+//   const handleCategoryChange = (selectedCategory: any) => {
+//     setSelectedCategory(selectedCategory)
+//     setCategories(selectedCategory) // Update the parent component's state with the selected category
+//   }
+//   return (
+//     <div className="search-widget-categories">
+//       <h3>CATEGORY</h3>
+//       <div className="categories-filter-inner">
+//         {categoriesPlaceholder.map((itm, idx) => (
+//           <div key={idx}>
+//             <input
+//               type="radio"
+//               value={itm}
+//               checked={selectedCategory === itm}
+//               onChange={() => handleCategoryChange(itm)}
+//             />
+//             <span>{itm}</span>
+//           </div>
+//         ))}
+//       </div>
+//     </div>
+//   )
+// }
 
 exports.Button = Button;
 exports.FilterBar = FilterBar;