solid-dismiss - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

dist/esm/index.js

@@ -1257,3 +1257,3 @@ import { insert, template, delegateEvents, addEventListener, effect, setAttribute, classList, createComponent, mergeProps } from 'solid-js/web';
 const _tmpl$ = template(`<div role="presentation"></div>`, 2),
-      _tmpl$2 = template(`<div><div tabindex="0" style="position: fixed; top: 0; left: 0; outline: none; pointer-events: none; width: 0; height: 0;" aria-hidden="true"></div><div style="position: fixed; top: 0; left: 0; outline: none; pointer-events: none; width: 0; height: 0;" aria-hidden="true"></div></div>`, 6);
+      _tmpl$2 = template(`<div><div style="position: fixed; top: 0; left: 0; outline: none; pointer-events: none; width: 0; height: 0;" aria-hidden="true"></div><div style="position: fixed; top: 0; left: 0; outline: none; pointer-events: none; width: 0; height: 0;" aria-hidden="true"></div></div>`, 6);
 
@@ -1733,3 +1733,4 @@ /**
               _v$5 = props.classList || {},
-              _v$6 = state.hasFocusSentinels ? "0" : "-1";
+              _v$6 = props.open() ? "0" : "-1",
+              _v$7 = state.hasFocusSentinels && props.open() ? "0" : "-1";
 
@@ -1739,3 +1740,4 @@ _v$3 !== _p$._v$3 && setAttribute(_el$2, "id", _p$._v$3 = _v$3);
         _p$._v$5 = classList(_el$2, _v$5, _p$._v$5);
-        _v$6 !== _p$._v$6 && setAttribute(_el$4, "tabindex", _p$._v$6 = _v$6);
+        _v$6 !== _p$._v$6 && setAttribute(_el$3, "tabindex", _p$._v$6 = _v$6);
+        _v$7 !== _p$._v$7 && setAttribute(_el$4, "tabindex", _p$._v$7 = _v$7);
         return _p$;
@@ -1746,3 +1748,4 @@ }, {
         _v$5: undefined,
-        _v$6: undefined
+        _v$6: undefined,
+        _v$7: undefined
       });
@@ -1749,0 +1752,0 @@

dist/source/index.jsx

@@ -384,7 +384,7 @@ import "./browserInfo";
         return (<div id={state.id} class={props.class} classList={props.classList || {}} onFocusIn={state.onFocusInContainerRef} onFocusOut={state.onFocusOutContainerRef} ref={state.refContainerCb}>
-        <div tabindex="0" onFocus={(e) => {
+        <div tabindex={props.open() ? "0" : "-1"} onFocus={(e) => {
                 onFocusSentinel(state, "first", e.relatedTarget);
             }} style="position: fixed; top: 0; left: 0; outline: none; pointer-events: none; width: 0; height: 0;" aria-hidden="true" ref={state.focusSentinelFirstEl}></div>
         {children}
-        <div tabindex={state.hasFocusSentinels ? "0" : "-1"} onFocus={() => {
+        <div tabindex={state.hasFocusSentinels && props.open() ? "0" : "-1"} onFocus={() => {
                 onFocusSentinel(state, "last");
@@ -391,0 +391,0 @@ }} style="position: fixed; top: 0; left: 0; outline: none; pointer-events: none; width: 0; height: 0;" aria-hidden="true" ref={state.focusSentinelLastEl}></div>

package.json

 {
   "name": "solid-dismiss",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "homepage": "https://aquaductape.github.io/solid-dismiss/",
@@ -5,0 +5,0 @@ "description": "Handles \"click outside\" behavior for popup menu. Closing is triggered by click/focus outside of popup element or pressing \"Escape\" key.",

README.md

 <h1 align="center">Solid Dismiss
-<img src="assets/logo.svg" width="40px" height="35px" style="position: relative; top: 5px;">
+<img src="assets/logo.svg" width="40px" height="35px" style="position: relative; top: 5px; pointer-events: none;">
 </h1>
 
-<sup>
-<img src="https://img.shields.io/badge/size%20(gzip)-~6.6kb-brightgreen" alt="size of package gzip" />
-  </sup>
+<img src="https://img.shields.io/badge/size%20(gzip)-~7kb-brightgreen" alt="size of package gzip" />
 
@@ -53,3 +51,3 @@ Handles "click outside" behavior for popup menu. Closing is triggered by click/focus outside of popup element or pressing "Escape" key. It can also deal with stacks/layers of popups.
 
-For iOS devices: when clicking outside, without overlay, and the element that happened to be clicked upon was an iframe,there's a chance that the popup won't close. iframe detection interaction is feasible by checking if window blurs, but in iOS, unless the user taps on a clickable element inside iframe, window won't blur because the main page focus hasn't been blurred.
+For iOS Safari: when clicking outside, without overlay, and the element that happened to be clicked upon was an iframe, there's a chance that the popup won't close. iframe detection interaction is feasible by checking if window blurs, but in iOS, unless the user taps on a clickable element inside iframe, window won't blur because the main page focus hasn't been blurred.
 
@@ -56,0 +54,0 @@ If the iframe body element has click listener, then tapping anywhere on iframe will blur window, thus closing the popup as intended. Thus if author is dealing with same domain iframes, the author can easily add empty click event listener to the body.

No alert changes

Improved metrics

Total package byte prevSize

252678

increased by0.13%

Lines of code

3454

increased by0.09%

Worsened metrics

Number of lines in readme file

325

decreased by-0.61%

No dependency changes