design-zystem 1.0.472 → 1.0.473

package/dist/ui/index.d.mts

@@ -608,6 +608,9 @@ interface SelectSharedProps {
     disabled?: boolean;
     /** Masque la barre de recherche — affichée par défaut. */
     hideSearchBar?: boolean;
+    searchPlaceholder?: string;
+    /** Appelé à chaque frappe dans la recherche, et avec '' à la fermeture. */
+    onSearchChange?: (term: string) => void;
     size?: 'm' | 's';
     className?: string;
 }

package/dist/ui/index.d.ts

@@ -608,6 +608,9 @@ interface SelectSharedProps {
     disabled?: boolean;
     /** Masque la barre de recherche — affichée par défaut. */
     hideSearchBar?: boolean;
+    searchPlaceholder?: string;
+    /** Appelé à chaque frappe dans la recherche, et avec '' à la fermeture. */
+    onSearchChange?: (term: string) => void;
     size?: 'm' | 's';
     className?: string;
 }

package/dist/ui/index.js

@@ -3153,13 +3153,14 @@ var OptionHint = ({ hint }) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("sp
 var SearchField = ({
   searchInputRef,
   searchTerm,
-  setSearchTerm
+  setSearchTerm,
+  placeholder = "Rechercher..."
 }) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
   "input",
   __spreadProps(__spreadValues({
     ref: searchInputRef,
     type: "text",
-    placeholder: "Rechercher..."
+    placeholder
   }, noAutofillProps), {
     value: searchTerm,
     onChange: (e) => setSearchTerm(e.target.value),
@@ -3178,12 +3179,18 @@ var SelectField = (props) => {
     required,
     disabled,
     hideSearchBar = false,
+    searchPlaceholder,
+    onSearchChange,
     size = "m",
     className
   } = props;
   const triggerClass = cn(TRIGGER_CLASS, TRIGGER_SIZE_CLASS[size], className);
   const [open, setOpen] = (0, import_react26.useState)(false);
-  const [searchTerm, setSearchTerm] = (0, import_react26.useState)("");
+  const [searchTerm, setSearchTermState] = (0, import_react26.useState)("");
+  const setSearchTerm = (term) => {
+    setSearchTermState(term);
+    onSearchChange == null ? void 0 : onSearchChange(term);
+  };
   const searchInputRef = (0, import_react26.useRef)(null);
   const sections = filterSelectItems(options, searchTerm);
   const isEmpty = sections.length === 0;
@@ -3254,7 +3261,8 @@ var SelectField = (props) => {
                 {
                   searchInputRef,
                   searchTerm,
-                  setSearchTerm
+                  setSearchTerm,
+                  placeholder: searchPlaceholder
                 }
               ),
               /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "overflow-y-auto", children: [
@@ -3367,7 +3375,8 @@ var SelectField = (props) => {
                   {
                     searchInputRef,
                     searchTerm,
-                    setSearchTerm
+                    setSearchTerm,
+                    placeholder: searchPlaceholder
                   }
                 ),
                 /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(RadixSelect2.Viewport, { children: [

package/dist/ui/index.mjs

@@ -2931,13 +2931,14 @@ var OptionHint = ({ hint }) => /* @__PURE__ */ jsx35("span", { className: "ml-au
 var SearchField = ({
   searchInputRef,
   searchTerm,
-  setSearchTerm
+  setSearchTerm,
+  placeholder = "Rechercher..."
 }) => /* @__PURE__ */ jsx35(
   "input",
   __spreadProps(__spreadValues({
     ref: searchInputRef,
     type: "text",
-    placeholder: "Rechercher..."
+    placeholder
   }, noAutofillProps), {
     value: searchTerm,
     onChange: (e) => setSearchTerm(e.target.value),
@@ -2956,12 +2957,18 @@ var SelectField = (props) => {
     required,
     disabled,
     hideSearchBar = false,
+    searchPlaceholder,
+    onSearchChange,
     size = "m",
     className
   } = props;
   const triggerClass = cn(TRIGGER_CLASS, TRIGGER_SIZE_CLASS[size], className);
   const [open, setOpen] = useState5(false);
-  const [searchTerm, setSearchTerm] = useState5("");
+  const [searchTerm, setSearchTermState] = useState5("");
+  const setSearchTerm = (term) => {
+    setSearchTermState(term);
+    onSearchChange == null ? void 0 : onSearchChange(term);
+  };
   const searchInputRef = useRef5(null);
   const sections = filterSelectItems(options, searchTerm);
   const isEmpty = sections.length === 0;
@@ -3032,7 +3039,8 @@ var SelectField = (props) => {
                 {
                   searchInputRef,
                   searchTerm,
-                  setSearchTerm
+                  setSearchTerm,
+                  placeholder: searchPlaceholder
                 }
               ),
               /* @__PURE__ */ jsxs17("div", { className: "overflow-y-auto", children: [
@@ -3145,7 +3153,8 @@ var SelectField = (props) => {
                   {
                     searchInputRef,
                     searchTerm,
-                    setSearchTerm
+                    setSearchTerm,
+                    placeholder: searchPlaceholder
                   }
                 ),
                 /* @__PURE__ */ jsxs17(RadixSelect2.Viewport, { children: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "design-zystem",
-  "version": "1.0.472",
+  "version": "1.0.473",
   "description": "A React design system of importable components",
   "main": "dist/index.js",
   "module": "dist/index.mjs",