abaabil.combobox - npm Package Compare versions

Comparing version 0.1.8 to 0.1.9

dist/index.esm.min.js

@@ -1,1 +0,1 @@
-import*as t from"react";import D from"abaabil.icon";import A from"abaabil.button";const E=({icon:h,actionIcon:k,buttonClassName:x,ulClassName:w,liClassName:p,options:s,onChange:y,placeholder:c})=>{const f=t.useRef(null),d=t.useRef(null),[o,r]=t.useState(!1),[n,v]=t.useState(-1),[l,u]=t.useState(-1);t.useEffect(()=>{o&&(d.current?.focus(),u(n!==-1?n:0))},[o,n]);const m=e=>{v(e),u(e),r(!1),y(s[e]),f.current?.focus()},g=e=>{if(!o&&(e.key==="Enter"||e.key===" "||e.key==="ArrowRight"||e.key==="ArrowDown"))e.preventDefault(),r(!0);else if(o)switch(e.key){case"ArrowRight":case"ArrowDown":{e.preventDefault(),u(a=>a<s.length-1?a+1:0);break}case"ArrowLeft":case"ArrowUp":{e.preventDefault(),u(a=>a>0?a-1:s.length-1);break}case"Enter":{e.preventDefault(),l!==-1&&m(l);break}case"Escape":{e.preventDefault(),r(!1),f.current?.focus();break}case"Tab":{e.preventDefault(),l!==-1?m(l):r(!1);const i=Array.from(document.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')),b=i.indexOf(f.current);e.shiftKey?b>0&&i[b-1].focus():b<i.length-1&&i[b+1].focus();break}default:break}};return t.useEffect(()=>{o&&l!==-1&&d.current?.children[l]?.scrollIntoView({block:"nearest"})},[o,l]),t.createElement("div",{className:"relative"},t.createElement(A,{ref:f,icon:c&&s[n]?.icon||h,actionIcon:k,onClick:()=>r(!o),onKeyDown:g,className:x,"aria-haspopup":"listbox","aria-expanded":o,"aria-activedescendant":l!==-1?s[l].key:void 0,"aria-controls":"combobox-listbox","aria-label":c||"Select an option"},n!==-1?c?s[n].label:"":c),o&&t.createElement("ul",{ref:d,className:`absolute mt-1 overflow-auto rounded-default shadow-default bg-floating text-on-floating z-combobox ${w}`,role:"listbox",tabIndex:"-1",onKeyDown:g,"aria-multiselectable":"false"},s.map((e,a)=>t.createElement("li",{key:e.key,role:"option","aria-selected":a===n,onClick:()=>m(a),"aria-setsize":s.length,"aria-posinset":a+1,className:`flex items-center cursor-pointer select-none h-default text-default px-default hover:bg-floating-hover ${p} ${a===n&&"bg-floating-focus"} ${a===l&&"bg-floating-hover"}`},e.icon&&t.createElement(D,{id:e.icon}),t.createElement("span",{className:"mx-2"},e.label)))))};var N=E;export{N as default};
+import*as t from"react";import D from"abaabil.icon";import A from"abaabil.button";const E=({icon:g,actionIcon:k,buttonClassName:x,ulClassName:w,liClassName:p,options:s,onChange:y,placeholder:c})=>{const f=t.useRef(null),d=t.useRef(null),[l,r]=t.useState(!1),[n,v]=t.useState(-1),[o,i]=t.useState(-1);t.useEffect(()=>{l&&(d.current?.focus(),i(n!==-1?n:0))},[l,n]);const m=e=>{v(e),i(e),r(!1),y(s[e]),f.current?.focus()},h=e=>{if(!l&&(e.key==="Enter"||e.key===" "||e.key==="ArrowRight"||e.key==="ArrowDown"))e.preventDefault(),r(!0);else if(l)switch(e.key){case"ArrowRight":case"ArrowDown":{e.preventDefault(),i(a=>a<s.length-1?a+1:0);break}case"ArrowLeft":case"ArrowUp":{e.preventDefault(),i(a=>a>0?a-1:s.length-1);break}case"Enter":{e.preventDefault(),o!==-1&&m(o);break}case"Escape":{e.preventDefault(),r(!1),f.current?.focus();break}case"Tab":{e.preventDefault(),o!==-1?m(o):r(!1);const u=Array.from(document.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')),b=u.indexOf(f.current);e.shiftKey?b>0&&u[b-1].focus():b<u.length-1&&u[b+1].focus();break}default:break}};return t.useEffect(()=>{l&&o!==-1&&d.current?.children[o]?.scrollIntoView({block:"nearest"})},[l,o]),t.createElement("div",{className:"relative"},t.createElement(A,{ref:f,icon:c&&s[n]?.icon||g,actionIcon:k,onClick:()=>r(!l),onKeyDown:h,className:x,"aria-haspopup":"listbox","aria-expanded":l,"aria-activedescendant":o!==-1?s[o].key:void 0,"aria-controls":"combobox-listbox","aria-label":c||"Select an option"},n!==-1?c?s[n].label:"":c),l&&t.createElement("ul",{ref:d,className:`absolute mt-1 overflow-auto rounded-default shadow-floating bg-floating text-on-floating z-combobox ${w}`,role:"listbox",tabIndex:"-1",onKeyDown:h,"aria-multiselectable":"false"},s.map((e,a)=>t.createElement("li",{key:e.key,role:"option","aria-selected":a===n,onClick:()=>m(a),"aria-setsize":s.length,"aria-posinset":a+1,className:`flex items-center cursor-pointer select-none h-default text-default px-default hover:bg-floating-hover ${p} ${a===n&&"bg-floating-focus"} ${a===o&&"bg-floating-hover"}`},e.icon&&t.createElement(D,{id:e.icon}),t.createElement("span",{className:"mx-2"},e.label)))))};var N=E;export{N as default};

package.json

 {
   "name": "abaabil.combobox",
   "author": "Abaabil",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "main": "dist/index.esm.min.js",
@@ -14,3 +14,3 @@ "files": [
   "dependencies": {
-    "abaabil.button": "^0.1.8",
+    "abaabil.button": "^0.1.9",
     "abaabil.icon": "^0.1.6"
@@ -36,3 +36,3 @@ },
   ],
-  "gitHead": "c1e41159e3f282e52e4f2d520611ab9da3634960"
+  "gitHead": "e9bc1836057ae68aabdab77c1aa063927a7b756f"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4280

increased by0.02%

Dependency changes

• Updatedabaabil.button@^0.1.9