z-react-dynamic-form
Version:
A dynamic form builder for React applications with various input types and validation
1 lines • 117 kB
JavaScript
import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import n,{createContext as a,useContext as o,useState as l,useRef as s,useCallback as i,useEffect as c,useMemo as d}from"react";import{validateFieldsNatively as u,toNestErrors as m}from"@hookform/resolvers";import{appendErrors as p,useFormContext as h,useWatch as g,useForm as b,FormProvider as f}from"react-hook-form";import{clsx as x}from"clsx";import{twMerge as y}from"tailwind-merge";import v from"axios";import{useDropzone as w}from"react-dropzone";import{FileIcon as N,defaultStyles as k}from"react-file-icon";import{isValid as C,startOfMonth as L,endOfMonth as S,eachDayOfInterval as $,format as O,isSameDay as E,subMonths as A,addMonths as M,isBefore as P,isAfter as D,isWithinInterval as R,startOfDay as T,min as j,max as V,endOfWeek as B,startOfWeek as I,addDays as F,startOfToday as z,startOfTomorrow as W}from"date-fns";import{z as U}from"zod";var H,q,_=function(e,r){for(var t={};e.length;){var n=e[0],a=n.code,o=n.message,l=n.path.join(".");if(!t[l])if("unionErrors"in n){var s=n.unionErrors[0].errors[0];t[l]={message:s.message,type:s.code}}else t[l]={message:o,type:a};if("unionErrors"in n&&n.unionErrors.forEach((function(r){return r.errors.forEach((function(r){return e.push(r)}))})),r){var i=t[l].types,c=i&&i[n.code];t[l]=p(l,r,t,a,c?[].concat(c,n.message):n.message)}e.shift()}return t},J=function(e,r,t){return void 0===t&&(t={}),function(n,a,o){try{return Promise.resolve(function(a,l){try{var s=Promise.resolve(e["sync"===t.mode?"parse":"parseAsync"](n,r)).then((function(e){return o.shouldUseNativeValidation&&u({},o),{errors:{},values:t.raw?n:e}}))}catch(e){return l(e)}return s&&s.then?s.then(void 0,l):s}(0,(function(e){if(function(e){return Array.isArray(null==e?void 0:e.errors)}(e))return{values:{},errors:m(_(e.errors,!o.shouldUseNativeValidation&&"all"===o.criteriaMode),o)};throw e})))}catch(e){return Promise.reject(e)}}};function Y(...e){return y(x(e))}!function(e){e.VERIFIED="verified",e.SUCCESS="success"}(H||(H={})),function(e){e.TEXT="text",e.EMAIL="email",e.PASSWORD="password",e.NUMBER="number",e.TEXTAREA="textarea",e.CHECKBOX="checkbox",e.RADIO="radio",e.SELECT="select",e.SEARCHABLE_SELECT="searchable-select",e.SELECT_FROM_API="select-from-api",e.SEARCHABLE_SELECT_FROM_API="searchable-select-from-api",e.MULTI_SELECT="multi-select",e.SEARCHABLE_MULTI_SELECT="searchable-multi-select",e.MULTI_SELECT_FROM_API="multi-select-from-api",e.SEARCHABLE_MULTI_SELECT_FROM_API="searchable-multi-select-from-api",e.DATE="date",e.DATE_OF_BIRTH="date-of-birth",e.TIME="time",e.DATETIME="datetime",e.FILE="file",e.IMAGE_UPLOAD="image-upload"}(q||(q={}));const G=e=>e.reduce(((e,r)=>{if("groupControllers"in r&&r.groupControllers)r.groupControllers.forEach((r=>{r.name&&(e[r.name]=r.defaultValue||void 0)}));else{const t=r;t.name&&(e[t.name]=t.defaultValue||void 0)}return e}),{}),K=e=>e.reduce(((e,r)=>(r.controllers.forEach((r=>{if("groupControllers"in r&&r.groupControllers)r.groupControllers.forEach((r=>{r.name&&(e[r.name]=r.defaultValue||void 0)}));else{const t=r;t.name&&(e[t.name]=t.defaultValue||void 0)}})),e)),{}),X=(e,r)=>e?e.filter((e=>{return!!(void 0!==(t=e).display&&"function"==typeof t.display?t.display(r):void 0===t.visible||("function"==typeof t.visible?t.visible(r):!1!==t.visible))&&(e.groupControllers&&(e.groupControllers=X(e.groupControllers,r)),!0);var t})):[],Z=e=>e<1024?`${e} B`:e<1048576?`${(e/1024).toFixed(2)} KB`:`${(e/1048576).toFixed(2)} MB`,Q=e=>e&&e.split(".").pop()?.toLowerCase()||"",ee={"application/pdf":[".pdf"],"application/vnd.openxmlformats-officedocument.wordprocessingml.document":[".docx"],"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet":[".xlsx"],"application/msword":[".doc"],"application/vnd.ms-excel":[".xls"],"image/jpeg":[".jpg",".jpeg"],"image/png":[".png"],"image/gif":[".gif"],"text/plain":[".txt"]},re=5242880,te=a({isLoading:!1}),ne=({children:r,isLoading:t})=>e(te.Provider,{value:{isLoading:t},children:r}),ae=e=>{const{options:r=[],value:t,onChange:n,defaultValue:a=null}=e,[o,d]=l(!1),[u,m]=l(void 0!==t?t:a),[p,h]=l("bottom"),g=s(null),b=s(null),f=r.find((e=>e.value===u))||null,x=i((()=>{if(g.current&&b.current){const e=b.current.getBoundingClientRect(),r=window.innerHeight,t=e.top,n=r-e.bottom;h(n<200&&n<t?"top":"bottom")}d(!0)}),[]),y=i((()=>{d(!1)}),[]),v=i((()=>{o?y():x()}),[o,x,y]),w=i((e=>{m(e.value),n&&n(e.value),y()}),[n,y]),N=i((()=>{m(null),n&&n(null)}),[n]);return c((()=>{const e=e=>{g.current&&b.current&&!g.current.contains(e.target)&&!b.current.contains(e.target)&&y()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[y]),c((()=>{void 0!==t&&m(t)}),[t]),{selectedOption:f,options:r,isOpen:o,openMenu:x,closeMenu:y,toggleMenu:v,selectOption:w,clearSelection:N,menuProps:{ref:g,position:p},inputProps:{value:f?.label||"",onChange:()=>{},onFocus:x,onBlur:()=>{},ref:b}}};let oe={api:{baseURL:"",headers:{},timeout:3e4}},le=async()=>({accessToken:void 0}),se=!1;const ie=(e,r)=>{oe=e,r&&(le=r),ce.defaults.baseURL=oe.api?.baseURL||"",ce.defaults.headers={...oe.api?.headers?.["Content-Type"]?{}:{"Content-Type":"application/json"},...oe.api?.headers||{}},ce.defaults.timeout=oe.api?.timeout||3e4,se=!0},ce=v.create();(()=>{if(!se)try{const e=(()=>{if("undefined"==typeof window&&"undefined"!=typeof require)try{const e=require("fs"),r=require("path"),t=r.resolve(process.cwd(),"form.config.json");if(e.existsSync(t)){const r=e.readFileSync(t,"utf8");return JSON.parse(r)}const n=r.resolve(process.cwd(),"src","form.config.json");if(e.existsSync(n)){const r=e.readFileSync(n,"utf8");return JSON.parse(r)}}catch(e){}return null})();e&&(oe=e);const r=(()=>{if("undefined"==typeof window&&"undefined"!=typeof require)try{const e=require("fs"),r=require("path"),t=r=>{if(e.existsSync(r))try{const e=require(r);if("function"==typeof e.getSession)return e.getSession}catch(e){}return null},n=[r.resolve(process.cwd(),"services","session.js"),r.resolve(process.cwd(),"services","session.ts"),r.resolve(process.cwd(),"src","services","session.js"),r.resolve(process.cwd(),"src","services","session.ts")];for(const e of n){const r=t(e);if(r)return r}}catch(e){}return null})();r&&(le=r),ce.defaults.baseURL=oe.api?.baseURL||"",ce.defaults.headers={...oe.api?.headers?.["Content-Type"]?{}:{"Content-Type":"application/json"},...oe.api?.headers||{}},ce.defaults.timeout=oe.api?.timeout||3e4,se=!0}catch(e){}})(),ce.interceptors.request.use((async e=>{try{const r=await le();r?.accessToken&&(e.headers.Authorization=`Bearer ${r.accessToken}`)}catch(e){}return e}),(e=>Promise.reject(e)));const de=e=>e?Array.isArray(e)?e:[e]:[],ue=(e,r)=>{if(!e||!r)return{};const t=de(e),n={};return t.forEach((e=>{try{n[e]=r.watch(e)}catch(r){n[e]=void 0}})),n},me=(e,r,t)=>{let n={...t};if(!r)return n;const{params:a,parameterName:o,dependingContrllerName:l}=r;if(a){const{paramName:r,...t}=a;if(Object.assign(n,t),r&&l){const t=de(l);"object"==typeof r&&null!==r?t.forEach((t=>{const a=r[t];a&&(n[a]=e[t]||"")})):1===t.length&&(n[r]=e[t[0]]||"")}}if(o&&l){const r=de(l);1===r.length?n[o]=e[r[0]]||"":r.forEach((r=>{n[`${o}_${r}`]=e[r]||""}))}if(!a?.paramName&&!o&&l){de(l).forEach((r=>{const t=r.replace(/Id$/,""),a=t?t.charAt(0).toUpperCase()+t.slice(1):"";n[`filterBy${a}Id`]=e[r]||""}))}return n},pe=e=>{const{apiUrl:r,params:t={},transformResponse:n=e=>e,defaultValue:a,optionsApiOptions:o,name:u,...m}=e,[p,g]=l(e.options||[]),[b,f]=l(!1),[x,y]=l(null),v=s(!1),w=s(void 0),N=s(null),k=s(!0),C=s(!1),L=s(t);c((()=>{L.current=t}),[t]);const S=s(r);c((()=>{S.current=r||o?.api}),[r]);let $=null;try{$=h()}catch(e){}const O=d((()=>$&&o?.dependingContrllerName?ue(o.dependingContrllerName,$):{}),[$,o?.dependingContrllerName,$?.watch&&JSON.stringify($?.watch(de(o?.dependingContrllerName)))]);d((()=>O),[O]),d((()=>t),[JSON.stringify(t)]);const E=ae({...m,defaultValue:a,options:p}),A=i((async(r=!1)=>{if(!k.current||!r&&C.current)return;if(!(!r&&v.current&&JSON.stringify(O)===JSON.stringify(w.current))){if(o?.dependingContrllerName&&Object.values(O).every((e=>!e))&&!o.includeAll)return g([]),void(w.current=O);N.current&&N.current.abort(),N.current=new AbortController,f(!0),y(null),C.current=!0;try{let e=me(O,o,L.current);const r=await ce.get(S.current,{params:e,signal:N.current.signal});if(!k.current)return;let t;if(t="function"==typeof n?n(r.data.data):Array.isArray(r.data.data)?r.data.data:[],k.current&&(g(t),v.current=!0,w.current={...O}),$&&u)try{const e=$.getValues(u);t.some((r=>r.value===e))||null==e||$.setValue(u,null,{shouldValidate:!0})}catch(e){}}catch(r){if(!k.current)return;"AbortError"!==r.name&&(y(r instanceof Error?r:new Error("Failed to fetch options")),e.options&&e.options.length>0&&g(e.options))}finally{k.current&&f(!1),C.current=!1}}}),[O,u,o,n,e.options]),M=i((()=>(v.current=!1,w.current=void 0,A(!0))),[A]);return c((()=>{k.current=!0;const e=setTimeout((()=>{A()}),50);return()=>{k.current=!1,clearTimeout(e),N.current&&N.current.abort()}}),[]),c((()=>{if(o?.dependingContrllerName&&JSON.stringify(O)!==JSON.stringify(w.current)&&!C.current){const e=setTimeout((()=>{A(!0)}),50);return()=>{clearTimeout(e)}}}),[O,o?.dependingContrllerName]),{...E,options:p,loading:b,error:x,refresh:M}},he=e=>{const{options:r,value:t,onChange:n,defaultValue:a=null,maxSelections:o,selectionSummary:d}=e,[u,m]=l(!1),[p,h]=l(void 0!==t?t:a?[a]:[]),[g,b]=l("bottom"),f=s(null),x=s(null),y=r?.filter((e=>p?.includes(e?.value))),v=i((()=>{if(f.current&&x.current){const e=x.current.getBoundingClientRect(),r=window.innerHeight,t=e.top,n=r-e.bottom;b(n<200&&n<t?"top":"bottom")}m(!0)}),[]),w=i((()=>{m(!1)}),[]),N=i((()=>{u?w():v()}),[u,v,w]),k=i((e=>{const r=e.value;h((e=>e.includes(r)?e?.filter((e=>e!==r)):void 0!==o&&e.length>=o?e:[...e,r]))}),[o]),C=i((e=>{const r=e.value;h((e=>e?.filter((e=>e!==r))))}),[]),L=i((()=>{h([]),n&&n([])}),[n]),S=i((e=>p.includes(e.value)),[p]);c((()=>{const e=e=>{f.current&&x.current&&!f.current.contains(e.target)&&!x.current.contains(e.target)&&w()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[w]),c((()=>{void 0!==t&&h(t)}),[t]),c((()=>{n&&JSON.stringify(t)!==JSON.stringify(p)&&n(p)}),[p,n,t]);return{selectedOptions:y,options:r,isOpen:u,openMenu:v,closeMenu:w,toggleMenu:N,selectOption:k,removeOption:C,clearAll:L,isSelected:S,menuProps:{ref:f,position:g},inputProps:{value:0===y?.length?"":d?d(y):1===y?.length?y[0]?.label:`${y?.length} items selected`,onChange:()=>{},onFocus:v,onBlur:()=>{},ref:x}}},ge=e=>{const{apiUrl:r,params:t={},transformResponse:n=e=>e,optionsApiOptions:a,name:o,...u}=e,[m,p]=l(e.options||[]),[g,b]=l(!1),[f,x]=l(null),y=s(!1),v=s(void 0);let w;try{w=h()}catch(e){w=null}const N=d((()=>w&&a?.dependingContrllerName?ue(a.dependingContrllerName,w):{}),[w,a?.dependingContrllerName,w?.watch&&JSON.stringify(w?.watch(de(a?.dependingContrllerName)))]),k=he({...u,options:m}),C=i((async(l=!1)=>{if(!(!l&&y.current&&JSON.stringify(N)===JSON.stringify(v.current))){if(a?.dependingContrllerName&&Object.values(N).every((e=>!e))&&!a.includeAll)return p([]),void(v.current=N);b(!0),x(null);try{let e=me(N,a,t);const l=await ce.get(r,{params:e});let s;if(s="function"==typeof n?n(l.data.data):Array.isArray(l.data.data)?l.data.data:[],p(s),y.current=!0,v.current={...N},w&&o)try{const e=w.getValues(o);if(Array.isArray(e)&&e.length>0){const r=e.filter((e=>s.some((r=>r.value===e))));r.length!==e.length&&w.setValue(o,r,{shouldValidate:!0})}}catch(e){console.warn("Error validating current values:",e)}}catch(r){console.error("Error fetching options:",r),x(r instanceof Error?r:new Error("Failed to fetch options")),e.options&&e.options.length>0&&p(e.options)}finally{b(!1)}}}),[r,t,n,e.options,N,a,w,o]),L=i((()=>(y.current=!1,v.current=void 0,C(!0))),[C]);return c((()=>{C()}),[]),c((()=>{a?.dependingContrllerName&&JSON.stringify(N)!==JSON.stringify(v.current)&&C(!0)}),[N,C,a?.dependingContrllerName]),{...k,options:m,loading:g,error:f,refresh:L}},be=(e,r)=>{if(!e)return{position:"bottom",style:{}};const{dropdownHeight:t=250,margin:n=8,preferredPosition:a="bottom",container:o=null}=r||{},l=e.getBoundingClientRect(),s=window.innerHeight-l.bottom-n,i=l.top-n,c=Math.min(t,"bottom"===a?s:i);let d;d="bottom"===a&&s>=c?"bottom":"top"===a&&i>=c?"top":s>=i?"bottom":"top";const u=Math.min(t,"bottom"===d?s:i);return{position:d,style:{position:"fixed",width:l.width,maxHeight:`${u}px`,overflowY:"auto",zIndex:1e3,left:l.left,["bottom"===d?"top":"bottom"]:"bottom"===d?`${l.bottom+window.scrollY+n}px`:`${window.innerHeight-l.top+window.scrollY+n}px`}}},fe=()=>{const[e,r]=l({position:"bottom",style:{}}),t=s(null),n=s(null),a=s(null),o=s(null),c=s(e),d=i((()=>{if(!t.current)return;const e=be(t.current,{...o.current,container:a.current}),n=c.current.style,l=e.style;(c.current.position!==e.position||n.top!==l.top||n.bottom!==l.bottom||n.left!==l.left||n.width!==l.width||n.maxHeight!==l.maxHeight)&&(c.current=e,r(e))}),[]);return{position:e,initPositioning:i(((e,r,l=null,s)=>{t.current=e,n.current=r,a.current=l,o.current=s||{},d();const i=[];if(i.push(document.documentElement),l){i.push(l);let e=l.parentElement;for(;e;){const r=window.getComputedStyle(e);/(auto|scroll|overlay)/.test(r.overflow+r.overflowY+r.overflowX)&&i.push(e),e=e.parentElement}}else if(e){let r=ye(e);r&&!i.includes(r)&&i.push(r)}let c=!1;const u=()=>{c||(window.requestAnimationFrame((()=>{d(),c=!1})),c=!0)};return i.forEach((e=>{e.addEventListener("scroll",u,{passive:!0})})),window.addEventListener("resize",u,{passive:!0}),()=>{i.forEach((e=>{e.removeEventListener("scroll",u)})),window.removeEventListener("resize",u)}}),[d]),recalculatePosition:i((()=>{requestAnimationFrame(d)}),[d])}},xe=e=>{if(!e)return null;let r=e.parentElement;for(;r;){if("dialog"===(t=r).getAttribute("role")||"true"===t.getAttribute("aria-modal")||t.classList.contains("dialog")||t.classList.contains("modal")||t.classList.contains("DialogContent")||t.classList.contains("ModalContent"))return r;r=r.parentElement}var t;return null},ye=e=>{if(!e||e===document.body)return document.body;const{overflow:r,overflowY:t,overflowX:n}=window.getComputedStyle(e);return/(auto|scroll)/.test(r+t+n)?e:ye(e.parentElement)},ve=a(void 0),we=({children:r})=>{const[t,n]=l(null),a=i((e=>t===e),[t]),o=i((e=>n(e)),[]),s=i((e=>{n((r=>r===e?null:r))}),[]);return e(ve.Provider,{value:{openDropdownId:t,isDropdownOpen:a,openDropdown:o,closeDropdown:s},children:r})},Ne=()=>{const e=o(ve);if(!e)throw new Error("useSelectDropdownContext must be used within a SelectDropdownProvider");return e},ke=({className:t})=>r("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[e("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),Ce=({className:r})=>e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:r,children:e("polyline",{points:"6 9 12 15 18 9"})}),Le=({className:r})=>e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:r,children:e("polyline",{points:"20 6 9 17 4 12"})}),Se=t=>{const{label:a,placeholder:o="Select an option",disabled:l=!1,required:i=!1,error:d,showError:u=!0,clearable:m=!0,className:p="",size:h="md"}=t,{selectedOption:g,isOpen:b,toggleMenu:f,selectOption:x,clearSelection:y,menuProps:v,inputProps:w,options:N}=ae(t),k=s(null),C=s(null),L=s(null),{position:S,initPositioning:$}=fe(),{isDropdownOpen:O,openDropdown:E,closeDropdown:A}=Ne(),M=n.useId();c((()=>{b&&!O(M)&&E(M),!b&&O(M)&&A(M)}),[b,O,E,A,M]),c((()=>{if(b&&k.current){L.current||(L.current=xe(k.current));return $(k.current,C.current,L.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[b,$]),c((()=>{const e=e=>{b&&k.current&&!k.current.contains(e.target)&&v.ref.current&&!v.ref.current.contains(e.target)&&f()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[b,f]);return r("div",{className:`select-container w-full ${p}`,children:[a&&r("label",{className:"block text-sm font-medium mb-1",children:[a,i&&e("span",{className:"text-red-600 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:k,className:`\n flex items-center border rounded-md px-3 relative cursor-pointer\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[h]}\n ${d?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${b?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${l?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onMouseDown:()=>!l&&f(),children:[e("div",{className:"flex-grow overflow-hidden text-ellipsis whitespace-nowrap dark:text-gray-100",children:e("span",g?{children:g.label}:{className:"text-gray-400 dark:text-gray-400",children:o})}),r("div",{className:"flex-shrink-0 ml-1 text-gray-400",children:[g&&m&&!l&&e("button",{type:"button",className:"p-1 hover:text-gray-600",onClick:e=>{e.stopPropagation(),y()},children:e(ke,{className:"h-4 w-4"})}),e(Ce,{className:"h-4 w-4 transition-transform "+(b?"rotate-180":"")})]}),e("input",{type:"text",className:"sr-only",...w})]}),u&&d&&e("p",{className:"mt-1 text-sm text-red-500",children:d}),b&&!l&&e("div",{ref:C,style:S.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",onMouseDown:e=>e.stopPropagation(),children:0===N.length?e("div",{className:"p-2 text-gray-500 text-center",children:"No options available"}):e("div",{className:"py-1",children:N.map((t=>r("div",{className:`\n flex items-center px-3 py-2 cursor-pointer\n ${g?.value===t.value?"bg-blue-50 text-blue-700":"hover:bg-gray-50"}\n `,onClick:()=>x(t),children:[e("span",{children:t.label}),g?.value===t.value&&e(Le,{className:"h-4 w-4 ml-auto text-blue-600"})]},t.value)))})})]})]})},$e=t=>{const{label:a,placeholder:o="Select an option",searchPlaceholder:i="Search...",disabled:d=!1,required:u=!1,error:m,clearable:p=!0,className:h="",size:g="md",noResultsMessage:b="No results found",showError:f=!0}=t,{selectedOption:x,isOpen:y,toggleMenu:v,selectOption:w,clearSelection:N,inputProps:k,filteredOptions:C,searchTerm:L,setSearchTerm:S}=(e=>{const{options:r,searchPlaceholder:t,minSearchLength:n=0}=e,a=ae(e),[o,s]=l(""),i=r.filter((e=>o.length<n||e.label.toLowerCase().includes(o.toLowerCase()))),d={...a.inputProps,value:a.isOpen?o:a.selectedOption?.label||"",onChange:e=>{s(e.target.value),a.isOpen||a.openMenu()},placeholder:a.isOpen?t||"Search...":e.placeholder||"Select option"};return c((()=>{a.isOpen||s("")}),[a.isOpen]),{...a,searchTerm:o,setSearchTerm:s,filteredOptions:i,inputProps:d}})(t),$=s(null),O=s(null),E=s(null),A=s(null),{position:M,initPositioning:P}=fe(),{isDropdownOpen:D,openDropdown:R,closeDropdown:T}=Ne(),j=n.useId();c((()=>{y&&!D(j)&&R(j),!y&&D(j)&&T(j)}),[y,D,R,T,j]),c((()=>{if(y&&$.current){A.current||(A.current=xe($.current));return P($.current,E.current,A.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[y,P]),c((()=>{y&&O.current&&O.current.focus()}),[y]),c((()=>{const e=e=>{y&&$.current&&!$.current.contains(e.target)&&E.current&&!E.current.contains(e.target)&&v()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[y,v]);const{ref:V,...B}=k;return r("div",{className:`searchable-select-container w-full ${h}`,children:[a&&r("label",{className:"block text-sm font-medium text-gray-700 mb-1",children:[a,u&&e("span",{className:"text-red-500 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:$,className:`\n flex items-center border rounded-md px-3 relative\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[g]}\n ${m?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${y?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${d?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onClick:()=>!d&&v(),children:[e("input",{ref:O,...B,className:"block w-full h-full outline-none bg-transparent dark:bg-transparent dark:text-gray-100",placeholder:y?i:o,readOnly:!y,disabled:d,value:y?L:B.value,onChange:e=>{y&&S(e.target.value)}}),r("div",{className:"flex items-center ml-2",children:[x&&p&&e("button",{type:"button",className:"p-1 text-gray-400 hover:text-gray-600 focus:outline-none",onClick:e=>{e.stopPropagation(),N(),v()},children:e(ke,{})}),e("span",{className:"text-gray-400 transition-transform duration-200 "+(y?"rotate-180":""),children:e(Ce,{})})]})]}),f&&m&&e("p",{className:"mt-1 text-sm text-red-500",children:m}),y&&!d&&e("div",{ref:E,style:M.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",children:0===C.length?e("div",{className:"p-3 text-sm text-gray-500 text-center",children:L?b:"No options available"}):e("ul",{className:"py-1",children:C.map((t=>e("li",{className:`\n px-3 py-2 cursor-pointer text-sm hover:bg-gray-100\n ${t.disabled?"opacity-50 cursor-not-allowed":""}\n ${x?.value===t.value?"bg-blue-50 text-blue-700":"text-gray-700"}\n `,onClick:()=>!t.disabled&&w(t),children:r("div",{className:"flex items-center",children:[t.icon&&e("span",{className:"mr-2",children:t.icon}),t.label]})},t.value.toString())))})})]})]})},Oe=({className:r})=>e("svg",{className:Y("animate-spin",r),xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:e("path",{d:"M21 12a9 9 0 1 1-6.219-8.56"})}),Ee=a=>{const{label:o,placeholder:l="Select an option",disabled:i=!1,required:d=!1,error:u,clearable:m=!0,className:p="",size:h="md",showError:g=!0}=a,{selectedOption:b,isOpen:f,toggleMenu:x,selectOption:y,clearSelection:v,menuProps:w,inputProps:N,options:k=[],loading:C,error:L,refresh:S}=pe(a),$=s(null),O=s(null),E=s(null),{position:A,initPositioning:M}=fe(),{isDropdownOpen:P,openDropdown:D,closeDropdown:R}=Ne(),T=n.useId();c((()=>{f&&!P(T)&&D(T),!f&&P(T)&&R(T)}),[f,P,D,R,T]),c((()=>{if(f&&$.current){E.current||(E.current=xe($.current));return M($.current,O.current,E.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[f,M]);return r("div",{className:`select-from-api-container w-full ${p}`,children:[o&&r("label",{className:"block text-sm font-medium text-gray-700 mb-1",children:[o,d&&e("span",{className:"text-red-500 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:$,className:`\n flex items-center border rounded-md px-3 relative cursor-pointer\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[h]}\n ${u||L?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${f?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${i?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onClick:e=>{i||(e.stopPropagation(),x())},children:[e("input",{...N,className:"block w-full h-full outline-none bg-transparent dark:bg-transparent dark:text-gray-100",placeholder:l,readOnly:!0,disabled:i,onClick:e=>e.stopPropagation()}),e("div",{className:"flex items-center ml-2",children:C?e(Oe,{}):r(t,{children:[b&&m&&e("button",{type:"button",className:"p-1 text-gray-400 hover:text-gray-600 focus:outline-none",onClick:e=>{e.stopPropagation(),v()},children:e(ke,{})}),e("span",{className:"text-gray-400 transition-transform duration-200 "+(f?"rotate-180":""),children:e(Ce,{})})]})})]}),g&&(u||L)&&e("p",{className:"mt-1 text-sm text-red-500",children:u||L?.message}),f&&!i&&e("div",{ref:O,style:A.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",onClick:e=>e.stopPropagation(),children:C?r("div",{className:"p-3 text-sm text-gray-500 text-center flex items-center justify-center",children:[e(Oe,{}),e("span",{className:"ml-2",children:"Loading options..."})]}):L?r("div",{className:"p-3",children:[e("p",{className:"text-sm text-red-500 mb-2",children:"Failed to load options"}),e("button",{className:"text-sm text-black hover:text-blue-700",onClick:e=>{e.stopPropagation(),S()},children:"Try again"})]}):0===k.length?e("div",{className:"p-3 text-sm text-gray-500 text-center",children:"No options available"}):e("ul",{className:"py-1",children:k.map((t=>e("li",{className:`\n px-3 py-2 cursor-pointer text-sm hover:bg-gray-100\n ${t.disabled?"opacity-50 cursor-not-allowed":""}\n ${b?.value===t.value?"bg-blue-50 text-blue-700":"text-gray-700"}\n `,onClick:e=>{e.stopPropagation(),t.disabled||y(t)},children:r("div",{className:"flex items-center",children:[t.icon&&e("span",{className:"mr-2",children:t.icon}),t.label]})},t.value)))})})]})]})},Ae=t=>{const{label:a,placeholder:o="Select an option",searchPlaceholder:u="Search...",disabled:m=!1,required:p=!1,error:g,clearable:b=!0,className:f="",size:x="md",noResultsMessage:y="No results found",showError:v=!0}=t,{selectedOption:w,isOpen:N,toggleMenu:k,selectOption:C,clearSelection:L,inputProps:S,filteredOptions:$=[],searchTerm:O="",loading:E,loadingResults:A,error:M,refresh:P}=(e=>{const{apiUrl:r,params:t={},transformResponse:n=e=>e,searchParam:a="q",debounceMs:o=300,minSearchLength:u=2,optionsApiOptions:m,name:p,...g}=e,[b,f]=l(""),[x,y]=l(e?.options||[]),[v,w]=l(!1),N=s(null),k=s(""),C=s(null),L=s(void 0),S=s(!0),$=s(!1),O=s(!1);let E=null;try{E=h()}catch(e){}const A=d((()=>E&&m?.dependingContrllerName?ue(m.dependingContrllerName,E):{}),[E,m?.dependingContrllerName,E?.watch&&JSON.stringify(E?.watch(de(m?.dependingContrllerName)))]),M=d((()=>t),[JSON.stringify(t)]),P=s(t);c((()=>{P.current=t}),[t]);const D=s(r);c((()=>{D.current=r||m?.api}),[r]);const R=pe({apiUrl:r,params:M,transformResponse:n,optionsApiOptions:m,name:p,options:e.options||[],...g}),T=i((async e=>{if(S.current&&!$.current)if(e.length<u||e===k.current)e.length<u&&(y(R.options),w(!1));else if(m?.dependingContrllerName&&Object.values(A).every((e=>!e))&&!m.includeAll)y([]);else{k.current=e,w(!0),$.current=!0,C.current&&C.current.abort(),C.current=new AbortController;try{let r=me(A,m,{...t,[a]:e});const o=await ce.get(D.current,{params:r,signal:C.current.signal});if(!S.current)return;let l;if(l="function"==typeof n?n(o.data?.data||[]):Array.isArray(o.data?.data)?o.data.data:[],S.current&&(y(l),L.current={...A},O.current=!1),E&&p)try{const e=E.getValues(p);l.some((r=>r.value===e))||null==e||E.setValue(p,null,{shouldValidate:!0})}catch(e){}}catch(r){if(!S.current)return;"AbortError"!==r.name&&(O.current=!0,R.options.length>0&&y(R.options.filter((r=>r.label.toLowerCase().includes(e.toLowerCase())))))}finally{S.current&&w(!1),$.current=!1}}}),[r,t,a,R.options,u,A,p,E,m,n]),j=i((e=>{if(f(e),N.current&&(clearTimeout(N.current),N.current=null),e.length<u)return y(R.options),void w(!1);w(!0),N.current=setTimeout((()=>{T(e)}),o)}),[u,o,R.options]);c((()=>(S.current=!0,()=>{S.current=!1,N.current&&clearTimeout(N.current),C.current&&C.current.abort()})),[]),c((()=>{b.length<u&&y(R.options)}),[R.options,b,u]);const V=d((()=>({...R.inputProps,value:R.isOpen?b:R.selectedOption?.label||"",onChange:e=>{j(e.target.value),R.isOpen||R.openMenu()},placeholder:R.isOpen?e.searchPlaceholder||"Search...":e.placeholder||"Select option"})),[R.inputProps,R.isOpen,R.selectedOption,b,e.searchPlaceholder,e.placeholder]);return c((()=>{R.isOpen||(f(""),y(R.options))}),[R.isOpen,R.options]),{...R,searchTerm:b,setSearchTerm:j,filteredOptions:x,loadingResults:v,inputProps:V}})(t),D=s(null),R=s(null),T=s(null),j=s(null),{position:V,initPositioning:B}=fe(),{isDropdownOpen:I,openDropdown:F,closeDropdown:z}=Ne(),W=n.useId();c((()=>{N&&!I(W)&&F(W),!N&&I(W)&&z(W)}),[N,I,F,z,W]),c((()=>{if(N&&D.current){j.current||(j.current=xe(D.current));return B(D.current,T.current,j.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[N,B]),c((()=>{N&&R.current&&R.current.focus()}),[N]);const{ref:U,...H}=S||{},q=Array.isArray($)?$:[];return r("div",{className:`searchable-select-from-api-container w-full ${f}`,children:[a&&r("label",{className:"block text-sm font-medium text-gray-700 mb-1",children:[a,p&&e("span",{className:"text-red-500 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:D,className:`\n flex items-center border rounded-md px-3 relative\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[x]}\n ${g||M?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${N?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${m?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onClick:()=>!m&&k(),children:[e("input",{ref:R,...H,className:"block w-full h-full outline-none bg-transparent dark:bg-transparent dark:text-gray-100",placeholder:N?u:o,readOnly:!N,disabled:m}),e("div",{className:"flex items-center ml-2",children:E||A?e(Oe,{}):r("div",{className:"flex items-center gap-x-1",children:[w&&b&&!N&&e("button",{type:"button",className:"p-1 text-gray-400 hover:text-gray-600 focus:outline-none",onClick:e=>{e.stopPropagation(),L()},children:e(ke,{})}),e("span",{className:"text-gray-400 transition-transform duration-200 "+(N?"rotate-180":""),children:e(Ce,{})})]})})]}),v&&(g||M)&&e("p",{className:"mt-1 text-sm text-red-500",children:g||M?.message}),N&&!m&&e("div",{ref:T,style:V.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",children:E?r("div",{className:"p-3 text-sm text-gray-500 text-center flex items-center justify-center",children:[e(Oe,{}),e("span",{className:"ml-2",children:"Loading options..."})]}):A?r("div",{className:"p-3 text-sm text-gray-500 text-center flex items-center justify-center",children:[e(Oe,{}),e("span",{className:"ml-2",children:"Searching..."})]}):M?r("div",{className:"p-3",children:[e("p",{className:"text-sm text-red-500 mb-2",children:"Failed to load options"}),e("button",{className:"text-sm text-black hover:text-blue-700",onClick:e=>{e.stopPropagation(),P()},children:"Try again"})]}):0===q.length?e("div",{className:"p-3 text-sm text-gray-500 text-center",children:O?y:"No options available"}):e("ul",{className:"py-1",children:q.map((t=>e("li",{className:`\n px-3 py-2 cursor-pointer text-sm hover:bg-gray-100\n ${t.disabled?"opacity-50 cursor-not-allowed":""}\n ${w?.value===t.value?"bg-blue-50 text-blue-700":"text-gray-700"}\n `,onClick:()=>!t.disabled&&C(t),children:r("div",{className:"flex items-center",children:[t.icon&&e("span",{className:"mr-2",children:t.icon}),t.label]})},t.value)))})})]})]})},Me=t=>{const{label:a,placeholder:o="Select options",disabled:l=!1,required:i=!1,error:d,showError:u=!0,clearable:m=!0,className:p="",size:h="md"}=t,{selectedOptions:g,isOpen:b,toggleMenu:f,selectOption:x,removeOption:y,clearAll:v,isSelected:w,menuProps:N,inputProps:k,options:C}=he(t),L=s(null),S=s(null),$=s(null),{position:O,initPositioning:E}=fe(),{isDropdownOpen:A,openDropdown:M,closeDropdown:P}=Ne(),D=n.useId();c((()=>{b&&!A(D)&&M(D),!b&&A(D)&&P(D)}),[b,A,M,P,D]),c((()=>{if(b&&L.current){$.current||($.current=xe(L.current));return E(L.current,S.current,$.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[b,E]),c((()=>{const e=e=>{b&&L.current&&!L.current.contains(e.target)&&N.ref.current&&!N.ref.current.contains(e.target)&&f()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[b,f]);return r("div",{className:`multi-select-container w-full ${p}`,children:[a&&r("label",{className:"block text-sm font-medium mb-1",children:[a,i&&e("span",{className:"text-red-600 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:L,className:`\n flex items-center border rounded-md px-3 relative cursor-pointer\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[h]}\n ${d?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${b?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${l?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onMouseDown:()=>!l&&f(),children:[e((()=>0===g.length?e("div",{className:"flex-grow text-gray-400 overflow-hidden text-ellipsis whitespace-nowrap",children:o}):e("div",{className:"flex flex-wrap gap-1 flex-grow overflow-hidden",children:g.map((t=>r("div",{className:"bg-blue-100 text-blue-800 rounded-md px-2 py-0.5 flex items-center gap-1 text-sm",children:[e("span",{className:"truncate",children:t.label}),!l&&e("button",{type:"button",onClick:e=>{e.stopPropagation(),y(t)},className:"text-black hover:text-blue-700",children:e(ke,{className:"h-3 w-3"})})]},t.value)))})),{}),r("div",{className:"flex-shrink-0 ml-1 text-gray-400",children:[g.length>0&&m&&!l&&e("button",{type:"button",className:"p-1 hover:text-gray-600",onClick:e=>{e.stopPropagation(),v()},children:e(ke,{className:"h-4 w-4"})}),e(Ce,{className:"h-4 w-4 transition-transform "+(b?"rotate-180":"")})]}),e("input",{type:"text",className:"sr-only",...k})]}),u&&d&&e("p",{className:"mt-1 text-sm text-red-500",children:d}),b&&!l&&e("div",{ref:S,style:O.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",onMouseDown:e=>e.stopPropagation(),children:0===C.length?e("div",{className:"p-2 text-gray-500 text-center",children:"No options available"}):e("div",{className:"py-1",children:C.map((t=>r("div",{className:`\n flex items-center px-3 py-2 cursor-pointer\n ${w(t)?"bg-blue-50 text-blue-700":"hover:bg-gray-50"}\n `,onClick:()=>x(t),children:[e("div",{className:`\n w-4 h-4 rounded border mr-2 flex items-center justify-center\n ${w(t)?"bg-blue-600 border-blue-600":"border-gray-300"}\n `,children:w(t)&&e(Le,{className:"h-3 w-3 text-white"})}),e("span",{children:t.label})]},t.value)))})})]})]})},Pe=t=>{const{label:a,placeholder:o="Select options",searchPlaceholder:i="Search...",disabled:d=!1,required:u=!1,error:m,showError:p=!0,clearable:h=!0,className:g="",size:b="md",noResultsMessage:f="No results found"}=t,{selectedOptions:x,isOpen:y,toggleMenu:v,selectOption:w,removeOption:N,clearAll:k,isSelected:C,inputProps:L,filteredOptions:S,searchTerm:$,setSearchTerm:O}=(e=>{const{options:r,searchPlaceholder:t,minSearchLength:n=0}=e,a=he(e),[o,s]=l(""),i=r.filter((e=>o.length<n||e.label.toLowerCase().includes(o.toLowerCase()))),d={...a.inputProps,value:a.isOpen?o:a.inputProps.value,onChange:e=>{s(e.target.value),a.isOpen||a.openMenu()},placeholder:a.isOpen?t||"Search...":e.placeholder||"Select options"};return c((()=>{a.isOpen||s("")}),[a.isOpen]),{...a,searchTerm:o,setSearchTerm:s,filteredOptions:i,inputProps:d}})(t),E=s(null),A=s(null),M=s(null),P=s(null),{position:D,initPositioning:R}=fe(),{isDropdownOpen:T,openDropdown:j,closeDropdown:V}=Ne(),B=n.useId();c((()=>{y&&!T(B)&&j(B),!y&&T(B)&&V(B)}),[y,T,j,V,B]),c((()=>{if(y&&E.current){P.current||(P.current=xe(E.current));return R(E.current,M.current,P.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[y,R]),c((()=>{y&&A.current&&A.current.focus()}),[y]),c((()=>{const e=e=>{y&&E.current&&!E.current.contains(e.target)&&M.current&&!M.current.contains(e.target)&&v()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[y,v]);const{ref:I,...F}=L;return r("div",{className:`searchable-multi-select-container w-full ${g}`,children:[a&&r("label",{className:"block text-sm font-medium text-gray-700 mb-1",children:[a,u&&e("span",{className:"text-red-500 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:E,className:`\n flex items-center border rounded-md px-3 relative\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[b]}\n ${m?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${y?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${d?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onClick:()=>!d&&v(),children:[x.length>0&&!y?e("div",{className:"flex flex-wrap gap-1 py-1 max-w-full overflow-hidden",children:x.length<=3?x.map((t=>r("div",{className:"flex items-center bg-blue-100 text-blue-800 rounded px-2 py-0.5 text-sm",children:[e("span",{className:"truncate",children:t.label}),e("button",{type:"button",className:"ml-1 text-black hover:text-blue-700 focus:outline-none",onClick:e=>{e.stopPropagation(),N(t)},children:e(ke,{})})]},t.value.toString()))):r("div",{className:"text-gray-700",children:[x.length," items selected"]})}):e("input",{ref:A,...F,className:"block w-full h-full outline-none bg-transparent",placeholder:y?i:o,readOnly:!y,disabled:d,value:y?$:F.value,onChange:e=>{y&&O(e.target.value)}}),r("div",{className:"flex items-center ml-2",children:[x.length>0&&h&&!y&&e("button",{type:"button",className:"p-1 text-gray-400 hover:text-gray-600 focus:outline-none",onClick:e=>{e.stopPropagation(),k()},children:e(ke,{})}),e("span",{className:"text-gray-400 transition-transform duration-200 "+(y?"rotate-180":""),children:e(Ce,{})})]})]}),p&&m&&e("p",{className:"mt-1 text-sm text-red-500",children:m}),y&&!d&&e("div",{ref:M,style:D.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",children:0===S.length?e("div",{className:"p-3 text-sm text-gray-500 text-center",children:$?f:"No options available"}):e("ul",{className:"py-1",children:S.map((t=>e("li",{className:`\n px-3 py-2 cursor-pointer text-sm hover:bg-gray-100\n ${t.disabled?"opacity-50 cursor-not-allowed":""}\n ${C(t)?"bg-blue-50 text-blue-700":"text-gray-700"}\n `,onClick:()=>!t.disabled&&w(t),children:r("div",{className:"flex items-center",children:[e("div",{className:`\n w-4 h-4 mr-3 flex-shrink-0 border rounded\n ${C(t)?"bg-black border-black text-white":"border-gray-300"}\n `,children:C(t)&&e(Le,{})}),t.icon&&e("span",{className:"mr-2",children:t.icon}),t.label]})},t.value.toString())))})})]})]})},De=a=>{const{label:o,placeholder:l="Select options",disabled:i=!1,required:d=!1,error:u,clearable:m=!0,className:p="",size:h="md",showError:g=!0}=a,{selectedOptions:b,isOpen:f,toggleMenu:x,selectOption:y,removeOption:v,clearAll:w,isSelected:N,menuProps:k,inputProps:C,options:L,loading:S,error:$,refresh:O}=ge(a),E=s(null),A=s(null),M=s(null),{position:P,initPositioning:D}=fe(),{isDropdownOpen:R,openDropdown:T,closeDropdown:j}=Ne(),V=n.useId();c((()=>{f&&!R(V)&&T(V),!f&&R(V)&&j(V)}),[f,R,T,j,V]),c((()=>{if(f&&E.current){M.current||(M.current=xe(E.current));return D(E.current,A.current,M.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[f,D]),c((()=>{const e=e=>{f&&E.current&&!E.current.contains(e.target)&&k.ref.current&&!k.ref.current.contains(e.target)&&x()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[f,x]);return r("div",{className:`multi-select-from-api-container w-full ${p}`,children:[o&&r("label",{className:"block text-sm font-medium text-gray-700 mb-1",children:[o,d&&e("span",{className:"text-red-500 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:E,className:`\n flex items-center border rounded-md px-3 relative cursor-pointer\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[h]}\n ${u||$?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${f?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${i?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onClick:()=>!i&&x(),children:[b?.length>0?e("div",{className:"flex flex-wrap gap-1 py-1 max-w-full overflow-hidden",children:b?.length<=3?b.map((t=>r("div",{className:"flex items-center bg-blue-100 text-blue-800 rounded px-2 py-0.5 text-sm",children:[e("span",{className:"truncate",children:t.label}),e("button",{type:"button",className:"ml-1 text-black hover:text-blue-700 focus:outline-none",onClick:e=>{e.stopPropagation(),v(t)},children:e(ke,{})})]},t.value))):r("div",{className:"text-gray-700",children:[b?.length," items selected"]})}):e("input",{...C,className:"block w-full h-full outline-none bg-transparent cursor-pointer",placeholder:l,readOnly:!0,disabled:i}),e("div",{className:"flex items-center ml-2",children:S?e(Oe,{}):r(t,{children:[b?.length>0&&m&&e("button",{type:"button",className:"p-1 text-gray-400 hover:text-gray-600 focus:outline-none",onClick:e=>{e.stopPropagation(),w()},children:e(ke,{})}),e("span",{className:"text-gray-400 transition-transform duration-200 "+(f?"rotate-180":""),children:e(Ce,{})})]})})]}),g&&(u||$)&&e("p",{className:"mt-1 text-sm text-red-500",children:u||$?.message}),f&&!i&&e("div",{ref:A,style:P.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",children:S?r("div",{className:"p-3 text-sm text-gray-500 text-center flex items-center justify-center",children:[e(Oe,{}),e("span",{className:"ml-2",children:"Loading options..."})]}):$?r("div",{className:"p-3",children:[e("p",{className:"text-sm text-red-500 mb-2",children:"Failed to load options"}),e("button",{className:"text-sm text-black hover:text-blue-700",onClick:e=>{e.stopPropagation(),O()},children:"Try again"})]}):0===L?.length?e("div",{className:"p-3 text-sm text-gray-500 text-center",children:"No options available"}):e("ul",{className:"py-1",children:L?.map((t=>e("li",{className:`\n px-3 py-2 cursor-pointer text-sm hover:bg-gray-100\n ${t.disabled?"opacity-50 cursor-not-allowed":""}\n ${N(t)?"bg-blue-50 text-blue-700":"text-gray-700"}\n `,onClick:()=>!t.disabled&&y(t),children:r("div",{className:"flex items-center",children:[e("div",{className:`\n w-4 h-4 mr-3 flex-shrink-0 border rounded\n ${N(t)?"bg-black border-black text-white":"border-gray-300"}\n `,children:N(t)&&e(Le,{})}),t.icon&&e("span",{className:"mr-2",children:t.icon}),t.label]})},t.value)))})})]})]})},Re=({className:t})=>r("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:t,children:[e("circle",{cx:"11",cy:"11",r:"8"}),e("line",{x1:"21",y1:"21",x2:"16.65",y2:"16.65"})]}),Te=a=>{const{label:o,placeholder:u="Select options",searchPlaceholder:m="Search...",disabled:p=!1,required:g=!1,error:b,showError:f=!0,clearable:x=!0,className:y="",size:v="md"}=a,{selectedOptions:w,isOpen:N,toggleMenu:k,selectOption:C,removeOption:L,clearAll:S,isSelected:$,menuProps:O,inputProps:E,searchTerm:A,setSearchTerm:M,filteredOptions:P,loading:D,loadingResults:R,error:T}=(e=>{const{apiUrl:r,params:t={},transformResponse:n=e=>e,searchParam:a="q",debounceMs:o=300,minSearchLength:u=2,optionsApiOptions:m,name:p,...g}=e;let b,f=null;try{f=p?h():null}catch(e){}if(f&&m?.dependingContrllerName)try{b=f.watch(m.dependingContrllerName)}catch(e){b=void 0}const x=d((()=>f&&m?.dependingContrllerName?ue(m.dependingContrllerName,f):{}),[f,m?.dependingContrllerName,f?.watch&&JSON.stringify(f?.watch(de(m?.dependingContrllerName)))]),[y,v]=l(""),[w,N]=l(e.options||[]),[k,C]=l(!1),L=s(null),S=s(""),$=s(null),O=s(void 0),E=s(!0),A=ge({apiUrl:r,params:t,transformResponse:n,optionsApiOptions:m,name:p,options:e.options||[],...g}),M=i((async e=>{if(E.current)if(e.length<u||e===S.current)e.length<u&&(N(A.options),C(!1));else if(m?.dependingContrllerName&&Object.values(x).every((e=>!e))&&!m.includeAll)N([]);else{S.current=e,C(!0),$.current&&$.current.abort(),$.current=new AbortController;try{let o=me(x,m,{...t,[a]:e});const l=await ce.get(r,{params:o,signal:$.current.signal});if(!E.current)return;let s;if(s="function"==typeof n?n(l.data.data):Array.isArray(l.data.data)?l.data.data:[],N(s),O.current={...x},f&&p)try{const e=f.getValues(p);if(Array.isArray(e)&&e.length>0){const r=e.filter((e=>s.some((r=>r.value===e))));r.length!==e.length&&f.setValue(p,r,{shouldValidate:!0})}}catch(e){}}catch(r){if(!E.current)return;"AbortError"!==r.name&&N(A.options.filter((r=>r.label.toLowerCase().includes(e.toLowerCase()))))}finally{E.current&&!1===$.current?.signal.aborted&&C(!1)}}}),[r,t,a,A.options,u,x,p,f,m,n]),P=i((e=>{if(v(e),L.current&&(clearTimeout(L.current),L.current=null),e.length<u)return N(A.options),void C(!1);C(!0),L.current=setTimeout((()=>{M(e)}),o)}),[M,u,o,A.options]);c((()=>(E.current=!0,()=>{E.current=!1,L.current&&clearTimeout(L.current),$.current&&$.current.abort()})),[]),c((()=>{y.length<u&&N(A.options)}),[A.options,y,u]),c((()=>{Object.values(x).some((e=>e!==O.current[e]))&&y.length>=u&&(L.current&&clearTimeout(L.current),L.current=setTimeout((()=>{M(y)}),100))}),[x,y,u,M]);const D={...A.inputProps,value:A.isOpen?y:A.inputProps.value,onChange:e=>{P(e.target.value),A.isOpen||A.openMenu()},placeholder:A.isOpen?e.searchPlaceholder||"Search...":e.placeholder||"Select options"};return c((()=>{A.isOpen||(v(""),N(A.options))}),[A.isOpen,A.options]),{...A,searchTerm:y,setSearchTerm:P,filteredOptions:w,loadingResults:k,inputProps:D}})(a),j=s(null),V=s(null),B=s(null),I=s(null),{position:F,initPositioning:z}=fe(),{isDropdownOpen:W,openDropdown:U,closeDropdown:H}=Ne(),q=n.useId();c((()=>{N&&!W(q)&&U(q),!N&&W(q)&&H(q)}),[N,W,U,H,q]),c((()=>{if(N&&j.current){I.current||(I.current=xe(j.current));return z(j.current,B.current,I.current,{dropdownHeight:250,margin:8,preferredPosition:"bottom"})}}),[N,z]),c((()=>{N&&V.current&&V.current?.focus()}),[N]),c((()=>{const e=e=>{N&&j.current&&!j.current.contains(e.target)&&O.ref.current&&!O.ref.current.contains(e.target)&&k()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}}),[N,k]);return r("div",{className:`searchable-multi-select-container w-full ${y}`,children:[o&&r("label",{className:"block text-sm font-medium mb-1",children:[o,g&&e("span",{className:"text-red-600 ml-1",children:"*"})]}),r("div",{className:"relative",children:[r("div",{ref:j,className:`\n flex items-center border rounded-md px-3 relative cursor-pointer\n ${{sm:"h-8 text-sm",md:"h-10 text-base",lg:"h-12 text-lg"}[v]}\n ${b||T?"border-red-500":"border-gray-300 dark:border-[#232a3b]"}\n ${N?"ring-2 ring-black border-black dark:ring-[#2563eb] dark:border-[#2563eb]":""}\n ${p?"bg-gray-100 cursor-not-allowed dark:bg-gray-800":"bg-white hover:border-gray-400 dark:bg-[#111827] dark:hover:border-[#2563eb]"}\n `,onClick:()=>!p&&k(),children:[N&&e(Re,{className:"h-4 w-4 text-gray-400 mr-2"}),e((()=>N||0!==w?.length?N?e("input",{ref:V,type:"text",className:"flex-grow bg-transparent outline-none",placeholder:m,value:A,onChange:e=>M(e.target.value),onClick:e=>e.stopPropagation()}):e("div",{className:"flex flex-wrap gap-1 flex-grow overflow-hidden",children:w?.map((t=>r("div",{className:"bg-blue-100 text-blue-800 rounded-md px-2 py-0.5 flex items-center gap-1 text-sm",children:[e("span",{className:"truncate",children:t.label}),!p&&e("button",{type:"button",onClick:e=>{e.stopPropagation(),L(t)},className:"text-black hover:text-blue-700",children:e(ke,{className:"h-3 w-3"})})]},t.value.toString())))}):e("div",{className:"flex-grow text-gray-400 overflow-hidden text-ellipsis whitespace-nowrap",children:u})),{}),e("div",{className:"flex-shrink-0 ml-1 text-gray-400",children:D||R?e(Oe,{className:"h-4 w-4 animate-spin"}):r(t,{children:[w?.length>0&&x&&!p&&!N&&e("button",{type:"button",className:"p-1 hover:text-gray-600",onClick:e=>{e.stopPropagation(),S()},children:e(ke,{className:"h-4 w-4"})}),e(Ce,{className:"h-4 w-4 transition-transform "+(N?"rotate-180":"")})]})}),e("input",{type:"hidden",className:"sr-only",...E})]}),f&&(b||T)&&e("p",{className:"mt-1 text-sm text-red-500",children:b||T?.message}),N&&!p&&e("div",{ref:B,style:F.style,className:"bg-white dark:bg-[#111827] rounded-md shadow-lg border border-gray-200 dark:border-[#232a3b] max-h-60 overflow-auto z-50",children:R?r("div",{className:"p-4 text-center text-gray-500",children:[e(Oe,{className:"h-5 w-5 mx-auto mb-2 animate-spin"}),e("p",{children:"Searching..."})]}):e("div",0===P?.length?{className:"p-4 text-ce