ynotsoft-dynamic-form 1.0.72 → 1.0.75

package/dist/dynamic-form.js

@@ -193,7 +193,7 @@ function al({
     async (y) => {
       if (!e.optionsUrl && !e.onSearch)
         return g;
-      const U = e.minSearchLength || 0;
+      const U = e.minSearchLength || 2;
       if (y.length < U && U > 0)
         return g;
       m(!0);
@@ -216,7 +216,7 @@ function al({
         m(!1);
       }
     },
-    [e, g]
+    [e, g, i, t]
   );
   zt(() => {
     v && T.current && T.current.focus(), v && g.length === 0 && (e.optionsUrl || e.onSearch) && Y("");

package/dist/dynamic-form.umd.cjs

@@ -6,7 +6,7 @@
                         `,valueContainer:()=>"py-0.5 px-2",placeholder:()=>"text-gray-400",dropdownIndicator:()=>"!text-gray-400 hover:!text-gray-600",multiValue:()=>"!bg-blue-100 !text-blue-800 !rounded-md",multiValueLabel:()=>"!text-blue-800 !pr-1",multiValueRemove:()=>"!text-blue-500 hover:!bg-blue-200 hover:!text-blue-700 !rounded-r-md",menu:()=>"!shadow-lg !rounded-lg !mt-2 !z-50",option:h=>`!py-2 !px-3 !text-sm !cursor-pointer 
                         ${h.isSelected?"!bg-blue-500 !text-white":""}
                         ${h.isFocused&&!h.isSelected?"!bg-gray-100 !text-gray-800":""}
-                        `}})})}const Si=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),Ci=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(t,n,r)=>r?r.toUpperCase():n.toLowerCase()),Yr=e=>{const t=Ci(e);return t.charAt(0).toUpperCase()+t.slice(1)},Kr=(...e)=>e.filter((t,n,r)=>!!t&&t.trim()!==""&&r.indexOf(t)===n).join(" ").trim(),Ei=e=>{for(const t in e)if(t.startsWith("aria-")||t==="role"||t==="title")return!0};var Ai={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};const Ni=j.forwardRef(({color:e="currentColor",size:t=24,strokeWidth:n=2,absoluteStrokeWidth:r,className:o="",children:s,iconNode:a,...i},c)=>j.createElement("svg",{ref:c,...Ai,width:t,height:t,stroke:e,strokeWidth:r?Number(n)*24/Number(t):n,className:Kr("lucide",o),...!s&&!Ei(i)&&{"aria-hidden":"true"},...i},[...a.map(([d,f])=>j.createElement(d,f)),...Array.isArray(s)?s:[s]]));const Te=(e,t)=>{const n=j.forwardRef(({className:r,...o},s)=>j.createElement(Ni,{ref:s,iconNode:t,className:Kr(`lucide-${Si(Yr(e))}`,`lucide-${e}`,r),...o}));return n.displayName=Yr(e),n};const Ti=Te("check",[["path",{d:"M20 6 9 17l-5-5",key:"1gmf2c"}]]);const qr=Te("chevron-down",[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]]);const ki=Te("circle-alert",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["line",{x1:"12",x2:"12",y1:"8",y2:"12",key:"1pkeuh"}],["line",{x1:"12",x2:"12.01",y1:"16",y2:"16",key:"4dfq90"}]]);const Pi=Te("circle-check",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"m9 12 2 2 4-4",key:"dzmm74"}]]);const _i=Te("circle-x",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"m15 9-6 6",key:"1uzhvr"}],["path",{d:"m9 9 6 6",key:"z0biqf"}]]);const Oi=Te("circle",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}]]);const Ii=Te("cloud-upload",[["path",{d:"M12 13v8",key:"1l5pq0"}],["path",{d:"M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242",key:"1pljnt"}],["path",{d:"m8 17 4-4 4 4",key:"1quai1"}]]);const Mi=Te("info",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"M12 16v-4",key:"1dtifu"}],["path",{d:"M12 8h.01",key:"e9boi3"}]]);const Xr=Te("loader-circle",[["path",{d:"M21 12a9 9 0 1 1-6.219-8.56",key:"13zald"}]]);const Di=Te("search",[["path",{d:"m21 21-4.34-4.34",key:"14j7rj"}],["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}]]);const Zr=Te("x",[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]]);function Li({field:e,formValues:t,handleChange:n,handleBlur:r,error:o,disabled:s,apiClient:a}){const i=e.disabled&&typeof e.disabled=="function"?e.disabled(t):e.disabled,c=s||i,f=(e.layout||"inline")==="dialog",p=e.selectMode==="single",[g,h]=j.useState(e.options||[]),[S,m]=j.useState(!1),[v,C]=j.useState(!1),[E,A]=j.useState(""),[x,T]=j.useState({}),D=j.useRef(null),O=j.useRef(null),k=j.useRef(null),W=t[e.name]||[],G=y=>Array.isArray(y)&&y.length>0&&typeof y[0]=="object"&&y[0]!==null&&"value"in y[0];let R=[];W&&W.length>0&&(G(W)?R=W:R=W.filter(y=>y!=null).map(y=>{const B=g.find(V=>V.value===y);return B||(x[y]?x[y]:{value:y,label:`Loading... (${y})`})}).filter(y=>y!==void 0)),j.useEffect(()=>{const y=B=>{O.current&&!O.current.contains(B.target)&&(C(!1),r(e.name))};return document.addEventListener("mousedown",y),()=>document.removeEventListener("mousedown",y)},[e.name,r]);const Y=j.useCallback(async y=>{if(!e.optionsUrl&&!e.onSearch)return g;const B=e.minSearchLength||0;if(y.length<B&&B>0)return g;m(!0);try{let V=[];if(e.onSearch&&typeof e.onSearch=="function")V=await e.onSearch(y,t);else if(e.optionsUrl&&a){const K=e.searchParam||"search",ee=e.optionsUrl.includes("?")?`${e.optionsUrl}&${K}=${encodeURIComponent(y)}`:`${e.optionsUrl}?${K}=${encodeURIComponent(y)}`,H=await a(ee);V=H.data||H,e.transformResponse&&typeof e.transformResponse=="function"&&(V=e.transformResponse(V))}return h(V),V}catch(V){return console.error(`Search failed for ${e.name}:`,V),g}finally{m(!1)}},[e,g]);j.useEffect(()=>{v&&k.current&&k.current.focus(),v&&g.length===0&&(e.optionsUrl||e.onSearch)&&Y("")},[v,g.length,e.optionsUrl,e.onSearch,Y]);const w=j.useCallback(y=>{A(y),D.current&&clearTimeout(D.current);const B=e.debounceDelay||300;D.current=setTimeout(()=>{Y(y)},B)},[Y,e.debounceDelay]),N=y=>{const B=R.some(ee=>ee.value===y.value);let V;p?B?(V=[],T(ee=>{const H={...ee};return delete H[y.value],H})):(V=[y],T({[y.value]:y}),C(!1)):B?(V=R.filter(ee=>ee.value!==y.value),T(ee=>{const H={...ee};return delete H[y.value],H})):(V=[...R,y],T(ee=>({...ee,[y.value]:y})));const K=V.map(ee=>ee.value);n(e.name,K),e.clearSearchOnSelect&&A("")},_=(y,B)=>{B.stopPropagation();const K=R.filter(ee=>ee.value!==y).map(ee=>ee.value);n(e.name,K),T(ee=>{const H={...ee};return delete H[y],H})},P=g.filter(y=>E?y.label.toLowerCase().includes(E.toLowerCase()):!0),I=()=>l.jsxs(l.Fragment,{children:[l.jsx("div",{className:"p-3 border-b border-gray-200",children:l.jsxs("div",{className:"relative",children:[l.jsx(Di,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400"}),l.jsx("input",{ref:k,type:"text",value:E,onChange:y=>w(y.target.value),placeholder:e.optionsUrl||e.onSearch?"Type to search...":"Search options...",className:"w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"})]})}),l.jsx("div",{className:`overflow-y-auto p-2 max-h-96 flex flex-col gap-0.5 ${f?"max-h-96":"max-h-60"}`,children:S?l.jsxs("div",{className:"py-8 text-center text-gray-500 text-sm",children:[l.jsx(Xr,{className:"w-5 h-5 mx-auto mb-2 animate-spin"}),"Searching..."]}):P.length>0?P.map(y=>{const B=R.some(V=>V.value===y.value);return l.jsxs("div",{onClick:()=>N(y),className:`
+                        `}})})}const Si=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase(),Ci=e=>e.replace(/^([A-Z])|[\s-_]+(\w)/g,(t,n,r)=>r?r.toUpperCase():n.toLowerCase()),Yr=e=>{const t=Ci(e);return t.charAt(0).toUpperCase()+t.slice(1)},Kr=(...e)=>e.filter((t,n,r)=>!!t&&t.trim()!==""&&r.indexOf(t)===n).join(" ").trim(),Ei=e=>{for(const t in e)if(t.startsWith("aria-")||t==="role"||t==="title")return!0};var Ai={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};const Ni=j.forwardRef(({color:e="currentColor",size:t=24,strokeWidth:n=2,absoluteStrokeWidth:r,className:o="",children:s,iconNode:a,...i},c)=>j.createElement("svg",{ref:c,...Ai,width:t,height:t,stroke:e,strokeWidth:r?Number(n)*24/Number(t):n,className:Kr("lucide",o),...!s&&!Ei(i)&&{"aria-hidden":"true"},...i},[...a.map(([d,f])=>j.createElement(d,f)),...Array.isArray(s)?s:[s]]));const Te=(e,t)=>{const n=j.forwardRef(({className:r,...o},s)=>j.createElement(Ni,{ref:s,iconNode:t,className:Kr(`lucide-${Si(Yr(e))}`,`lucide-${e}`,r),...o}));return n.displayName=Yr(e),n};const Ti=Te("check",[["path",{d:"M20 6 9 17l-5-5",key:"1gmf2c"}]]);const qr=Te("chevron-down",[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]]);const ki=Te("circle-alert",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["line",{x1:"12",x2:"12",y1:"8",y2:"12",key:"1pkeuh"}],["line",{x1:"12",x2:"12.01",y1:"16",y2:"16",key:"4dfq90"}]]);const Pi=Te("circle-check",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"m9 12 2 2 4-4",key:"dzmm74"}]]);const _i=Te("circle-x",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"m15 9-6 6",key:"1uzhvr"}],["path",{d:"m9 9 6 6",key:"z0biqf"}]]);const Oi=Te("circle",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}]]);const Ii=Te("cloud-upload",[["path",{d:"M12 13v8",key:"1l5pq0"}],["path",{d:"M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242",key:"1pljnt"}],["path",{d:"m8 17 4-4 4 4",key:"1quai1"}]]);const Mi=Te("info",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"M12 16v-4",key:"1dtifu"}],["path",{d:"M12 8h.01",key:"e9boi3"}]]);const Xr=Te("loader-circle",[["path",{d:"M21 12a9 9 0 1 1-6.219-8.56",key:"13zald"}]]);const Di=Te("search",[["path",{d:"m21 21-4.34-4.34",key:"14j7rj"}],["circle",{cx:"11",cy:"11",r:"8",key:"4ej97u"}]]);const Zr=Te("x",[["path",{d:"M18 6 6 18",key:"1bl5f8"}],["path",{d:"m6 6 12 12",key:"d8bk6v"}]]);function Li({field:e,formValues:t,handleChange:n,handleBlur:r,error:o,disabled:s,apiClient:a}){const i=e.disabled&&typeof e.disabled=="function"?e.disabled(t):e.disabled,c=s||i,f=(e.layout||"inline")==="dialog",p=e.selectMode==="single",[g,h]=j.useState(e.options||[]),[S,m]=j.useState(!1),[v,C]=j.useState(!1),[E,A]=j.useState(""),[x,T]=j.useState({}),D=j.useRef(null),O=j.useRef(null),k=j.useRef(null),W=t[e.name]||[],G=y=>Array.isArray(y)&&y.length>0&&typeof y[0]=="object"&&y[0]!==null&&"value"in y[0];let R=[];W&&W.length>0&&(G(W)?R=W:R=W.filter(y=>y!=null).map(y=>{const B=g.find(V=>V.value===y);return B||(x[y]?x[y]:{value:y,label:`Loading... (${y})`})}).filter(y=>y!==void 0)),j.useEffect(()=>{const y=B=>{O.current&&!O.current.contains(B.target)&&(C(!1),r(e.name))};return document.addEventListener("mousedown",y),()=>document.removeEventListener("mousedown",y)},[e.name,r]);const Y=j.useCallback(async y=>{if(!e.optionsUrl&&!e.onSearch)return g;const B=e.minSearchLength||2;if(y.length<B&&B>0)return g;m(!0);try{let V=[];if(e.onSearch&&typeof e.onSearch=="function")V=await e.onSearch(y,t);else if(e.optionsUrl&&a){const K=e.searchParam||"search",ee=e.optionsUrl.includes("?")?`${e.optionsUrl}&${K}=${encodeURIComponent(y)}`:`${e.optionsUrl}?${K}=${encodeURIComponent(y)}`,H=await a(ee);V=H.data||H,e.transformResponse&&typeof e.transformResponse=="function"&&(V=e.transformResponse(V))}return h(V),V}catch(V){return console.error(`Search failed for ${e.name}:`,V),g}finally{m(!1)}},[e,g,a,t]);j.useEffect(()=>{v&&k.current&&k.current.focus(),v&&g.length===0&&(e.optionsUrl||e.onSearch)&&Y("")},[v,g.length,e.optionsUrl,e.onSearch,Y]);const w=j.useCallback(y=>{A(y),D.current&&clearTimeout(D.current);const B=e.debounceDelay||300;D.current=setTimeout(()=>{Y(y)},B)},[Y,e.debounceDelay]),N=y=>{const B=R.some(ee=>ee.value===y.value);let V;p?B?(V=[],T(ee=>{const H={...ee};return delete H[y.value],H})):(V=[y],T({[y.value]:y}),C(!1)):B?(V=R.filter(ee=>ee.value!==y.value),T(ee=>{const H={...ee};return delete H[y.value],H})):(V=[...R,y],T(ee=>({...ee,[y.value]:y})));const K=V.map(ee=>ee.value);n(e.name,K),e.clearSearchOnSelect&&A("")},_=(y,B)=>{B.stopPropagation();const K=R.filter(ee=>ee.value!==y).map(ee=>ee.value);n(e.name,K),T(ee=>{const H={...ee};return delete H[y],H})},P=g.filter(y=>E?y.label.toLowerCase().includes(E.toLowerCase()):!0),I=()=>l.jsxs(l.Fragment,{children:[l.jsx("div",{className:"p-3 border-b border-gray-200",children:l.jsxs("div",{className:"relative",children:[l.jsx(Di,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400"}),l.jsx("input",{ref:k,type:"text",value:E,onChange:y=>w(y.target.value),placeholder:e.optionsUrl||e.onSearch?"Type to search...":"Search options...",className:"w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"})]})}),l.jsx("div",{className:`overflow-y-auto p-2 max-h-96 flex flex-col gap-0.5 ${f?"max-h-96":"max-h-60"}`,children:S?l.jsxs("div",{className:"py-8 text-center text-gray-500 text-sm",children:[l.jsx(Xr,{className:"w-5 h-5 mx-auto mb-2 animate-spin"}),"Searching..."]}):P.length>0?P.map(y=>{const B=R.some(V=>V.value===y.value);return l.jsxs("div",{onClick:()=>N(y),className:`
 									px-3 py-2 text-sm rounded cursor-pointer transition-colors
 									flex items-center justify-between
 									${B?"bg-blue-500 text-white":"hover:bg-gray-100 text-gray-800"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ynotsoft-dynamic-form",
-  "version": "1.0.72",
+  "version": "1.0.75",
   "description": "DynamicForm React component library",
   "type": "module",
   "main": "./dist/dynamic-form.umd.cjs",