unifyedx-storybook-new 0.1.4 → 0.1.5

package/dist/unifyedx-storybook-new.es.js

@@ -43082,6 +43082,57 @@ function requireDebounce () {
 	return debounce_1;
 }
 
-requireDebounce();
+var debounceExports = requireDebounce();
+const debounce = /*@__PURE__*/getDefaultExportFromCjs(debounceExports);
+
+const SearchBar = ({
+  value = "",
+  onDebouncedChange,
+  debounceDelay = 400,
+  placeholder = "Enter text...",
+  label = "Search",
+  // Added a default label for accessibility
+  customClass = "",
+  ...inputProps
+}) => {
+  const [inputValue, setInputValue] = useState(value);
+  useEffect(() => {
+    setInputValue(value);
+  }, [value]);
+  const debouncedHandler = useCallback(
+    debounce((nextValue) => {
+      onDebouncedChange?.(nextValue);
+    }, debounceDelay),
+    [debounceDelay, onDebouncedChange]
+  );
+  useEffect(() => {
+    if (inputValue !== value) {
+      debouncedHandler(inputValue);
+    }
+    return () => {
+      debouncedHandler.cancel();
+    };
+  }, [inputValue, debouncedHandler, value]);
+  const handleChange = (event) => {
+    setInputValue(event.target.value);
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `search-bar-wrapper ${customClass}`, children: [
+    label && /* @__PURE__ */ jsxRuntimeExports.jsx("label", { htmlFor: "search-field", className: "sr-only", children: label }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "search-bar-icon-wrapper", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Search, { size: 20, className: "search-bar-icon", "aria-hidden": "true" }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "input",
+      {
+        id: "search-field",
+        className: "search-bar-input",
+        placeholder,
+        type: "search",
+        name: "search",
+        value: inputValue,
+        onChange: handleChange,
+        ...inputProps
+      }
+    )
+  ] });
+};
 
-export { Avatar, AvatarGroup, Badge, Breadcrumbs, Button$1 as Button, Checkbox, DatePicker, DateRangePicker$1 as DateRangePicker, FileUploadModal, FullScreenLoader, GenericFilter, Input, Modal, Pagination, RadioGroup, Select, Sidebar, Spinner, Textarea, ToggleSwitch, Tooltip, WizardModal };
+export { Avatar, AvatarGroup, Badge, Breadcrumbs, Button$1 as Button, Checkbox, DatePicker, DateRangePicker$1 as DateRangePicker, FileUploadModal, FullScreenLoader, GenericFilter, Input, Modal, Pagination, RadioGroup, SearchBar, Select, Sidebar, Spinner, Textarea, ToggleSwitch, Tooltip, WizardModal };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "unifyedx-storybook-new",
   "private": false,
-  "version": "0.1.4",
+  "version": "0.1.5",
   "type": "module",
   "main": "dist/unifyedx-storybook-new.es.js",
   "module": "dist/unifyedx-storybook-new.es.js",