solid-ctrl-flow 1.0.30 → 1.0.32

package/dist/index.d.ts

@@ -172,6 +172,13 @@ declare type Info = {
  */
 export declare function memoProps<T, K extends readonly (keyof T)[] = (keyof T)[]>(obj: T, keys?: K): Pick<T, K[number]>;
 
+/** Like a {@link Suspence}, but enables you to turn it off and show the loading state */
+export declare function OptionalSuspense(props: {
+    active: boolean;
+    children: JSX.Element;
+    fallback?: JSX.Element;
+}): JSX.Element;
+
 /**
  * Executes a {@link Ref}.
  * Throws a {@link ReferenceError} if {@link ref} its not a function at runtime (Which should never be the case thanks to the solid compiler)
@@ -181,9 +188,17 @@ export declare function memoProps<T, K extends readonly (keyof T)[] = (keyof T)[
  */
 export declare function refCall<T, U extends T = T>(ref: Ref<T> | undefined, value: U): U;
 
+/**
+ * Executes {@link f} and then calls {@link d} regardless of errors.
+ * If {@link f} returns a {@link Promise}, {@link d} will be called asynchronously
+ * @returns The same thing {@link f} returned
+ */
+export declare function runAndDispose<R>(d: () => void, f: () => R): R;
+
 /**
  * Executes {@link f} with the provided value for the specified {@link Context}.
- * You can pass `undefined` to {@link value} in order to get back the default value for {@link ctx}
+ * You can pass `undefined` to {@link value} in order to get back the default value for {@link ctx}.
+ * Everything that happens {@link f} will be disposed as soon as the execution ends
  * @param ctx The context to which to set the value
  * @param value The value for the context
  * @param f The function to run

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { untrack, createMemo, splitProps, createContext, getOwner, runWithOwner, createEffect, on, createResource, createComponent, useContext, createRoot, createRenderEffect, onCleanup, Match, mergeProps, For, Show } from "solid-js";
+import { untrack, createMemo, splitProps, createContext, createRoot, createEffect, on, createResource, createComponent, useContext, getOwner, createRenderEffect, onCleanup, Match, mergeProps, For, Show, Suspense } from "solid-js";
 import { createMutable } from "solid-js/store";
 function untrackCall(f, ...args) {
   return untrack(() => f.apply(this, args));
@@ -43,18 +43,12 @@ function createOption(init, def = init, name) {
   return provider;
 }
 function runWithContext(ctx2, value, f) {
-  const owner = getOwner();
-  const context = {
-    ...owner?.context,
-    [ctx2.id]: value
-  };
-  const temp = {
-    context,
-    owner,
-    owned: null,
-    cleanups: null
-  };
-  return runWithOwner(temp, () => f(value));
+  return createRoot((d) => {
+    return runAndDispose(d, () => {
+      (getOwner().context ??= {})[ctx2.id] = value;
+      return f(value);
+    });
+  });
 }
 function createReactiveResource(f) {
   var refetch;
@@ -65,6 +59,14 @@ function createReactiveResource(f) {
   }] = createResource(memo);
   return get;
 }
+function runAndDispose(d, f) {
+  try {
+    const out = f();
+    return out instanceof Promise ? out.finally(d) : (d(), out);
+  } catch (ex) {
+    throw d(), ex;
+  }
+}
 const IDENTITY = (x) => x;
 function bind([get], [, set], to = IDENTITY) {
   const d = createRoot((d2) => (createRenderEffect(on(get, (x) => set((prev) => to(x, prev)))), d2));
@@ -187,9 +189,30 @@ function Joint(props) {
   });
 }
 const Debug = createOption(false, true, "debug-scope");
+function OptionalSuspense(props) {
+  return createComponent(Show, {
+    get when() {
+      return props.active;
+    },
+    get fallback() {
+      return props.children;
+    },
+    get children() {
+      return createComponent(Suspense, {
+        get fallback() {
+          return props.fallback;
+        },
+        get children() {
+          return props.children;
+        }
+      });
+    }
+  });
+}
 export {
   Case,
   Debug,
+  OptionalSuspense,
   When,
   bind,
   bindTwoWay,
@@ -199,6 +222,7 @@ export {
   createReactiveResource,
   memoProps,
   refCall,
+  runAndDispose,
   runWithContext,
   splitAndMemoProps,
   toSetter,

package/dist/index.umd.js

@@ -45,18 +45,12 @@
     return provider;
   }
   function runWithContext(ctx2, value, f) {
-    const owner = solidJs.getOwner();
-    const context = {
-      ...owner?.context,
-      [ctx2.id]: value
-    };
-    const temp = {
-      context,
-      owner,
-      owned: null,
-      cleanups: null
-    };
-    return solidJs.runWithOwner(temp, () => f(value));
+    return solidJs.createRoot((d) => {
+      return runAndDispose(d, () => {
+        (solidJs.getOwner().context ??= {})[ctx2.id] = value;
+        return f(value);
+      });
+    });
   }
   function createReactiveResource(f) {
     var refetch;
@@ -67,6 +61,14 @@
     }] = solidJs.createResource(memo);
     return get;
   }
+  function runAndDispose(d, f) {
+    try {
+      const out = f();
+      return out instanceof Promise ? out.finally(d) : (d(), out);
+    } catch (ex) {
+      throw d(), ex;
+    }
+  }
   const IDENTITY = (x) => x;
   function bind([get], [, set], to = IDENTITY) {
     const d = solidJs.createRoot((d2) => (solidJs.createRenderEffect(solidJs.on(get, (x) => set((prev) => to(x, prev)))), d2));
@@ -189,8 +191,29 @@
     });
   }
   const Debug = createOption(false, true, "debug-scope");
+  function OptionalSuspense(props) {
+    return solidJs.createComponent(solidJs.Show, {
+      get when() {
+        return props.active;
+      },
+      get fallback() {
+        return props.children;
+      },
+      get children() {
+        return solidJs.createComponent(solidJs.Suspense, {
+          get fallback() {
+            return props.fallback;
+          },
+          get children() {
+            return props.children;
+          }
+        });
+      }
+    });
+  }
   exports2.Case = Case;
   exports2.Debug = Debug;
+  exports2.OptionalSuspense = OptionalSuspense;
   exports2.When = When;
   exports2.bind = bind;
   exports2.bindTwoWay = bindTwoWay;
@@ -200,6 +223,7 @@
   exports2.createReactiveResource = createReactiveResource;
   exports2.memoProps = memoProps;
   exports2.refCall = refCall;
+  exports2.runAndDispose = runAndDispose;
   exports2.runWithContext = runWithContext;
   exports2.splitAndMemoProps = splitAndMemoProps;
   exports2.toSetter = toSetter;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "solid-ctrl-flow",
-  "version": "1.0.30",
+  "version": "1.0.32",
   "description": "Control flow components for solid-js",
   "author": "AFatNiBBa",
   "license": "ISC",

package/readMe.md

@@ -47,6 +47,9 @@ return <>
 </>
 ```
 
+### `OptionalSuspense`
+Like a `Suspence`, but enables you to turn it off and show the loading state
+
 ### `createExtractor()`
 Creates a context for components that may need to be out of their parent in certain conditions.
 If you have this component
@@ -164,4 +167,7 @@ Allows you to create simple reactive contexts; For example `Debug` is made with
 Creates a context scope that persists for the duration of a function
 
 ### `createReactiveResource()`
-Like `createResource()` but the provided function will be reactive
+Like `createResource()` but the provided function will be reactive
+
+### `runAndDispose()`
+Executes a function THEN calls a dispose callback; It works with async functions too