@txstate-mws/svelte-components 1.0.0 → 1.0.1

package/dist/components/FocusLock.svelte

@@ -10,6 +10,7 @@ let className = '';
 export { className as class };
 import { onMount, onDestroy, createEventDispatcher, tick } from 'svelte';
 import { tabbable } from 'tabbable';
+import { sleep } from 'txstate-utils';
 import { buttonify } from '../actions';
 import ScreenReaderOnly from './ScreenReaderOnly.svelte';
 const dispatch = createEventDispatcher();
@@ -19,7 +20,7 @@ let active = true;
 let listenforescape = false;
 if (initialfocus)
     hidefocus = false;
-onMount(() => {
+onMount(async () => {
     const prevFocusLock = FocusLockStack.slice(-1)[0];
     if (prevFocusLock)
         prevFocusLock.pause();
@@ -30,6 +31,7 @@ onMount(() => {
     if (typeof returnfocusto === 'undefined') {
         returnfocusto = document.querySelector(':focus');
     }
+    await sleep(1); // sapper resets focus on page load, so we'll wait a millisecond in case our modal is on screen at load
     if (initialfocus) {
         const focusEl = lockelement.querySelector(initialfocus);
         if (focusEl instanceof HTMLElement)
@@ -78,7 +80,7 @@ const focusin = (e) => {
             setInitialFocus();
     }
 };
-const windowclick = (e) => {
+const windowclick = (_) => {
     if (listenforescape && active) {
         returnfocusto = undefined;
         dispatch('escape');

package/dist/ts/components/FocusLock.svelte

@@ -13,6 +13,7 @@
 
   import { onMount, onDestroy, createEventDispatcher, tick } from 'svelte'
   import { tabbable } from 'tabbable'
+  import { sleep } from 'txstate-utils'
   import { buttonify } from '../actions'
   import ScreenReaderOnly from './ScreenReaderOnly.svelte'
   const dispatch = createEventDispatcher()
@@ -21,7 +22,7 @@
   let active = true
   let listenforescape = false
   if (initialfocus) hidefocus = false
-  onMount(() => {
+  onMount(async () => {
     const prevFocusLock = FocusLockStack.slice(-1)[0]
     if (prevFocusLock) prevFocusLock.pause()
     FocusLockStack.push({
@@ -31,6 +32,7 @@
     if (typeof returnfocusto === 'undefined') {
       returnfocusto = document.querySelector(':focus') as HTMLElement
     }
+    await sleep(1) // sapper resets focus on page load, so we'll wait a millisecond in case our modal is on screen at load
     if (initialfocus) {
       const focusEl = lockelement.querySelector(initialfocus)
       if (focusEl instanceof HTMLElement) focusEl.focus()
@@ -74,7 +76,7 @@
       else setInitialFocus()
     }
   }
-  const windowclick = (e: MouseEvent) => {
+  const windowclick = (_: MouseEvent) => {
     if (listenforescape && active) {
       returnfocusto = undefined
       dispatch('escape')

package/package.json

@@ -1,10 +1,16 @@
 {
   "name": "@txstate-mws/svelte-components",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Svelte components that are generically useful.",
   "main": "dist/index.js",
   "module": "esm/index.js",
-  "svelte": "esm/index.js",
+  "exports": {
+    ".": {
+      "require": "./dist/index.js",
+      "import": "./esm/index.js"
+    },
+    "./package.json": "./package.json"
+  },
   "types": "dist/ts/index.d.ts",
   "scripts": {
     "test": "jest src",
@@ -31,17 +37,11 @@
     "@testing-library/jest-dom": "^5.11.9",
     "@testing-library/svelte": "^3.0.3",
     "@testing-library/user-event": "^13.1.9",
-    "@tsconfig/svelte": "^2.0.1",
+    "@tsconfig/svelte": "^3.0.0",
     "@types/jest": "^27.0.2",
     "@types/node": "^15.3.1",
-    "@typescript-eslint/eslint-plugin": "^4.14.1",
-    "@typescript-eslint/parser": "^4.14.1",
     "babel-jest": "^27.3.1",
-    "eslint": "^7.18.0",
     "eslint-config-standard-with-typescript": "^21.0.1",
-    "eslint-plugin-import": "^2.22.0",
-    "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^5.1.0",
     "eslint-plugin-svelte3": "^3.0.0",
     "fs-extra": "^10.0.0",
     "glob": "^7.1.6",