abaabil.dialog - npm Package Compare versions

Comparing version 0.1.11 to 0.1.12

dist/index.esm.min.js

@@ -1,1 +0,1 @@
-import*as e from"react";import F from"react-dom";import v from"abaabil.button";const $=({icon:p,label:g,title:u,subtitle:a,children:x,dialogContainerClassName:h,overlayClassName:k,dialogClassName:w,buttonClassName:E,isOpen:c,setIsOpen:n,onOpen:m,onClose:i,...N})=>{const[s,l]=e.useState(!1),o=e.useRef(null),r=e.useRef(null),d=e.useRef(null),y=e.useRef(null);e.useEffect(()=>{c!==void 0&&l(c)},[c]),e.useEffect(()=>{if(!(typeof window>"u"))if(s){if(y.current=document.activeElement,o.current.focus(),document.body.style.overflow="hidden",o.current){const f=o.current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');f.length>0&&(r.current=f[0],r.current.focus()),f.length>1&&(d.current=f[f.length-1]),o.current.addEventListener("keydown",t=>{if(t.key==="Tab"||t.keyCode===9){if(f.length===1){t.preventDefault();return}t.shiftKey?document.activeElement===r.current&&(t.preventDefault(),d.current.focus()):document.activeElement===d.current&&(t.preventDefault(),r.current.focus())}else(t.key==="Escape"||t.keyCode===27)&&(typeof i=="function"&&i(),typeof n=="function"&&n(!1),l(!1))})}}else y.current?.focus(),document.body.style.overflow=""},[s]);const b=u||a,D=s&&typeof document<"u"?e.createElement("div",{className:`fixed inset-0 z-dialog flex items-center justify-center p-4 ${h}`},e.createElement("button",{className:`fixed inset-0 bg-black/50 backdrop-blur-none transition-all hover:backdrop-blur-[1px] hover:bg-black/60 ${k}`,onClick:()=>{typeof i=="function"&&i(),typeof n=="function"&&n(!1),l(!1)}}),e.createElement("div",{ref:o,role:"dialog","aria-modal":"true","aria-labelledby":u||"dialog-title","aria-describedby":a||"dialog-subtitle",className:`max-w-3xl w-full relative overflow-hidden bg-floating text-on-floating rounded-default shadow-floating ${w}`,...N},b&&e.createElement("div",{className:"flex items-center justify-between p-5 border-b border-layer-light-1"},e.createElement("div",{className:"flex flex-col space-y-2 max-w-[80%]"},u&&e.createElement("h4",{id:"dialog-title",className:"truncate"},u),a&&e.createElement("small",{id:"dialog-subtitle",className:"truncate text-surface-inverse"},a)),e.createElement(v,{icon:"x",onClick:()=>{typeof i=="function"&&i(),l(!1)},"aria-label":"Close dialog"})),e.createElement("div",{className:b?"p-4":""},x))):null;return e.createElement(e.Fragment,null,e.createElement(v,{icon:p,className:E,onClick:()=>{typeof m=="function"&&m(),typeof n=="function"&&n(!0),l(!0)}},g),typeof document<"u"?F.createPortal(D,document.body):null)};var I=$;export{I as default};
+import*as e from"react";import N from"react-dom";import D from"abaabil.icon";import F from"abaabil.button";const I=({icon:m,label:b,title:y,subtitle:p,children:g,dialogContainerClassName:v,overlayClassName:h,dialogClassName:x,buttonClassName:k,isOpen:r,setIsOpen:n,onOpen:s,onClose:f,...E})=>{const[a,u]=e.useState(!1),o=e.useRef(null),l=e.useRef(null),c=e.useRef(null),d=e.useRef(null);e.useEffect(()=>{r!==void 0&&u(r)},[r]),e.useEffect(()=>{if(!(typeof window>"u"))if(a){if(d.current=document.activeElement,o.current.focus(),document.body.style.overflow="hidden",o.current){const i=o.current.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');i.length>0&&(l.current=i[0],l.current.focus()),i.length>1&&(c.current=i[i.length-1]),o.current.addEventListener("keydown",t=>{if(t.key==="Tab"||t.keyCode===9){if(i.length===1){t.preventDefault();return}t.shiftKey?document.activeElement===l.current&&(t.preventDefault(),c.current.focus()):document.activeElement===c.current&&(t.preventDefault(),l.current.focus())}else(t.key==="Escape"||t.keyCode===27)&&(typeof f=="function"&&f(),typeof n=="function"&&n(!1),u(!1))})}}else d.current?.focus(),document.body.style.overflow=""},[a]);const w=a&&typeof document<"u"?e.createElement("div",{className:`fixed inset-0 z-dialog flex items-center justify-center p-4 ${v}`},e.createElement("button",{className:`fixed inset-0 bg-black/50 backdrop-blur-none transition-all hover:backdrop-blur-[1px] hover:bg-black/60 ${h}`,onClick:()=>{typeof f=="function"&&f(),typeof n=="function"&&n(!1),u(!1)}}),e.createElement("div",{ref:o,role:"dialog","aria-modal":"true","aria-labelledby":y||"dialog-title","aria-describedby":p||"dialog-subtitle",className:`max-w-3xl w-full min-h-20 relative overflow-hidden bg-floating text-on-floating rounded-default shadow-floating ${x}`,...E},e.createElement("button",{onClick:()=>{typeof f=="function"&&f(),u(!1)},className:"text-stable p-2 absolute top-1 right-1","aria-label":"Close dialog"},e.createElement(D,{id:"x",className:"w-8 h-8"})),g)):null;return e.createElement(e.Fragment,null,e.createElement(F,{icon:m,className:k,onClick:()=>{typeof s=="function"&&s(),typeof n=="function"&&n(!0),u(!0)}},b),typeof document<"u"?N.createPortal(w,document.body):null)};var j=I;export{j as default};

package.json

 {
   "name": "abaabil.dialog",
   "author": "Abaabil",
-  "version": "0.1.11",
+  "version": "0.1.12",
   "main": "dist/index.esm.min.js",
@@ -35,3 +35,3 @@ "files": [
   ],
-  "gitHead": "5f1e16130a1c13e1ec6d6b747895ee38eb684760"
+  "gitHead": "5afc13169467dd0ea31ab244ffea9e9b00169f5e"
 }

New alerts

Trivial Package

Supply chain risk

Packages less than 10 lines of code are easily copied into your own project and may not warrant the additional supply chain risk of an external dependency.

Found 1 instance in 1 package

Fixed alerts

Trivial Package

Supply chain risk

Packages less than 10 lines of code are easily copied into your own project and may not warrant the additional supply chain risk of an external dependency.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

4347

decreased by-5.7%

Lines of code

9

decreased by-10%

No dependency changes