solid-ctrl-flow 1.0.17 → 1.0.19

package/dist/index.d.ts

@@ -60,11 +60,11 @@ export declare function Case(props: {
  * @param name Name to give to the context of the extractor
  */
 export declare function createExtractor(name?: string): {
-    /** Bound {@link Dest} */
+    /** Shows the content of the closest {@link Source} child of the closest {@link Joint} ancestor of this component */
     Dest: () => JSX.Element;
-    /** Bound {@link Source} */
+    /** Puts its content inside of a {@link Dest} if it is available; There is no need to include this component on the DOM tree */
     Source: (props: Info) => JSX.Element;
-    /** Bound {@link Joint} */
+    /** Allows {@link Dest} and {@link Source} childrens to communicate with each other  */
     Joint: (props: {
         children: JSX.Element;
     }) => JSX.Element;
@@ -77,24 +77,33 @@ export declare function createExtractor(name?: string): {
 
 /**
  * Creates a context with a reactive value.
- * It returns the provider directly
+ * Returns a provider with additional fields:
+ * - The `read` getter, which returns an {@link Accessor} to the value
+ * - The `runWith()` method, which executes {@link runWithContext} on the option
  * @param init Initial value for the context
  * @param def Default value to set when calling the provider without one
  * @param name Name to give to the context
  */
-export declare function createOption<T>(init: T, def?: T, name?: string): ((props: {
-    value?: T;
-    children: JSX.Element;
-}) => JSX.Element) & {
+export declare function createOption<T>(init: T, def?: T, name?: string): {
+    (props: {
+        value?: T;
+        children: JSX.Element;
+    }): JSX.Element;
+    /** Executes {@link runWithContext} on the provided option */
+    runWith<V extends T, R>(x: V, f: (x: V) => R): R;
+} & {
     /** Returns the {@link Accessor} for the value in the current context */
     read: Accessor<T>;
 };
 
 /** Creates a scope for the value of {@link Debug.read}, which allows you to display different things in debug mode */
-export declare const Debug: ((props: {
-    value?: boolean | undefined;
-    children: JSX.Element;
-}) => JSX.Element) & {
+export declare const Debug: {
+    (props: {
+        value?: boolean | undefined;
+        children: JSX.Element;
+    }): JSX.Element;
+    runWith<V extends boolean, R>(x: V, f: (x: V) => R): R;
+} & {
     read: Accessor<boolean>;
 };
 

package/dist/index.mjs

@@ -31,6 +31,7 @@ function createOption(init, def = init, name) {
   Object.defineProperty(provider, prop, {
     get: () => useContext(ctx2)
   });
+  provider.runWith = (x, f) => runWithContext(ctx2, () => x, () => f(x));
   return provider;
 }
 function runWithContext(ctx2, value, f) {
@@ -75,11 +76,11 @@ function createExtractor(name = "extractor") {
     name
   });
   return {
-    /** Bound {@link Dest} */
+    /** Shows the content of the closest {@link Source} child of the closest {@link Joint} ancestor of this component */
     Dest: Dest.bind(ctx2),
-    /** Bound {@link Source} */
+    /** Puts its content inside of a {@link Dest} if it is available; There is no need to include this component on the DOM tree */
     Source: Source.bind(ctx2),
-    /** Bound {@link Joint} */
+    /** Allows {@link Dest} and {@link Source} childrens to communicate with each other  */
     Joint: Joint.bind(ctx2),
     /**
      * Gets an {@link Accessor} that tells if the context in which THIS getter has been executed has been extracted (Is inside of a {@link Dest})

package/dist/index.umd.js

@@ -33,6 +33,7 @@
     Object.defineProperty(provider, prop, {
       get: () => solidJs.useContext(ctx2)
     });
+    provider.runWith = (x, f) => runWithContext(ctx2, () => x, () => f(x));
     return provider;
   }
   function runWithContext(ctx2, value, f) {
@@ -77,11 +78,11 @@
       name
     });
     return {
-      /** Bound {@link Dest} */
+      /** Shows the content of the closest {@link Source} child of the closest {@link Joint} ancestor of this component */
       Dest: Dest.bind(ctx2),
-      /** Bound {@link Source} */
+      /** Puts its content inside of a {@link Dest} if it is available; There is no need to include this component on the DOM tree */
       Source: Source.bind(ctx2),
-      /** Bound {@link Joint} */
+      /** Allows {@link Dest} and {@link Source} childrens to communicate with each other  */
       Joint: Joint.bind(ctx2),
       /**
        * Gets an {@link Accessor} that tells if the context in which THIS getter has been executed has been extracted (Is inside of a {@link Dest})

package/package.json

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

package/readMe.md

@@ -112,6 +112,14 @@ return <>
   21
 </>
 ```
+Notice that you can use a `Source` component without adding it to the DOM:
+```tsx
+<myCustomExtractor.Source>
+  {/* This doesn't get returned, but still gets shown if there is an available "Dest" */}
+  Something
+</myCustomExtractor.Source>
+return <>Something else</>
+```
 
 ## Utility functions
 Utility functions needed for the components above