feat(baselogic): boolean shenanigans

README.md

@@ -2,6 +2,12 @@
 
 **[DOCS](https://pimdewit.github.io/focusmanager)**
 
+## Installation
+
+`npm install --save @pdw.io/focusmanager`
+or
+`yarn add @pdw.io/focusmanager`
+
 ## Concept
 
 A utility class that aides with computational focus.
@@ -26,7 +32,8 @@ fm.allowFocusToSection('mydialog');
 There are several utility functions available that could proof useful in your app.
 
 ```javascript
-import * as utilities from 'focusmanager/utilities';
+import * as utilities from '@pdw.io/focusmanager/utilities';
+// Or treeshaking `import {ariaHidden} from '@pdw.io/focusmanager/utilities';`
 
 utilities.ariaHidden(myElement, true);
 ```

docs/FocusManager.Utilities.html

@@ -521,7 +521,7 @@ <h5>Parameters</h5>
 							<div class="form-group">
 								<label class="col-sm-3 control-label">Source</label>
 								<div class="col-sm-9">
-									<p class="form-control-static"><a href="utilities.js.html">utilities.js</a>, <a href="utilities.js.html#line-118">line 118</a></p>
+									<p class="form-control-static"><a href="utilities.js.html">utilities.js</a>, <a href="utilities.js.html#line-119">line 119</a></p>
 								</div>
 							</div>
 

docs/index.html

@@ -63,17 +63,22 @@ <h1><span class="name">FocusManager</span></h1>
 		<div class="row">
 			<div class="col-md-9 main-content">
 		<section class="readme-section">
-			<article><h1>FocusManager</h1><h2>Concept</h2><p>A utility class that aides with computational focus.
+			<article><h1>FocusManager</h1><p><strong><a href="https://pimdewit.github.io/focusmanager">DOCS</a></strong></p>
+<h2>Installation</h2><p><code>npm install --save @pdw.io/focusmanager</code>
+or
+<code>yarn add @pdw.io/focusmanager</code></p>
+<h2>Concept</h2><p>A utility class that aides with computational focus.
 The main motivation for creating such a module comes from <code>inert</code> and its inconvenient way of intentional &quot;focus-trapping&quot; for e.g a dialog or drawer. On several projects I found myself creating an array of different sections of the site only to give them an attribute. Hopefully this class helps with that. Alongside that it has some common a11y functions.</p>
 <pre class="prettyprint source lang-html"><code>&lt;nav data-focus-section=&quot;topbar&quot;>&lt;/nav>
 &lt;main data-focus-section=&quot;main&quot;>&lt;/main>
 &lt;dialog data-focus-section=&quot;mydialog&quot;>&lt;/dialog></code></pre><pre class="prettyprint source lang-javascript"><code>import FocusManager from 'focusmanager';
 const fm = new FocusManager();
 fm.rejectFocusToAllSections();
 fm.allowFocusToSection('mydialog');</code></pre><h2>Utilities</h2><p>There are several utility functions available that could proof useful in your app.</p>
-<pre class="prettyprint source lang-javascript"><code>import * as utilities from 'focusmanager/utilities';
+<pre class="prettyprint source lang-javascript"><code>import * as utilities from '@pdw.io/focusmanager/utilities';
+// Or treeshaking `import {ariaHidden} from '@pdw.io/focusmanager/utilities';`
 
-utilities.ariaHidden(myElement, true);</code></pre></article>
+utilities.ariaHidden(myElement, true);</code></pre><p><strong><a href="https://pimdewit.github.io/focusmanager">DOCS</a></strong></p></article>
 		</section>
 			</div>
 				<div class="col-md-3 side-content">

docs/utilities.js.html

@@ -170,8 +170,9 @@ <h1><span class="name">utilities.js</span></h1>
  * @param {boolean} shouldBeFocusable - Whether the element is allowed focus or not.
  */
 export function focusable(element, shouldBeFocusable) {
-  ariaHidden(element, shouldBeFocusable);
-  inert(element, shouldBeFocusable);
+  const giveFocus = !shouldBeFocusable;
+  ariaHidden(element, giveFocus);
+  inert(element, giveFocus);
 }
 
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pdw.io/focusmanager",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "A utility class that aides with computational focus.",
   "main": "index.js",
   "scripts": {

utilities.js

@@ -104,8 +104,9 @@ export function restoreFocus(waitAFrame = false) {
  * @param {boolean} shouldBeFocusable - Whether the element is allowed focus or not.
  */
 export function focusable(element, shouldBeFocusable) {
-  ariaHidden(element, shouldBeFocusable);
-  inert(element, shouldBeFocusable);
+  const giveFocus = !shouldBeFocusable;
+  ariaHidden(element, giveFocus);
+  inert(element, giveFocus);
 }