solid-ctrl-flow 1.0.33 → 1.0.35

package/dist/index.d.ts

@@ -7,20 +7,23 @@ import { Resource } from 'solid-js';
 import { Setter } from 'solid-js';
 import { Signal } from 'solid-js';
 
+/** Type hack for making {@link ReactiveContext} implement {@link Accessor} */
+declare const BASE_CTOR: new <T>() => Accessor<T>;
+
 /**
  * Creates a one-way binding between two {@link Signal}s.
  * The function uses {@link createRenderEffect}, which means that:
  * - As soon as the function is done executing the two {@link Signal}s will have the same value
  * - If {@link source} changes, {@link dest} wont be instantly updated
  * - If the current owner gets disposed before {@link dest} is updated, it never will
- * @param source The source of the binding
- * @param dest The destination of the binding
+ * @param source The getter of source of the binding
+ * @param dest The setter of destination of the binding
  * @param to Conversion function from {@link S} to {@link D}
  * @returns A function that disposes the binding
  */
-export declare function bind<S>(source: Signal<S>, dest: Signal<S>): () => void;
+export declare function bind<S>(source: Accessor<S>, dest: Setter<S>): () => void;
 
-export declare function bind<S, D>(source: Signal<S>, dest: Signal<D>, to: Convert<S, D>): () => void;
+export declare function bind<S, D>(source: Accessor<S>, dest: Setter<D>, to: Convert<S, D>): () => void;
 
 /**
  * Creates a two-way binding between two {@link Signal}s calling {@link bind} two times
@@ -126,17 +129,8 @@ export declare function createExtractor(name?: string): {
  */
 export declare function createReactiveResource<R>(f: EffectFunction<R | undefined, R>): Resource<Awaited<R>>;
 
-/** Creates a scope for the value of {@link Debug.isDebug}, which allows you to display different things in debug mode */
-export declare function Debug(props: {
-    value?: boolean;
-    children?: JSX.Element;
-}): JSX.Element;
-
-/** Internals of {@link Debug} */
-export declare namespace Debug {
-    /** Returns an {@link Accessor} that tells whether the current {@link Owner} is in debug mode */
-    const isDebug: Accessor<boolean>;
-}
+/** Built-in {@link ReactiveContext} which allows you to display different things in debug mode */
+export declare const debug: ReactiveContext<boolean>;
 
 /** Informations about a {@link Source} component */
 declare type Info = {
@@ -157,7 +151,7 @@ export declare function memoProps<T, K extends readonly (keyof T)[] = (keyof T)[
  * Reactive {@link Context} with some additional built-in functionalities.
  * The call signature returns the value in the current {@link Owner} (It's like calling {@link read})
  */
-export declare abstract class ReactiveContext<T> extends ReactiveContext_base<T> {
+export declare abstract class ReactiveContext<T> extends BASE_CTOR<T> {
     /** The actual {@link Context} that contains the reactive {@link Accessor} to the value */
     abstract ctx: Context<Accessor<T>>;
     /**
@@ -192,8 +186,6 @@ export declare abstract class ReactiveContext<T> extends ReactiveContext_base<T>
     static create<T>(defaultValue: T, name?: string): ReactiveContext<T>;
 }
 
-declare const ReactiveContext_base: new <T_1>() => Accessor<T_1>;
-
 /**
  * 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)

package/dist/index.mjs

@@ -1,6 +1,7 @@
 import { useContext, createMemo, createComponent, createContext, Match, mergeProps, onCleanup, For, Show, createRoot, createRenderEffect, on, untrack, splitProps, getOwner, createEffect, createResource } from "solid-js";
 import { createMutable } from "solid-js/store";
-class ReactiveContext extends Function {
+const BASE_CTOR = Function;
+class ReactiveContext extends BASE_CTOR {
   /** The actual {@link Context} that contains the reactive {@link Accessor} to the value */
   /**
    * Returns the {@link Accessor} for the value in the current {@link Owner}.
@@ -53,13 +54,13 @@ class ReactiveContext extends Function {
     return out;
   }
 }
-const ctx$1 = ReactiveContext.create(void 0, "case-when");
-const Case = ctx$1.Provider;
+const ctx = ReactiveContext.create(void 0, "case-when");
+const Case = ctx.Provider;
 function When(props) {
   const [mine, other] = splitAndMemoProps(props, ["value", "pred"]);
   const {
     read
-  } = ctx$1;
+  } = ctx;
   const pred = (x) => mine.pred ? mine.pred(x) : x === mine.value;
   return createComponent(Match, mergeProps({
     get when() {
@@ -67,22 +68,6 @@ function When(props) {
     }
   }, other));
 }
-const ctx = ReactiveContext.create(false, "debug-scope");
-function Debug(props) {
-  return createComponent(ctx.Provider, {
-    get value() {
-      return props.value ?? true;
-    },
-    get children() {
-      return props.children;
-    }
-  });
-}
-(function(_Debug) {
-  Object.defineProperty(Debug, "isDebug", {
-    get: () => ctx.read
-  });
-})(Debug || (Debug = {}));
 function createExtractor(name = "extractor") {
   const ctx2 = createContext(void 0, {
     name
@@ -157,13 +142,13 @@ function Joint(props) {
   });
 }
 const IDENTITY = (x) => x;
-function bind([get], [, set], to = IDENTITY) {
-  const d = createRoot((d2) => (createRenderEffect(on(get, (x) => set((prev) => to(x, prev)))), d2));
+function bind(source, dest, to = IDENTITY) {
+  const d = createRoot((d2) => (createRenderEffect(on(source, (x) => dest((prev) => to(x, prev)))), d2));
   return onCleanup(d), d;
 }
-function bindTwoWay(source, dest, to = IDENTITY, from = IDENTITY) {
-  const a = bind(source, dest, to);
-  const b = bind(dest, source, from);
+function bindTwoWay(source, dest, to, from) {
+  const a = bind(source[0], dest[1], to);
+  const b = bind(dest[0], source[1], from);
   return () => (a(), b());
 }
 function toSetter(get, set) {
@@ -226,9 +211,9 @@ function createReactiveResource(f) {
   }] = createResource(memo);
   return get;
 }
+const debug = ReactiveContext.create(false, "debug-scope");
 export {
   Case,
-  Debug,
   ReactiveContext,
   When,
   bind,
@@ -236,6 +221,7 @@ export {
   coalesceSignal,
   createExtractor,
   createReactiveResource,
+  debug,
   memoProps,
   refCall,
   runWithContext,

package/dist/index.umd.js

@@ -2,7 +2,8 @@
   typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("solid-js"), require("solid-js/store")) : typeof define === "function" && define.amd ? define(["exports", "solid-js", "solid-js/store"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.solidCtrlFlow = {}, global.solidJs, global.solidJsStore));
 })(this, function(exports2, solidJs, store) {
   "use strict";
-  class ReactiveContext extends Function {
+  const BASE_CTOR = Function;
+  class ReactiveContext extends BASE_CTOR {
     /** The actual {@link Context} that contains the reactive {@link Accessor} to the value */
     /**
      * Returns the {@link Accessor} for the value in the current {@link Owner}.
@@ -55,13 +56,13 @@
       return out;
     }
   }
-  const ctx$1 = ReactiveContext.create(void 0, "case-when");
-  const Case = ctx$1.Provider;
+  const ctx = ReactiveContext.create(void 0, "case-when");
+  const Case = ctx.Provider;
   function When(props) {
     const [mine, other] = splitAndMemoProps(props, ["value", "pred"]);
     const {
       read
-    } = ctx$1;
+    } = ctx;
     const pred = (x) => mine.pred ? mine.pred(x) : x === mine.value;
     return solidJs.createComponent(solidJs.Match, solidJs.mergeProps({
       get when() {
@@ -69,22 +70,6 @@
       }
     }, other));
   }
-  const ctx = ReactiveContext.create(false, "debug-scope");
-  function Debug(props) {
-    return solidJs.createComponent(ctx.Provider, {
-      get value() {
-        return props.value ?? true;
-      },
-      get children() {
-        return props.children;
-      }
-    });
-  }
-  (function(_Debug) {
-    Object.defineProperty(Debug, "isDebug", {
-      get: () => ctx.read
-    });
-  })(Debug || (Debug = {}));
   function createExtractor(name = "extractor") {
     const ctx2 = solidJs.createContext(void 0, {
       name
@@ -159,13 +144,13 @@
     });
   }
   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));
+  function bind(source, dest, to = IDENTITY) {
+    const d = solidJs.createRoot((d2) => (solidJs.createRenderEffect(solidJs.on(source, (x) => dest((prev) => to(x, prev)))), d2));
     return solidJs.onCleanup(d), d;
   }
-  function bindTwoWay(source, dest, to = IDENTITY, from = IDENTITY) {
-    const a = bind(source, dest, to);
-    const b = bind(dest, source, from);
+  function bindTwoWay(source, dest, to, from) {
+    const a = bind(source[0], dest[1], to);
+    const b = bind(dest[0], source[1], from);
     return () => (a(), b());
   }
   function toSetter(get, set) {
@@ -228,8 +213,8 @@
     }] = solidJs.createResource(memo);
     return get;
   }
+  const debug = ReactiveContext.create(false, "debug-scope");
   exports2.Case = Case;
-  exports2.Debug = Debug;
   exports2.ReactiveContext = ReactiveContext;
   exports2.When = When;
   exports2.bind = bind;
@@ -237,6 +222,7 @@
   exports2.coalesceSignal = coalesceSignal;
   exports2.createExtractor = createExtractor;
   exports2.createReactiveResource = createReactiveResource;
+  exports2.debug = debug;
   exports2.memoProps = memoProps;
   exports2.refCall = refCall;
   exports2.runWithContext = runWithContext;

package/package.json

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

package/readMe.md

@@ -34,20 +34,6 @@ return <>
 </>
 ```
 
-### `Debug`
-Allows you to define ui section that are only visible in debug or NOT in debug
-```tsx
-const value = false;
-return <>
-  <Debug value={value}>
-    {/* (A LOT OF NESTING...) */}
-    <Show when={Debug.isDebug()}>
-      THIS WOULD BE VISIBLE IF "value" HAD BEEN {true}
-    </Show>
-  </Debug>
-</>
-```
-
 ### `createExtractor()`
 Creates a context for components that may need to be out of their parent in certain conditions.
 If you have this component
@@ -122,6 +108,29 @@ Notice that you can use a `Source` component without adding it to the DOM:
 return <>Something else</>
 ```
 
+## Utility
+
+### Bindings
+Functions that create bindings between `Signal`s
+
+> #### `bind()`
+> Creates a one-way binding between two `Signal`s
+> 
+> #### `bindTwoWay()`
+> Creates a two-way binding between two `Signal`s
+> 
+> #### `toSetter()`
+> Creates a full-fledged solid `Setter` from a normal one
+> 
+> #### `toSignal()`
+> Creates a `Signal` from a property of an object
+> 
+> #### `coalesceSignal()`
+> Creates a non nullable `Signal` from a nullable one
+> 
+> #### `unwrapSignal()`
+> Calls an `Accessor` to a `Signal` maintaining its reactivity
+
 ### `ReactiveContext.create()`
 Method that creates a reactive version of a solid `Context` with some additional built-in functionalities
 ```ts
@@ -131,29 +140,19 @@ const valueAccessorForTheCurrentOwner = ctx.read;
 const value = ctx();
 ```
 
-## Bindings
-Functions that create bindings between `Signal`s
-
-### `bind()`
-Creates a one-way binding between two `Signal`s
-
-### `bindTwoWay()`
-Creates a two-way binding between two `Signal`s
-
-### `toSetter()`
-Creates a full-fledged solid `Setter` from a normal one
-
-### `toSignal()`
-Creates a `Signal` from a property of an object
-
-### `coalesceSignal()`
-Creates a non nullable `Signal` from a nullable one
-
-### `unwrapSignal()`
-Calls an `Accessor` to a `Signal` maintaining its reactivity
-
-## Utility functions
-Utility functions needed for the components above
+### `debug()`
+Allows you to define ui section that are only visible in debug or NOT in debug
+```tsx
+const value = false;
+return <>
+  <debug.Provider value={value}>
+    {/* (A LOT OF NESTING...) */}
+    <Show when={debug()}>
+      THIS WOULD BE VISIBLE IF "value" HAD BEEN {true}
+    </Show>
+  </debug.Provider>
+</>
+```
 
 ### `untrackCall()`
 Calls a function untracking what happens inside of it but not what gets passed as its argument