chore: make load private and remove bind:this examples

BREAKING: removed export of 'load' method from both module and instance scopes

Author: kaisermann

.eslintrc

@@ -1,33 +1,8 @@
 {
-  "root": true,
-  "extends": ["eslint:recommended", "prettier", "prettier/standard"],
-  "plugins": ["prettier", "html", "svelte3"],
-  "overrides": [
-    {
-      "files": ["**/*.svelte"],
-      "processor": "svelte3/svelte3"
-    }
-  ],
+  "extends": "@kiwi/eslint-config/svelte",
   "parser": "babel-eslint",
-  "settings": {
-    "html/html-extensions": [".html", ".svelte"],
-    "html/indent": "+2",
-    "html/report-bad-indent": "warn"
-  },
-  "env": {
-    "browser": true,
-    "es6": true
-  },
-  "parserOptions": {
-    "ecmaFeatures": {
-      "modules": true
-    }
-  },
-  "globals": {
-    "$$props": true
-  },
   "rules": {
-    "no-unused-vars": "off",
-    "no-unused-labels": "off"
+    "camelcase": 0,
+    "import/first": 0
   }
 }

Loadable.svelte

@@ -10,10 +10,11 @@
     TIMEOUT: 4,
   })
 
-  export function findByResolved(resolved) {
-    for (let [loader, r] of ALL_LOADERS) {
+  function findByResolved(resolved) {
+    for (const [loader, r] of ALL_LOADERS) {
       if (r === resolved) return loader
     }
+
     return null
   }
 
@@ -24,14 +25,15 @@
     if (loader) return loader
 
     ALL_LOADERS.set(loadable.loader, resolved)
+
     return loadable.loader
   }
 
   export function preloadAll() {
     return Promise.all(
       Array.from(ALL_LOADERS.keys())
         .filter((loader) => !LOADED.has(loader))
-        .map(async (loader) => load(loader)),
+        .map((loader) => loadComponent(loader)),
     ).then(() => {
       /** If new loaders have been registered by loaded components, load them next. */
       if (ALL_LOADERS.size > LOADED.size) {
@@ -40,17 +42,16 @@
     })
   }
 
-  export async function load(loader, unloader) {
+  async function loadComponent(loader, unloader) {
     const componentModule = await loader()
     const component = componentModule.default || componentModule
 
     if (!unloader) {
       LOADED.set(loader, component)
     }
+
     return component
   }
-
-  let loadComponent = load
 </script>
 
 <script>
@@ -63,21 +64,25 @@
   export let component = null
   export let error = null
 
+  const slots = $$props.$$slots
+
   let load_timer = null
   let timeout_timer = null
   let state = STATES.INITIALIZED
   let componentProps
-  let slots = $$props.$$slots
   let mounted = false
 
   $: {
-    let { delay, timeout, loader, component, error, ...rest } = $$props
+    // eslint-disable-next-line no-shadow
+    const { delay, timeout, loader, component, error, ...rest } = $$props
+
     componentProps = rest
   }
 
   const dispatch = createEventDispatcher()
 
   const capture = getContext('svelte-loadable-capture')
+
   if (typeof capture === 'function' && ALL_LOADERS.has(loader)) {
     capture(loader)
   }
@@ -87,7 +92,7 @@
     clearTimeout(timeout_timer)
   }
 
-  export async function load() {
+  async function load() {
     clearTimers()
 
     if (typeof loader !== 'function') {

example/src/App.svelte

@@ -1,17 +1,19 @@
 <script>
   import Loadable from '../../Loadable.svelte'
 
-  let retry
-
-  const getDelayedLoader = (delay = 3000) => () =>
-    new Promise((resolve, reject) =>
-      setTimeout(() => resolve(import('./AsyncComponent.svelte')), delay),
-    )
-
-  const getFailureLoader = (delay = 3000) => () =>
-    new Promise((resolve, reject) =>
-      setTimeout(() => reject(new Error('Some error')), delay),
-    )
+  const getDelayedLoader =
+    (delay = 3000) =>
+    () =>
+      new Promise((resolve) =>
+        setTimeout(() => resolve(import('./AsyncComponent.svelte')), delay),
+      )
+
+  const getFailureLoader =
+    (delay = 3000) =>
+    () =>
+      new Promise((resolve, reject) =>
+        setTimeout(() => reject(new Error('Some error')), delay),
+      )
 </script>
 
 <h1>This one will work</h1>