@preact/signals-react 3.3.1 → 3.5.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @preact/signals-react
 
+## 3.5.0
+
+### Minor Changes
+
+- [#792](https://github.com/preactjs/signals/pull/792) [`95dcf41`](https://github.com/preactjs/signals/commit/95dcf41c95baa5d9c6aa8f94c7592722c0cefc3f) Thanks [@JoviDeCroock](https://github.com/JoviDeCroock)! - Allow the `when` property of `Show` to be a function so not everything has to be transformed into a boolean computed
+
+### Patch Changes
+
+- [#790](https://github.com/preactjs/signals/pull/790) [`4b143a7`](https://github.com/preactjs/signals/commit/4b143a7164d58edda05a23a482f06afc20543234) Thanks [@JoviDeCroock](https://github.com/JoviDeCroock)! - Ensure the cached and non-cached shape is the same
+
+- [#791](https://github.com/preactjs/signals/pull/791) [`358a758`](https://github.com/preactjs/signals/commit/358a7585a27deff6cf0b804f5f02739b893c7a02) Thanks [@JoviDeCroock](https://github.com/JoviDeCroock)! - Prevent `For` cache from expanding infinitely
+
+## 3.4.0
+
+### Minor Changes
+
+- [#777](https://github.com/preactjs/signals/pull/777) [`d31738f`](https://github.com/preactjs/signals/commit/d31738f646fda6bd00113b8e6e1dfae46e14f08e) Thanks [@JoviDeCroock](https://github.com/JoviDeCroock)! - Revert the changes to `useComputed`, sincere apologies for the inconvenience we've discussed this at length and are going to side on the perf side.
+
+### Patch Changes
+
+- [#783](https://github.com/preactjs/signals/pull/783) [`86575b4`](https://github.com/preactjs/signals/commit/86575b41ec097c3ecdefc7b54a4cabfbe23f7984) Thanks [@JoviDeCroock](https://github.com/JoviDeCroock)! - Ensure `For` and `Show` account for nested reactivity
+
 ## 3.3.1
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@preact/signals-react",
-  "version": "3.3.1",
+  "version": "3.5.0",
   "license": "MIT",
   "description": "Manage state with style in React",
   "keywords": [],

package/utils/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { ReadonlySignal, Signal } from "@preact/signals-core";
 interface ShowProps<T = boolean> {
-    when: Signal<T> | ReadonlySignal<T>;
+    when: Signal<T> | ReadonlySignal<T> | (() => T);
     fallback?: JSX.Element;
     children: JSX.Element | ((value: NonNullable<T>) => JSX.Element);
 }

package/utils/dist/utils.js

@@ -1 +1 @@
-var r=require("@preact/signals-react"),n=require("@preact/signals-react/runtime"),t=require("react"),e={configurable:!0,get:function(){return this.value},set:function(r){this.value=r}};exports.For=function(r){n.useSignals();var e=t.useMemo(function(){return new Map},[]),u=("function"==typeof r.each?r.each():r.each).value;if(!u.length)return r.fallback||null;var i=u.map(function(n,t){if(!e.has(n))e.set(n,r.children(n,t));return e.get(n)});return t.createElement(t.Fragment,{children:i})};exports.Show=function(r){n.useSignals();var t=r.when.value;if(!t)return r.fallback||null;else return"function"==typeof r.children?r.children(t):r.children};exports.useLiveSignal=function(n){var t=r.useSignal(n);if(t.peek()!==n)t.value=n;return t};exports.useSignalRef=function(n){var t=r.useSignal(n);if(!("current"in t))Object.defineProperty(t,"current",e);return t};//# sourceMappingURL=utils.js.map
+var r=require("@preact/signals-react"),n=require("@preact/signals-react/runtime"),e=require("react"),t=function(r){n.useSignals();return"function"==typeof r.children?r.children(r.v,r.i):r.children},u={configurable:!0,get:function(){return this.value},set:function(r){this.value=r}};exports.For=function(r){n.useSignals();var u=e.useMemo(function(){return new Map},[]),i=("function"==typeof r.each?r.each():r.each).value;if(!i.length)return r.fallback||null;var c=new Set(u.keys()),f=i.map(function(n,i){c.delete(n);if(!u.has(n)){var f=e.createElement(t,{v:n,key:i,i:i,children:r.children});u.set(n,f);return f}return u.get(n)});c.forEach(function(r){u.delete(r)});return e.createElement(e.Fragment,{children:f})};exports.Show=function(r){n.useSignals();var u="function"==typeof r.when?r.when():r.when.value;if(!u)return r.fallback||null;else return e.createElement(t,{v:u,children:r.children})};exports.useLiveSignal=function(n){var e=r.useSignal(n);if(e.peek()!==n)e.value=n;return e};exports.useSignalRef=function(n){var e=r.useSignal(n);if(!("current"in e))Object.defineProperty(e,"current",u);return e};//# sourceMappingURL=utils.js.map

package/utils/dist/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../src/index.ts"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T>;\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value = props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn typeof props.children === \"function\"\n\t\t? props.children(value)\n\t\t: props.children;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst items = list.map((value, key) => {\n\t\tif (!cache.has(value)) {\n\t\t\tcache.set(value, props.children(value, key));\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["refSignalProto","configurable","get","this","value","set","v","exports","For","props","useSignals","cache","useMemo","Map","list","each","length","fallback","items","map","key","has","children","createElement","Fragment","Show","when","useLiveSignal","s","useSignal","peek","useSignalRef","ref","Object","defineProperty"],"mappings":"qGA6DMA,EAAiB,CACtBC,cAAc,EACdC,eACC,OAAOC,KAAKC,KACb,EACAC,IAAA,SAAkBC,GACjBH,KAAKC,MAAQE,CACd,GACAC,QAAAC,IAxCK,SAAiBC,GACtBC,EAAAA,aACA,IAAMC,EAAQC,EAAAA,QAAQ,WAAA,OAAU,IAAAC,GAAK,EAAE,IACnCC,GACoB,mBAAfL,EAAMM,KAAsBN,EAAMM,OAASN,EAAMM,MAGxDX,MAEF,IAAKU,EAAKE,OAAQ,OAAOP,EAAMQ,UAAY,KAE3C,IAAMC,EAAQJ,EAAKK,IAAI,SAACf,EAAOgB,GAC9B,IAAKT,EAAMU,IAAIjB,GACdO,EAAMN,IAAID,EAAOK,EAAMa,SAASlB,EAAOgB,IAExC,OAAOT,EAAMT,IAAIE,EAClB,GACA,OAAOmB,EAAaA,cAACC,EAAQA,SAAE,CAAEF,SAAUJ,GAC5C,EAsBCX,QAAAkB,cA1DiChB,GACjCC,EAAAA,aACA,IAAMN,EAAQK,EAAMiB,KAAKtB,MACzB,IAAKA,EAAO,OAAOK,EAAMQ,UAAY,UACrC,MAAiC,mBAAnBR,EAAMa,SACjBb,EAAMa,SAASlB,GACfK,EAAMa,QACV,EAmDCf,QAAAoB,uBApBgCvB,GAChC,IAAMwB,EAAIC,EAAAA,UAAUzB,GACpB,GAAIwB,EAAEE,SAAW1B,EAAOwB,EAAExB,MAAQA,EAClC,OAAOwB,CACR,EAgBCrB,QAAAwB,aAde,SAAgB3B,GAC/B,IAAM4B,EAAMH,EAASA,UAACzB,GACtB,KAAM,YAAa4B,GAClBC,OAAOC,eAAeF,EAAK,UAAWhC,GACvC,OAAOgC,CACR"}
+{"version":3,"file":"utils.js","sources":["../src/index.tsx"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T> | (() => T);\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nconst Item = (props: any) => {\n\tuseSignals();\n\treturn typeof props.children === \"function\"\n\t\t? props.children(props.v, props.i)\n\t\t: props.children;\n};\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value =\n\t\ttypeof props.when === \"function\" ? props.when() : props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn <Item v={value} children={props.children} />;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst removed = new Set(cache.keys());\n\n\tconst items = list.map((value, key) => {\n\t\tremoved.delete(value);\n\t\tif (!cache.has(value)) {\n\t\t\tconst result = (\n\t\t\t\t<Item v={value} key={key} i={key} children={props.children} />\n\t\t\t);\n\t\t\tcache.set(value, result);\n\t\t\treturn result;\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\n\tremoved.forEach(value => {\n\t\tcache.delete(value);\n\t});\n\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["signalsReact","require","runtime","react","Item","props","useSignals","children","v","i","refSignalProto","configurable","get","value","set","this","exports","For","cache","useMemo","Map","list","each","length","fallback","removed","Set","keys","items","map","key","has","result","createElement","forEach","Fragment","Show","when","useLiveSignal","s","useSignal","peek","useSignalRef","ref","Object","defineProperty"],"mappings":"AAWA,IAAAA,EAAAC,QAAA,yBAAAC,EAAAD,QAAA,iCAAAE,EAAAF,QAAA,SAAMG,EAAO,SAACC,GACbC,EAAAA,aACA,MAAiC,mBAAnBD,EAAME,SACjBF,EAAME,SAASF,EAAMG,EAAGH,EAAMI,GAC9BJ,EAAME,QACV,EA+DMG,EAAiB,CACtBC,cAAc,EACdC,eACC,YAAYC,KACb,EACAC,IAAG,SAAeN,GACjBO,KAAKF,MAAQL,CACd,GACAQ,QAAAC,IApDK,SAAiBZ,GACtBC,eACA,IAAMY,EAAQC,UAAQ,WAAA,WAAUC,GAAK,EAAE,IACnCC,GACoB,mBAAfhB,EAAMiB,KAAsBjB,EAAMiB,OAASjB,EAAMiB,MAGxDT,MAEF,IAAKQ,EAAKE,OAAQ,OAAOlB,EAAMmB,UAAY,KAE3C,IAAMC,EAAU,IAAIC,IAAIR,EAAMS,QAExBC,EAAQP,EAAKQ,IAAI,SAAChB,EAAOiB,GAC9BL,EAAc,OAACZ,GACf,IAAKK,EAAMa,IAAIlB,GAAQ,CACtB,IAAMmB,EACLC,EAACA,cAAA7B,GAAKI,EAAGK,EAAOiB,IAAKA,EAAKrB,EAAGqB,EAAKvB,SAAUF,EAAME,WAEnDW,EAAMJ,IAAID,EAAOmB,GACjB,OAAOA,CACR,CACA,OAAOd,EAAMN,IAAIC,EAClB,GAEAY,EAAQS,QAAQ,SAAArB,GACfK,EAAY,OAACL,EACd,GAEA,OAAOoB,EAAaA,cAACE,WAAU,CAAE5B,SAAUqB,GAC5C,EAsBCZ,QAAAoB,KArEe,SAAkB/B,GACjCC,EAAUA,aACV,IAAMO,EACiB,mBAAfR,EAAMgC,KAAsBhC,EAAMgC,OAAShC,EAAMgC,KAAKxB,MAC9D,IAAKA,EAAO,OAAOR,EAAMmB,UAAY,UACrC,OAAOS,EAACA,cAAA7B,EAAK,CAAAI,EAAGK,EAAON,SAAUF,EAAME,UACxC,EA+DCS,QAAAsB,cApBe,SAAiBzB,GAChC,IAAM0B,EAAIC,YAAU3B,GACpB,GAAI0B,EAAEE,SAAW5B,EAAO0B,EAAE1B,MAAQA,EAClC,OAAO0B,CACR,EAgBCvB,QAAA0B,aAdK,SAA0B7B,GAC/B,IAAM8B,EAAMH,EAASA,UAAC3B,GACtB,KAAM,YAAa8B,GAClBC,OAAOC,eAAeF,EAAK,UAAWjC,GACvC,OAAOiC,CACR"}

package/utils/dist/utils.min.js

@@ -1 +1 @@
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@preact/signals-react"),require("@preact/signals-react/runtime"),require("react")):"function"==typeof define&&define.amd?define(["exports","@preact/signals-react","@preact/signals-react/runtime","react"],n):n((e||self).reactSignalsutils={},e.signalsReact,e.reactSignalsRuntime,e.react)}(this,function(e,n,t,r){var i={configurable:!0,get:function(){return this.value},set:function(e){this.value=e}};e.For=function(e){t.useSignals();var n=r.useMemo(function(){return new Map},[]),i=("function"==typeof e.each?e.each():e.each).value;if(!i.length)return e.fallback||null;var u=i.map(function(t,r){if(!n.has(t))n.set(t,e.children(t,r));return n.get(t)});return r.createElement(r.Fragment,{children:u})};e.Show=function(e){t.useSignals();var n=e.when.value;if(!n)return e.fallback||null;else return"function"==typeof e.children?e.children(n):e.children};e.useLiveSignal=function(e){var t=n.useSignal(e);if(t.peek()!==e)t.value=e;return t};e.useSignalRef=function(e){var t=n.useSignal(e);if(!("current"in t))Object.defineProperty(t,"current",i);return t}});//# sourceMappingURL=utils.min.js.map
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@preact/signals-react"),require("@preact/signals-react/runtime"),require("react")):"function"==typeof define&&define.amd?define(["exports","@preact/signals-react","@preact/signals-react/runtime","react"],n):n((e||self).reactSignalsutils={},e.signalsReact,e.reactSignalsRuntime,e.react)}(this,function(e,n,t,r){var i=function(e){t.useSignals();return"function"==typeof e.children?e.children(e.v,e.i):e.children},u={configurable:!0,get:function(){return this.value},set:function(e){this.value=e}};e.For=function(e){t.useSignals();var n=r.useMemo(function(){return new Map},[]),u=("function"==typeof e.each?e.each():e.each).value;if(!u.length)return e.fallback||null;var f=new Set(n.keys()),c=u.map(function(t,u){f.delete(t);if(!n.has(t)){var c=r.createElement(i,{v:t,key:u,i:u,children:e.children});n.set(t,c);return c}return n.get(t)});f.forEach(function(e){n.delete(e)});return r.createElement(r.Fragment,{children:c})};e.Show=function(e){t.useSignals();var n="function"==typeof e.when?e.when():e.when.value;if(!n)return e.fallback||null;else return r.createElement(i,{v:n,children:e.children})};e.useLiveSignal=function(e){var t=n.useSignal(e);if(t.peek()!==e)t.value=e;return t};e.useSignalRef=function(e){var t=n.useSignal(e);if(!("current"in t))Object.defineProperty(t,"current",u);return t}});//# sourceMappingURL=utils.min.js.map

package/utils/dist/utils.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.min.js","sources":["../src/index.ts"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T>;\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value = props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn typeof props.children === \"function\"\n\t\t? props.children(value)\n\t\t: props.children;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst items = list.map((value, key) => {\n\t\tif (!cache.has(value)) {\n\t\t\tcache.set(value, props.children(value, key));\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["refSignalProto","configurable","get","this","value","set","v","exports","For","props","useSignals","cache","useMemo","Map","list","each","length","fallback","items","map","key","has","children","createElement","Fragment","Show","when","useLiveSignal","s","useSignal","peek","useSignalRef","ref","Object","defineProperty"],"mappings":"ybA6DA,IAAMA,EAAiB,CACtBC,cAAc,EACdC,eACC,OAAOC,KAAKC,KACb,EACAC,IAAA,SAAkBC,GACjBH,KAAKC,MAAQE,CACd,GACAC,EAAAC,IAxCK,SAAiBC,GACtBC,EAAAA,aACA,IAAMC,EAAQC,EAAAA,QAAQ,WAAA,OAAU,IAAAC,GAAK,EAAE,IACnCC,GACoB,mBAAfL,EAAMM,KAAsBN,EAAMM,OAASN,EAAMM,MAGxDX,MAEF,IAAKU,EAAKE,OAAQ,OAAOP,EAAMQ,UAAY,KAE3C,IAAMC,EAAQJ,EAAKK,IAAI,SAACf,EAAOgB,GAC9B,IAAKT,EAAMU,IAAIjB,GACdO,EAAMN,IAAID,EAAOK,EAAMa,SAASlB,EAAOgB,IAExC,OAAOT,EAAMT,IAAIE,EAClB,GACA,OAAOmB,EAAaA,cAACC,EAAQA,SAAE,CAAEF,SAAUJ,GAC5C,EAsBCX,EAAAkB,cA1DiChB,GACjCC,EAAAA,aACA,IAAMN,EAAQK,EAAMiB,KAAKtB,MACzB,IAAKA,EAAO,OAAOK,EAAMQ,UAAY,UACrC,MAAiC,mBAAnBR,EAAMa,SACjBb,EAAMa,SAASlB,GACfK,EAAMa,QACV,EAmDCf,EAAAoB,uBApBgCvB,GAChC,IAAMwB,EAAIC,EAAAA,UAAUzB,GACpB,GAAIwB,EAAEE,SAAW1B,EAAOwB,EAAExB,MAAQA,EAClC,OAAOwB,CACR,EAgBCrB,EAAAwB,aAde,SAAgB3B,GAC/B,IAAM4B,EAAMH,EAASA,UAACzB,GACtB,KAAM,YAAa4B,GAClBC,OAAOC,eAAeF,EAAK,UAAWhC,GACvC,OAAOgC,CACR,CASC"}
+{"version":3,"file":"utils.min.js","sources":["../src/index.tsx"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T> | (() => T);\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nconst Item = (props: any) => {\n\tuseSignals();\n\treturn typeof props.children === \"function\"\n\t\t? props.children(props.v, props.i)\n\t\t: props.children;\n};\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value =\n\t\ttypeof props.when === \"function\" ? props.when() : props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn <Item v={value} children={props.children} />;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst removed = new Set(cache.keys());\n\n\tconst items = list.map((value, key) => {\n\t\tremoved.delete(value);\n\t\tif (!cache.has(value)) {\n\t\t\tconst result = (\n\t\t\t\t<Item v={value} key={key} i={key} children={props.children} />\n\t\t\t);\n\t\t\tcache.set(value, result);\n\t\t\treturn result;\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\n\tremoved.forEach(value => {\n\t\tcache.delete(value);\n\t});\n\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["g","f","exports","module","require","define","amd","globalThis","self","reactSignalsutils","signalsReact","reactSignalsRuntime","react","this","runtime","Item","props","useSignals","children","v","i","refSignalProto","configurable","get","value","set","For","cache","useMemo","Map","list","each","length","fallback","removed","Set","keys","items","map","key","has","result","createElement","forEach","Fragment","Show","when","useLiveSignal","s","useSignal","peek","useSignalRef","ref","Object","defineProperty"],"mappings":"CAWA,SAAAA,EAAAC,GAAA,iBAAAC,SAAA,oBAAAC,OAAAF,EAAAC,QAAAE,QAAA,yBAAAA,QAAA,iCAAAA,QAAA,UAAA,mBAAAC,QAAAA,OAAAC,IAAAD,OAAA,CAAA,UAAA,wBAAA,gCAAA,SAAAJ,GAAAA,GAAAD,EAAA,oBAAAO,WAAAA,WAAAP,GAAAQ,MAAAC,kBAAA,CAAA,EAAAT,EAAAU,aAAAV,EAAAW,oBAAAX,EAAAY,MAAA,CAAA,CAAAC,KAAA,SAAAX,EAAAQ,EAAAI,EAAAF,GAAA,IAAMG,EAAO,SAACC,GACbC,EAAAA,aACA,MAAiC,mBAAnBD,EAAME,SACjBF,EAAME,SAASF,EAAMG,EAAGH,EAAMI,GAC9BJ,EAAME,QACV,EA+DMG,EAAiB,CACtBC,cAAc,EACdC,eACC,YAAYC,KACb,EACAC,IAAG,SAAeN,GACjBN,KAAKW,MAAQL,CACd,GACAjB,EAAAwB,IApDK,SAAiBV,GACtBC,eACA,IAAMU,EAAQC,UAAQ,WAAA,WAAUC,GAAK,EAAE,IACnCC,GACoB,mBAAfd,EAAMe,KAAsBf,EAAMe,OAASf,EAAMe,MAGxDP,MAEF,IAAKM,EAAKE,OAAQ,OAAOhB,EAAMiB,UAAY,KAE3C,IAAMC,EAAU,IAAIC,IAAIR,EAAMS,QAExBC,EAAQP,EAAKQ,IAAI,SAACd,EAAOe,GAC9BL,EAAc,OAACV,GACf,IAAKG,EAAMa,IAAIhB,GAAQ,CACtB,IAAMiB,EACLC,EAACA,cAAA3B,GAAKI,EAAGK,EAAOe,IAAKA,EAAKnB,EAAGmB,EAAKrB,SAAUF,EAAME,WAEnDS,EAAMF,IAAID,EAAOiB,GACjB,OAAOA,CACR,CACA,OAAOd,EAAMJ,IAAIC,EAClB,GAEAU,EAAQS,QAAQ,SAAAnB,GACfG,EAAY,OAACH,EACd,GAEA,OAAOkB,EAAaA,cAACE,WAAU,CAAE1B,SAAUmB,GAC5C,EAsBCnC,EAAA2C,KArEe,SAAkB7B,GACjCC,EAAUA,aACV,IAAMO,EACiB,mBAAfR,EAAM8B,KAAsB9B,EAAM8B,OAAS9B,EAAM8B,KAAKtB,MAC9D,IAAKA,EAAO,OAAOR,EAAMiB,UAAY,UACrC,OAAOS,EAACA,cAAA3B,EAAK,CAAAI,EAAGK,EAAON,SAAUF,EAAME,UACxC,EA+DChB,EAAA6C,cApBe,SAAiBvB,GAChC,IAAMwB,EAAIC,YAAUzB,GACpB,GAAIwB,EAAEE,SAAW1B,EAAOwB,EAAExB,MAAQA,EAClC,OAAOwB,CACR,EAgBC9C,EAAAiD,aAdK,SAA0B3B,GAC/B,IAAM4B,EAAMH,EAASA,UAACzB,GACtB,KAAM,YAAa4B,GAClBC,OAAOC,eAAeF,EAAK,UAAW/B,GACvC,OAAO+B,CACR,CASC"}

package/utils/dist/utils.mjs

@@ -1 +1 @@
-import{useSignal}from"@preact/signals-react";import{useSignals as t}from"@preact/signals-react/runtime";import{useMemo as n,createElement as r,Fragment as e}from"react";function c(n){t();const r=n.when.value;if(!r)return n.fallback||null;else return"function"==typeof n.children?n.children(r):n.children}function i(c){t();const i=n(()=>new Map,[]);let o=("function"==typeof c.each?c.each():c.each).value;if(!o.length)return c.fallback||null;const u=o.map((t,n)=>{if(!i.has(t))i.set(t,c.children(t,n));return i.get(t)});return r(e,{children:u})}function o(t){const n=useSignal(t);if(n.peek()!==t)n.value=t;return n}function u(t){const n=useSignal(t);if(!("current"in n))Object.defineProperty(n,"current",f);return n}const f={configurable:!0,get(){return this.value},set(t){this.value=t}};export{i as For,c as Show,o as useLiveSignal,u as useSignalRef};//# sourceMappingURL=utils.mjs.map
+import{useSignal}from"@preact/signals-react";import{useSignals as t}from"@preact/signals-react/runtime";import{createElement as n,useMemo as r,Fragment as e}from"react";const c=n=>{t();return"function"==typeof n.children?n.children(n.v,n.i):n.children};function i(r){t();const e="function"==typeof r.when?r.when():r.when.value;if(!e)return r.fallback||null;else return n(c,{v:e,children:r.children})}function o(i){t();const o=r(()=>new Map,[]);let u=("function"==typeof i.each?i.each():i.each).value;if(!u.length)return i.fallback||null;const f=new Set(o.keys()),s=u.map((t,r)=>{f.delete(t);if(!o.has(t)){const e=n(c,{v:t,key:r,i:r,children:i.children});o.set(t,e);return e}return o.get(t)});f.forEach(t=>{o.delete(t)});return n(e,{children:s})}function u(t){const n=useSignal(t);if(n.peek()!==t)n.value=t;return n}function f(t){const n=useSignal(t);if(!("current"in n))Object.defineProperty(n,"current",s);return n}const s={configurable:!0,get(){return this.value},set(t){this.value=t}};export{o as For,i as Show,u as useLiveSignal,f as useSignalRef};//# sourceMappingURL=utils.mjs.map

package/utils/dist/utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.mjs","sources":["../src/index.ts"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T>;\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value = props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn typeof props.children === \"function\"\n\t\t? props.children(value)\n\t\t: props.children;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst items = list.map((value, key) => {\n\t\tif (!cache.has(value)) {\n\t\t\tcache.set(value, props.children(value, key));\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["useSignal","useSignals","useMemo","createElement","Fragment","Show","props","value","when","fallback","children","For","cache","Map","list","each","length","items","map","key","has","set","get","useLiveSignal","s","peek","useSignalRef","ref","Object","defineProperty","refSignalProto","configurable","v","this"],"mappings":"OAWgBA,cAAA,6CAAAC,MAAA,kDAAAC,mBAAAC,cAAAC,MAAA,QAAA,SAAAC,EAAkBC,GACjCL,IACA,MAAMM,EAAQD,EAAME,KAAKD,MACzB,IAAKA,EAAO,OAAOD,EAAMG,UAAY,UACrC,MAAiC,mBAAnBH,EAAMI,SACjBJ,EAAMI,SAASH,GACfD,EAAMI,QACV,CAWgB,SAAAC,EAAOL,GACtBL,IACA,MAAMW,EAAQV,EAAQ,IAAM,IAAIW,IAAO,IACvC,IAAIC,GACoB,mBAAfR,EAAMS,KAAsBT,EAAMS,OAAST,EAAMS,MAGxDR,MAEF,IAAKO,EAAKE,OAAQ,OAAOV,EAAMG,UAAY,KAE3C,MAAMQ,EAAQH,EAAKI,IAAI,CAACX,EAAOY,KAC9B,IAAKP,EAAMQ,IAAIb,GACdK,EAAMS,IAAId,EAAOD,EAAMI,SAASH,EAAOY,IAExC,OAAOP,EAAMU,IAAIf,EAAK,GAEvB,OAAOJ,EAAcC,EAAU,CAAEM,SAAUO,GAC5C,CAEM,SAAUM,EAAiBhB,GAChC,MAAMiB,EAAIxB,UAAUO,GACpB,GAAIiB,EAAEC,SAAWlB,EAAOiB,EAAEjB,MAAQA,EAClC,OAAOiB,CACR,CAEgB,SAAAE,EAAgBnB,GAC/B,MAAMoB,EAAM3B,UAAUO,GACtB,KAAM,YAAaoB,GAClBC,OAAOC,eAAeF,EAAK,UAAWG,GACvC,OAAOH,CACR,CACA,MAAMG,EAAiB,CACtBC,cAAc,EACdT,MACC,YAAYf,KACb,EACAc,IAAkBW,GACjBC,KAAK1B,MAAQyB,CACd,UACArB,SAAAN,UAAAkB,mBAAAG"}
+{"version":3,"file":"utils.mjs","sources":["../src/index.tsx"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T> | (() => T);\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nconst Item = (props: any) => {\n\tuseSignals();\n\treturn typeof props.children === \"function\"\n\t\t? props.children(props.v, props.i)\n\t\t: props.children;\n};\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value =\n\t\ttypeof props.when === \"function\" ? props.when() : props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn <Item v={value} children={props.children} />;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst removed = new Set(cache.keys());\n\n\tconst items = list.map((value, key) => {\n\t\tremoved.delete(value);\n\t\tif (!cache.has(value)) {\n\t\t\tconst result = (\n\t\t\t\t<Item v={value} key={key} i={key} children={props.children} />\n\t\t\t);\n\t\t\tcache.set(value, result);\n\t\t\treturn result;\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\n\tremoved.forEach(value => {\n\t\tcache.delete(value);\n\t});\n\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["useSignal","useSignals","createElement","useMemo","Fragment","Item","props","children","v","i","Show","value","when","fallback","For","cache","Map","list","each","length","removed","Set","keys","items","map","key","delete","has","result","set","get","forEach","useLiveSignal","s","peek","useSignalRef","ref","Object","defineProperty","refSignalProto","configurable","this"],"mappings":"OAWAA,cAAA,6CAAAC,MAAA,wDAAAC,aAAAC,cAAAC,MAAA,QAAA,MAAMC,EAAQC,IACbL,IACA,MAAiC,mBAAnBK,EAAMC,SACjBD,EAAMC,SAASD,EAAME,EAAGF,EAAMG,GAC9BH,EAAMC,mBAGMG,EAAkBJ,GACjCL,IACA,MAAMU,EACiB,mBAAfL,EAAMM,KAAsBN,EAAMM,OAASN,EAAMM,KAAKD,MAC9D,IAAKA,EAAO,OAAOL,EAAMO,UAAY,UACrC,OAAOX,EAACG,EAAK,CAAAG,EAAGG,EAAOJ,SAAUD,EAAMC,UACxC,CAWgB,SAAAO,EAAOR,GACtBL,IACA,MAAMc,EAAQZ,EAAQ,IAAM,IAAIa,IAAO,IACvC,IAAIC,GACoB,mBAAfX,EAAMY,KAAsBZ,EAAMY,OAASZ,EAAMY,MAGxDP,MAEF,IAAKM,EAAKE,OAAQ,OAAOb,EAAMO,UAAY,KAE3C,MAAMO,EAAU,IAAIC,IAAIN,EAAMO,QAExBC,EAAQN,EAAKO,IAAI,CAACb,EAAOc,KAC9BL,EAAQM,OAAOf,GACf,IAAKI,EAAMY,IAAIhB,GAAQ,CACtB,MAAMiB,EACL1B,EAACG,GAAKG,EAAGG,EAAOc,IAAKA,EAAKhB,EAAGgB,EAAKlB,SAAUD,EAAMC,WAEnDQ,EAAMc,IAAIlB,EAAOiB,GACjB,OAAOA,CACR,CACA,OAAOb,EAAMe,IAAInB,EAAK,GAGvBS,EAAQW,QAAQpB,IACfI,EAAMW,OAAOf,EACd,GAEA,OAAOT,EAAcE,EAAU,CAAEG,SAAUgB,GAC5C,UAEgBS,EAAiBrB,GAChC,MAAMsB,EAAIjC,UAAUW,GACpB,GAAIsB,EAAEC,SAAWvB,EAAOsB,EAAEtB,MAAQA,EAClC,OAAOsB,CACR,CAEM,SAAUE,EAAgBxB,GAC/B,MAAMyB,EAAMpC,UAAUW,GACtB,KAAM,YAAayB,GAClBC,OAAOC,eAAeF,EAAK,UAAWG,GACvC,OAAOH,CACR,CACA,MAAMG,EAAiB,CACtBC,cAAc,EACdV,MACC,OAAWW,KAAC9B,KACb,EACAkB,IAAkBrB,GACjBiC,KAAK9B,MAAQH,CACd,UACAM,SAAAJ,UAAAsB,mBAAAG"}

package/utils/dist/utils.module.js

@@ -1 +1 @@
-import{useSignal}from"@preact/signals-react";import{useSignals as r}from"@preact/signals-react/runtime";import{useMemo as n,createElement as t,Fragment as e}from"react";function i(n){r();var t=n.when.value;if(!t)return n.fallback||null;else return"function"==typeof n.children?n.children(t):n.children}function u(i){r();var u=n(function(){return new Map},[]),f=("function"==typeof i.each?i.each():i.each).value;if(!f.length)return i.fallback||null;var c=f.map(function(r,n){if(!u.has(r))u.set(r,i.children(r,n));return u.get(r)});return t(e,{children:c})}function f(r){var n=useSignal(r);if(n.peek()!==r)n.value=r;return n}function c(r){var n=useSignal(r);if(!("current"in n))Object.defineProperty(n,"current",o);return n}var o={configurable:!0,get:function(){return this.value},set:function(r){this.value=r}};export{u as For,i as Show,f as useLiveSignal,c as useSignalRef};//# sourceMappingURL=utils.module.js.map
+import{useSignal}from"@preact/signals-react";import{useSignals as n}from"@preact/signals-react/runtime";import{createElement as r,useMemo as t,Fragment as e}from"react";var i=function(r){n();return"function"==typeof r.children?r.children(r.v,r.i):r.children};function u(t){n();var e="function"==typeof t.when?t.when():t.when.value;if(!e)return t.fallback||null;else return r(i,{v:e,children:t.children})}function c(u){n();var c=t(function(){return new Map},[]),f=("function"==typeof u.each?u.each():u.each).value;if(!f.length)return u.fallback||null;var o=new Set(c.keys()),a=f.map(function(n,t){o.delete(n);if(!c.has(n)){var e=r(i,{v:n,key:t,i:t,children:u.children});c.set(n,e);return e}return c.get(n)});o.forEach(function(n){c.delete(n)});return r(e,{children:a})}function f(n){var r=useSignal(n);if(r.peek()!==n)r.value=n;return r}function o(n){var r=useSignal(n);if(!("current"in r))Object.defineProperty(r,"current",a);return r}var a={configurable:!0,get:function(){return this.value},set:function(n){this.value=n}};export{c as For,u as Show,f as useLiveSignal,o as useSignalRef};//# sourceMappingURL=utils.module.js.map

package/utils/dist/utils.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.module.js","sources":["../src/index.ts"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T>;\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value = props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn typeof props.children === \"function\"\n\t\t? props.children(value)\n\t\t: props.children;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst items = list.map((value, key) => {\n\t\tif (!cache.has(value)) {\n\t\t\tcache.set(value, props.children(value, key));\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["Show","props","useSignals","value","when","fallback","children","For","cache","useMemo","Map","list","each","length","items","map","key","has","set","get","createElement","Fragment","useLiveSignal","s","useSignal","peek","useSignalRef","ref","Object","defineProperty","refSignalProto","configurable","this","v"],"mappings":"kLAWgBA,EAAkBC,GACjCC,IACA,IAAMC,EAAQF,EAAMG,KAAKD,MACzB,IAAKA,EAAO,OAAOF,EAAMI,UAAY,UACrC,MAAiC,mBAAnBJ,EAAMK,SACjBL,EAAMK,SAASH,GACfF,EAAMK,QACV,CAWM,SAAUC,EAAON,GACtBC,IACA,IAAMM,EAAQC,EAAQ,WAAA,OAAU,IAAAC,GAAK,EAAE,IACnCC,GACoB,mBAAfV,EAAMW,KAAsBX,EAAMW,OAASX,EAAMW,MAGxDT,MAEF,IAAKQ,EAAKE,OAAQ,OAAOZ,EAAMI,UAAY,KAE3C,IAAMS,EAAQH,EAAKI,IAAI,SAACZ,EAAOa,GAC9B,IAAKR,EAAMS,IAAId,GACdK,EAAMU,IAAIf,EAAOF,EAAMK,SAASH,EAAOa,IAExC,OAAOR,EAAMW,IAAIhB,EAClB,GACA,OAAOiB,EAAcC,EAAU,CAAEf,SAAUQ,GAC5C,UAEgBQ,EAAiBnB,GAChC,IAAMoB,EAAIC,UAAUrB,GACpB,GAAIoB,EAAEE,SAAWtB,EAAOoB,EAAEpB,MAAQA,EAClC,OAAOoB,CACR,CAEgB,SAAAG,EAAgBvB,GAC/B,IAAMwB,EAAMH,UAAUrB,GACtB,KAAM,YAAawB,GAClBC,OAAOC,eAAeF,EAAK,UAAWG,GACvC,OAAOH,CACR,CACA,IAAMG,EAAiB,CACtBC,cAAc,EACdZ,eACC,OAAOa,KAAK7B,KACb,EACAe,IAAA,SAAkBe,GACjBD,KAAK7B,MAAQ8B,CACd,UACA1B,SAAAP,UAAAsB,mBAAAI"}
+{"version":3,"file":"utils.module.js","sources":["../src/index.tsx"],"sourcesContent":["import { ReadonlySignal, Signal } from \"@preact/signals-core\";\nimport { useSignal } from \"@preact/signals-react\";\nimport { useSignals } from \"@preact/signals-react/runtime\";\nimport { Fragment, createElement, useMemo } from \"react\";\n\ninterface ShowProps<T = boolean> {\n\twhen: Signal<T> | ReadonlySignal<T> | (() => T);\n\tfallback?: JSX.Element;\n\tchildren: JSX.Element | ((value: NonNullable<T>) => JSX.Element);\n}\n\nconst Item = (props: any) => {\n\tuseSignals();\n\treturn typeof props.children === \"function\"\n\t\t? props.children(props.v, props.i)\n\t\t: props.children;\n};\n\nexport function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst value =\n\t\ttypeof props.when === \"function\" ? props.when() : props.when.value;\n\tif (!value) return props.fallback || null;\n\treturn <Item v={value} children={props.children} />;\n}\n\ninterface ForProps<T> {\n\teach:\n\t\t| Signal<Array<T>>\n\t\t| ReadonlySignal<Array<T>>\n\t\t| (() => Signal<Array<T>> | ReadonlySignal<Array<T>>);\n\tfallback?: JSX.Element;\n\tchildren: (value: T, index: number) => JSX.Element;\n}\n\nexport function For<T>(props: ForProps<T>): JSX.Element | null {\n\tuseSignals();\n\tconst cache = useMemo(() => new Map(), []);\n\tlet list = (\n\t\t(typeof props.each === \"function\" ? props.each() : props.each) as Signal<\n\t\t\tArray<T>\n\t\t>\n\t).value;\n\n\tif (!list.length) return props.fallback || null;\n\n\tconst removed = new Set(cache.keys());\n\n\tconst items = list.map((value, key) => {\n\t\tremoved.delete(value);\n\t\tif (!cache.has(value)) {\n\t\t\tconst result = (\n\t\t\t\t<Item v={value} key={key} i={key} children={props.children} />\n\t\t\t);\n\t\t\tcache.set(value, result);\n\t\t\treturn result;\n\t\t}\n\t\treturn cache.get(value);\n\t});\n\n\tremoved.forEach(value => {\n\t\tcache.delete(value);\n\t});\n\n\treturn createElement(Fragment, { children: items });\n}\n\nexport function useLiveSignal<T>(value: Signal<T> | ReadonlySignal<T>) {\n\tconst s = useSignal(value);\n\tif (s.peek() !== value) s.value = value;\n\treturn s;\n}\n\nexport function useSignalRef<T>(value: T) {\n\tconst ref = useSignal(value) as Signal<T> & { current: T };\n\tif (!(\"current\" in ref))\n\t\tObject.defineProperty(ref, \"current\", refSignalProto);\n\treturn ref;\n}\nconst refSignalProto = {\n\tconfigurable: true,\n\tget(this: Signal) {\n\t\treturn this.value;\n\t},\n\tset(this: Signal, v: any) {\n\t\tthis.value = v;\n\t},\n};\n"],"names":["useSignal","useSignals","createElement","useMemo","Fragment","Item","props","children","v","i","Show","value","when","fallback","For","cache","Map","list","each","length","removed","Set","keys","items","map","key","has","result","set","get","forEach","useLiveSignal","s","peek","useSignalRef","ref","Object","defineProperty","refSignalProto","configurable","this"],"mappings":"OAWAA,cAAA,6CAAAC,MAAA,wDAAAC,aAAAC,cAAAC,MAAA,QAAA,IAAMC,EAAO,SAACC,GACbL,IACA,MAAiC,mBAAnBK,EAAMC,SACjBD,EAAMC,SAASD,EAAME,EAAGF,EAAMG,GAC9BH,EAAMC,QACV,EAEgB,SAAAG,EAAkBJ,GACjCL,IACA,IAAMU,EACiB,mBAAfL,EAAMM,KAAsBN,EAAMM,OAASN,EAAMM,KAAKD,MAC9D,IAAKA,EAAO,OAAOL,EAAMO,UAAY,UACrC,OAAOX,EAACG,EAAK,CAAAG,EAAGG,EAAOJ,SAAUD,EAAMC,UACxC,CAWM,SAAUO,EAAOR,GACtBL,IACA,IAAMc,EAAQZ,EAAQ,WAAA,WAAUa,GAAK,EAAE,IACnCC,GACoB,mBAAfX,EAAMY,KAAsBZ,EAAMY,OAASZ,EAAMY,MAGxDP,MAEF,IAAKM,EAAKE,OAAQ,OAAOb,EAAMO,UAAY,KAE3C,IAAMO,EAAU,IAAIC,IAAIN,EAAMO,QAExBC,EAAQN,EAAKO,IAAI,SAACb,EAAOc,GAC9BL,EAAc,OAACT,GACf,IAAKI,EAAMW,IAAIf,GAAQ,CACtB,IAAMgB,EACLzB,EAACG,GAAKG,EAAGG,EAAOc,IAAKA,EAAKhB,EAAGgB,EAAKlB,SAAUD,EAAMC,WAEnDQ,EAAMa,IAAIjB,EAAOgB,GACjB,OAAOA,CACR,CACA,OAAOZ,EAAMc,IAAIlB,EAClB,GAEAS,EAAQU,QAAQ,SAAAnB,GACfI,EAAY,OAACJ,EACd,GAEA,OAAOT,EAAcE,EAAU,CAAEG,SAAUgB,GAC5C,CAEgB,SAAAQ,EAAiBpB,GAChC,IAAMqB,EAAIhC,UAAUW,GACpB,GAAIqB,EAAEC,SAAWtB,EAAOqB,EAAErB,MAAQA,EAClC,OAAOqB,CACR,CAEM,SAAUE,EAAgBvB,GAC/B,IAAMwB,EAAMnC,UAAUW,GACtB,KAAM,YAAawB,GAClBC,OAAOC,eAAeF,EAAK,UAAWG,GACvC,OAAOH,CACR,CACA,IAAMG,EAAiB,CACtBC,cAAc,EACdV,eACC,YAAYlB,KACb,EACAiB,IAAG,SAAepB,GACjBgC,KAAK7B,MAAQH,CACd,UACAM,SAAAJ,UAAAqB,mBAAAG"}

package/utils/package.json

@@ -7,7 +7,7 @@
   "module": "dist/utils.module.js",
   "unpkg": "dist/utils.min.js",
   "types": "dist/index.d.ts",
-  "source": "src/index.ts",
+  "source": "src/index.tsx",
   "mangle": "../../../mangle.json",
   "exports": {
     ".": {

package/utils/src/{index.ts → index.tsx}

@@ -4,18 +4,24 @@ import { useSignals } from "@preact/signals-react/runtime";
 import { Fragment, createElement, useMemo } from "react";
 
 interface ShowProps<T = boolean> {
-	when: Signal<T> | ReadonlySignal<T>;
+	when: Signal<T> | ReadonlySignal<T> | (() => T);
 	fallback?: JSX.Element;
 	children: JSX.Element | ((value: NonNullable<T>) => JSX.Element);
 }
 
-export function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {
+const Item = (props: any) => {
 	useSignals();
-	const value = props.when.value;
-	if (!value) return props.fallback || null;
 	return typeof props.children === "function"
-		? props.children(value)
+		? props.children(props.v, props.i)
 		: props.children;
+};
+
+export function Show<T = boolean>(props: ShowProps<T>): JSX.Element | null {
+	useSignals();
+	const value =
+		typeof props.when === "function" ? props.when() : props.when.value;
+	if (!value) return props.fallback || null;
+	return <Item v={value} children={props.children} />;
 }
 
 interface ForProps<T> {
@@ -38,12 +44,24 @@ export function For<T>(props: ForProps<T>): JSX.Element | null {
 
 	if (!list.length) return props.fallback || null;
 
+	const removed = new Set(cache.keys());
+
 	const items = list.map((value, key) => {
+		removed.delete(value);
 		if (!cache.has(value)) {
-			cache.set(value, props.children(value, key));
+			const result = (
+				<Item v={value} key={key} i={key} children={props.children} />
+			);
+			cache.set(value, result);
+			return result;
 		}
 		return cache.get(value);
 	});
+
+	removed.forEach(value => {
+		cache.delete(value);
+	});
+
 	return createElement(Fragment, { children: items });
 }