dropdowns-js 1.1.5 → 1.1.6

package/dist/dropdowns-js.cjs.js

@@ -3,4 +3,4 @@ Valid keys: `+JSON.stringify(Object.keys(e),null,"  "));var d=ee(q,Y,$,N,D+"."+Y
                          ${P&&`dropdown-js-border ${P}`}`,style:{...S?{pointerEvents:"none"}:{}},children:[w.jsxs("div",{className:"dropdown-js-input-wrapper dropdown-js-rounded",style:k,children:[w.jsx("input",{id:l.dropdownSearch,name:"dropdownSearch",className:"dropdown-js-input dropdown-js-rounded",autoComplete:"off",type:"text",style:k,role:"combobox","aria-placeholder":`Type to Search for ${n}`,"aria-required":!0,"aria-controls":l.dropdown,"aria-autocomplete":"list","aria-haspopup":"listbox","aria-expanded":g,onChange:r=>H(r),disabled:S,placeholder:`Type to Search for ${n}`,value:A}),w.jsx("div",{className:"dropdown-js-arrow-container dropdown-js-padding dropdown-js-rounded","aria-expanded":g,"aria-controls":"multiSelectionDropdown","aria-label":`${n} options`,onClick:r=>J(),children:w.jsx("span",{className:"dropdown-js-arrow dropdown-js-padding","aria-label":`${n} options`,"aria-expanded":g,children:g?"-":"+"})})]}),w.jsx("div",{className:`dropdown-js-padding dropdown-js-menu ${!g&&"dropdown-js-hide"}`,id:l.dropdown,name:"dropDown",role:"listbox","aria-expanded":g,disabled:S,"aria-label":n,style:{...k,marginTop:"3.5px"},children:U.map((r,i)=>w.jsxs("div",{name:r,role:"option","aria-label":r,style:{cursor:"pointer"},onClick:f=>K(r),children:[r,i<U.length-1&&w.jsx("hr",{style:{borderColor:k.color}})]},`${i}#${r}`))})]})}Oe.propTypes={label:u.string.isRequired,data:u.array.isRequired,sortOrder:u.string,selected:u.any,isDisabled:u.bool,onItemSelected:u.func,dropdownStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string}),buttonStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string})};function Re({label:n,data:O,sortFields:z,selected:b=null,displayName:T,valueName:p,isDisabled:S=!1,onItemSelected:m=null,dropdownStyle:g}){const C=M.useId(),[y,j]=M.useState(null),[E,_]=M.useState(""),[U,A]=M.useState(""),I=M.useMemo(()=>O.toSorted(o),[O]),F=M.useMemo(()=>{if(U.length===0)return[];const h=U.toUpperCase();return I.filter(X=>X[T].toUpperCase().toUpperCase().includes(h))},[U]),[G,k]=M.useState(""),[P,s]=M.useState(null);M.useMemo(()=>{let h;if(P)h={...P};else if(b){const X=l(),Q=O.findIndex(e=>re.get(e,...X)===re.get(b,...X));Q>=0&&(h=O[Q])}return h&&k(h[T]),h},[b,P]);const H=M.useMemo(()=>U.length>0?F:I,[U,I]),K=(()=>{const h={backgroundColor:g?.backgroundColor,color:g?.color};return g?.fontSize&&(h.fontSize=g?.fontSize),h})(),J=g?.borderColor;async function t(h){A(X=>h.target.value),k(X=>h.target.value),F.length>0?c():f()}function o(h,X){return re.objCompare(h,X,...z)}function l(){let h=E;return h||(O.length>0&&(h=re.getPaths(O[0])),_(h)),h}function r(h){s(h),m!==null&&m(h),f()}function i(){y?f():c()}function f(){j(!1)}function c(){H.length>0&&j(!0)}const v={dropdownSearch:`dropdownObjSearch-${C}`,dropdownObj:`dropdownObj-${C}`};return w.jsxs("div",{className:`dropdown-js dropdown-js-rounded
                          ${J&&`dropdown-js-border ${J}`}`,style:{...S?{pointerEvents:"none"}:{}},children:[w.jsxs("div",{className:"dropdown-js-input-wrapper dropdown-js-rounded",style:K,children:[w.jsx("input",{id:v.dropdownSearch,name:"dropdownObjSearch",className:"dropdown-js-input dropdown-js-rounded",style:K,type:"text",autoComplete:"off",role:"combobox","aria-autocomplete":"list","aria-controls":v.dropdownObj,"aria-expanded":y,"aria-placeholder":`Type to Search for ${n}`,"aria-required":!0,onChange:h=>t(h),disabled:S,placeholder:`Type to Search for ${n}`,value:G}),w.jsx("div",{className:"dropdown-js-arrow-container dropdown-js-padding dropdown-js-rounded","aria-label":`${n} options`,"aria-expanded":y,onClick:h=>i(),children:w.jsx("span",{className:"dropdown-js-arrow dropdown-js-padding",children:y?"-":"+"})})]}),w.jsx("div",{className:`dropdown-js-padding dropdown-js-menu ${!y&&"dropdown-js-hide"}`,id:v.dropdownObj,name:"dropDownObj",role:"listbox","aria-expanded":y,style:{...K,marginTop:"3.5px"},children:H.map((h,X)=>w.jsxs("div",{name:h[T],role:"option","aria-label":h[T],style:{cursor:"pointer"},onClick:Q=>r(h),children:[h[T],X<H.length-1&&w.jsx("hr",{style:{borderColor:K.color}})]},`${h[p]}${X}`))})]})}Re.propTypes={label:u.string.isRequired,data:u.arrayOf(u.object).isRequired,sortFields:u.arrayOf(u.string).isRequired,selected:u.object,displayName:u.string.isRequired,valueName:u.string.isRequired,isDisabled:u.bool,onItemSelected:u.func,dropdownStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string})};function $e({label:n,data:O,sortFields:z,selectedData:b=[],maxNumSelections:T=null,displayName:p,valueName:S,isDisabled:m=!1,onItemsSelected:g=null,dropdownStyle:C,buttonStyle:y}){const j=M.useId(),[E,_]=M.useState(!1),[U,A]=M.useState(""),[I,F]=M.useState(""),G=M.useMemo(()=>O.toSorted(l),[O]),[k,P]=M.useState([]),s=M.useMemo(()=>k.length>0?k.filter(e=>G.findIndex(a=>{const x=o();return re.objCompare(e,a,...x)===0})>=0).toSorted(l):b.filter(e=>G.findIndex(a=>{const x=o();return re.objCompare(e,a,...x)===0})>=0).toSorted(l),[G,b,k]),H=M.useMemo(()=>{if(I.length===0)return[];const e=I.toUpperCase();return G.filter(a=>a[p].toUpperCase().includes(e))},[I]),K=M.useMemo(()=>I.length>0?H:G,[I,G]),J=(()=>{const e={backgroundColor:C?.backgroundColor,color:C?.color};return C?.fontSize&&(e.fontSize=C?.fontSize),e})(),t=C?.borderColor;M.useEffect(()=>{if(!p)throw new Error("displayName must be provided");if(!S)throw new Error("valueName must be provided")},[]);function o(){let e=U;return e||(O.length>0&&(e=re.getPaths(O[0])),A(e)),e}function l(e,a){return re.objCompare(e,a,...z)}function r(e){F(e.target.value),H.length>0?X():h()}function i(e){let a=[...s];if(f(e))a=a.filter(x=>{const R=o();return re.objCompare(x,e,...R)!==0});else{if(T!==null&&s.length>=T)return;a.push(e)}P(a)}function f(e){const a=o();return s.findIndex(x=>re.objCompare(x,e,...a)===0)>=0}function c(e){const a=o(),x=s.filter(R=>re.objCompare(R,e,...a)!==0);P(x),g!==null&&g(x)}function v(){E?h():X()}function h(){_(!1),g!==null&&g(s)}function X(){K.length>0&&_(!0)}const Q={multiSelectionDropdownObjSearch:`multiSelectionDropdownSearch-${j}`,multiSelectionDropdownObj:`multiSelectionDropdown-${j}`,selectedItems:`selectedItems-${j}`};return w.jsxs("div",{className:`dropdown-js dropdown-js-rounded 
                          ${t&&`dropdown-js-border ${t}`}`,style:{...m?{pointerEvents:"none"}:{}},children:[w.jsxs("div",{className:"dropdown-js-input-wrapper dropdown-js-rounded",style:J,children:[w.jsx("div",{children:w.jsx("input",{id:Q.multiSelectionDropdownObjSearch,name:"multiSelectionDropdownObjSearch",className:"dropdown-js-input dropdown-js-rounded",style:J,"aria-label":n,"aria-autocomplete":"list","aria-controls":Q.multiSelectionDropdownObj,role:"combobox","aria-expanded":E,"aria-haspopup":"listbox",type:"text",autoComplete:"off","aria-placeholder":`Type to Search for ${n}`,onChange:e=>r(e),placeholder:`Type to Search for ${n}`,value:I})}),w.jsx("div",{className:"dropdown-js-arrow-container dropdown-js-padding dropdown-js-rounded","aria-expanded":E,"aria-controls":"multiSelectionDropdownObj","aria-label":`${n} options`,onClick:e=>v(),children:w.jsx("span",{className:"dropdown-js-arrow dropdown-js-padding",children:E?"-":"+"})})]}),w.jsx("div",{className:"dropdown-js-padding dropdown-js-selected-wrapper dropdown-js-selected-container",children:w.jsx("div",{id:Q.selectedItems,className:"dropdown-js-selected-items","aria-label":`Selected ${n} options`,"aria-multiselectable":!0,"aria-live":"polite",children:s.map(e=>w.jsxs("span",{className:"dropdown-js-padding dropdown-js-rounded","aria-label":`${e[p]}`,style:{...J,margin:"3.5px",marginRight:"0px"},children:[e[p]," ",w.jsx("span",{className:"dropdown-js-padding",style:{cursor:"pointer"},"aria-label":`Remove ${e[p]}`,onClick:a=>c(e),children:"×"})]},`${e[S]}${e[p]}`))})}),w.jsxs("div",{className:`dropdown-js-padding dropdown-js-menu dropdown-js-rounded ${!E&&"dropdown-js-hide"}`,style:J,id:Q.multiSelectionDropdownObj,name:"multiSelectionDropdownObj",role:"listbox","aria-multiselectable":!0,"aria-expanded":E,children:[K.map(e=>w.jsxs("div",{children:[w.jsx("input",{id:`${e[S]}Checkbox`,type:"checkbox",name:`${e[p]}Checkbox`,role:"option","aria-label":`${e[p]}`,"aria-checked":f(e),style:{cursor:"pointer"},checked:f(e),onChange:a=>i(e),value:e[S]}),w.jsx("label",{style:{marginLeft:"5px"},htmlFor:`${e[S]}`,children:e[p]}),w.jsx("hr",{style:{backgroundColor:J.color,border:"none",height:"0.5px"}})]},`${e[S]}${e[p]}`)),w.jsx("button",{className:"dropdown-js-padding dropdown-js-round",style:y,title:"Done",disabled:K.length===0,"aria-label":`Close ${n} options`,onClick:e=>h(),type:"button",children:"Done"})]})]})}$e.propTypes={label:u.string.isRequired,data:u.arrayOf(u.object).isRequired,sortFields:u.arrayOf(u.string).isRequired,selectedData:u.arrayOf(u.object),maxNumSelections:u.number,displayName:u.string.isRequired,valueName:u.string.isRequired,isDisabled:u.bool,onItemsSelected:u.func,dropdownStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string}),buttonStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string})};function Pe({label:n,data:O,sortOrder:z="asc",selectedData:b=[],maxNumSelections:T=null,isDisabled:p=!1,onItemsSelected:S=null,dropdownStyle:m,buttonStyle:g}){const C=M.useId(),[y,j]=M.useState(!1),E=M.useMemo(()=>O.toSorted(H),[O]),[_,U]=M.useState(""),[A,I]=M.useState([]),F=M.useMemo(()=>A.length>0?A.filter(c=>E.findIndex(v=>v===c)>=0).toSorted(H):b.filter(c=>E.findIndex(v=>v===c)>=0).toSorted(H),[E,b,A]),G=M.useMemo(()=>{if(_.length===0)return[];const c=_.toUpperCase();return E.filter(v=>v.toUpperCase().includes(c))},[_]),k=M.useMemo(()=>_.length>0?G:E,[_,E]),P=(()=>{const c={backgroundColor:m?.backgroundColor,color:m?.color};return m?.fontSize&&(c.fontSize=m?.fontSize),c})(),s=m?.borderColor;function H(c,v){return re.compare(c,v,z)}function K(c){const v=c.target.value;U(v),k.length>0?i():r()}function J(c){let v=[...F];if(t(c))v=v.filter(h=>h!==c);else{if(T!==null&&v.length>=T)return;v.push(c)}I(v)}function t(c){return F.findIndex(v=>v===c)>=0}function o(c){const v=F.filter(h=>h!==c);I(h=>v),S!==null&&S(v)}function l(){y?r():i()}function r(){j(!1),S!==null&&S(F)}function i(){k.length>0&&j(!0)}const f={multiSelectionDropdownSearch:`multiSelectionDropdown-${C}`,multiSelectionDropdown:`multiSelectionDropdown-${C}`,selectedItems:`selectedItems-${C}`};return w.jsxs("div",{className:`dropdown-js dropdown-js-rounded 
-                         ${s&&`dropdown-js-border ${s}`}`,style:{...p?{pointerEvents:"none"}:{}},children:[w.jsxs("div",{className:"dropdown-js-input-wrapper dropdown-js-rounded",style:P,children:[w.jsx("div",{children:w.jsx("input",{className:"dropdown-js-input dropdown-js-rounded",id:f.multiSelectionDropdownSearch,name:"multiselectionDropdownSearch",style:P,type:"text",autoComplete:"off",role:"combobox","aria-label":n,"aria-placeholder":`Type to search for ${n}`,"aria-autocomplete":"list","aria-controls":f.multiSelectionDropdown,"aria-expanded":y,"aria-haspopup":"listbox",onChange:c=>K(c),placeholder:`Type to Search for ${n}`,value:_})}),w.jsx("div",{className:"dropdown-js-arrow-container dropdown-js-padding dropdown-js-rounded","aria-expanded":y,"aria-controls":"multiSelectionDropdown","aria-label":`${n} options`,onClick:c=>l(),children:w.jsx("span",{className:"dropdown-js-arrow dropdown-js-padding",children:y?"-":"+"})})]}),w.jsx("div",{className:"dropdown-js-padding dropdown-js-selected-wrapper dropdown-js-selected-container",children:w.jsx("div",{id:f.selectedItems,className:"dropdown-js-selected-items","aria-label":`Selected ${n} options`,"aria-live":"polite",children:F.map(c=>w.jsxs("span",{className:"dropdown-js-padding dropdown-js-rounded","aria-label":`${c}`,style:{...P,margin:"3.5px",marginRight:"0px"},children:[c," ",w.jsx("span",{style:{cursor:"pointer"},"aria-label":`Remove ${c}`,onClick:v=>o(c),children:"×"})]},`${c}`))})}),w.jsxs("div",{className:`dropdown-js-padding dropdown-js-menu dropdown-js-rounded ${!y&&"dropdown-js-hide"}`,style:P,id:f.multiSelectionDropdown,name:"multiSelectionDropdown",role:"listbox","aria-multiselectable":!0,"aria-expanded":y,children:[k.map((c,v)=>w.jsxs("div",{children:[w.jsx("input",{type:"checkbox",name:`${c}Checkbox`,role:"option","aria-label":c,"aria-checked":t(c),style:{cursor:"pointer"},checked:t(c),onChange:h=>J(c),value:c}),w.jsx("label",{style:{marginLeft:"5px"},htmlFor:`${c}`,children:c}),w.jsx("hr",{style:{backgroundColor:P.color,border:"none",height:"0.5px"}})]},`${v}#${c}`)),w.jsx("button",{className:"dropdown-js-padding dropdown-js-round",style:g,"aria-label":`Click to collapse ${n} options`,title:"Done",disabled:k.length===0,onClick:c=>r(),type:"button",children:"Done"})]})]})}Pe.propTypes={label:u.string.isRequired,data:u.array.isRequired,sortOrder:u.string,selectedData:u.array.isRequired,maxNumSelections:u.number,isDisabled:u.bool,onItemsSelected:u.func,dropdownStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string}),buttonStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string})};exports.Dropdown=Oe;exports.DropdownObj=Re;exports.MultiSelectionDropdown=Pe;exports.MultiSelectionDropdownObj=$e;
+                         ${s&&`dropdown-js-border ${s}`}`,style:{...p?{pointerEvents:"none"}:{}},children:[w.jsxs("div",{className:"dropdown-js-input-wrapper dropdown-js-rounded",style:P,children:[w.jsx("div",{children:w.jsx("input",{className:"dropdown-js-input dropdown-js-rounded",id:f.multiSelectionDropdownSearch,name:"multiselectionDropdownSearch",style:P,type:"text",autoComplete:"off",role:"combobox","aria-label":n,"aria-placeholder":`Type to search for ${n}`,"aria-autocomplete":"list","aria-controls":f.multiSelectionDropdown,"aria-expanded":y,"aria-haspopup":"listbox",onChange:c=>K(c),placeholder:`Type to Search for ${n}`,value:_})}),w.jsx("div",{className:"dropdown-js-arrow-container dropdown-js-padding dropdown-js-rounded","aria-expanded":y,"aria-controls":"multiSelectionDropdown","aria-label":`${n} options`,onClick:c=>l(),children:w.jsx("span",{className:"dropdown-js-arrow dropdown-js-padding",children:y?"-":"+"})})]}),w.jsx("div",{className:"dropdown-js-padding dropdown-js-selected-wrapper dropdown-js-selected-container",children:w.jsx("div",{id:f.selectedItems,className:"dropdown-js-selected-items","aria-label":`Selected ${n} options`,"aria-live":"polite",children:F.map(c=>w.jsxs("span",{className:"dropdown-js-padding dropdown-js-rounded","aria-label":`${c}`,style:{...P,margin:"3.5px",marginRight:"0px"},children:[c," ",w.jsx("span",{style:{cursor:"pointer"},"aria-label":`Remove ${c}`,onClick:v=>o(c),children:"×"})]},`${c}`))})}),w.jsxs("div",{className:`dropdown-js-padding dropdown-js-menu dropdown-js-rounded ${!y&&"dropdown-js-hide"}`,style:P,id:f.multiSelectionDropdown,name:"multiSelectionDropdown",role:"listbox","aria-multiselectable":!0,"aria-expanded":y,children:[k.map((c,v)=>w.jsxs("div",{children:[w.jsx("input",{type:"checkbox",name:`${c}Checkbox`,role:"option","aria-label":c,"aria-checked":t(c),style:{cursor:"pointer"},checked:t(c),onChange:h=>J(c),value:c}),w.jsx("label",{style:{marginLeft:"5px"},htmlFor:`${c}`,children:c}),w.jsx("hr",{style:{backgroundColor:P.color,border:"none",height:"0.5px"}})]},`${v}#${c}`)),w.jsx("button",{className:"dropdown-js-padding dropdown-js-round",style:g,"aria-label":`Click to collapse ${n} options`,title:"Done",disabled:k.length===0,onClick:c=>r(),type:"button",children:"Done"})]})]})}Pe.propTypes={label:u.string.isRequired,data:u.array.isRequired,sortOrder:u.string,selectedData:u.array,maxNumSelections:u.number,isDisabled:u.bool,onItemsSelected:u.func,dropdownStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string}),buttonStyle:u.shape({color:u.string.isRequired,backgroundColor:u.string.isRequired,fontSize:u.string,borderColor:u.string})};exports.Dropdown=Oe;exports.DropdownObj=Re;exports.MultiSelectionDropdown=Pe;exports.MultiSelectionDropdownObj=$e;

package/dist/dropdowns-js.es.js

@@ -1621,7 +1621,7 @@ Ve.propTypes = {
   label: l.string.isRequired,
   data: l.array.isRequired,
   sortOrder: l.string,
-  selectedData: l.array.isRequired,
+  selectedData: l.array,
   maxNumSelections: l.number,
   isDisabled: l.bool,
   onItemsSelected: l.func,

package/package.json

@@ -3,7 +3,7 @@
   "author": "ITA",
   "description": "A React library providing customizable search dropdown components with single and multi-selection capabilities.",
   "private": false,
-  "version": "1.1.5",
+  "version": "1.1.6",
   "type": "module",
   "main": "./dist/dropdowns-js.cjs.js",
   "module": "./dist/dropdowns-js.es.js",