next

.github/workflows/publish.yml

@@ -23,5 +23,5 @@ jobs:
     - run: npm ci
     - run: npm run build -s
     - run: npm test
-    - run: npm publish --ignore-scripts --tag latest
+    - run: npm publish --ignore-scripts --tag next
 

CHANGELOG.md

@@ -7,6 +7,22 @@
 
 
 
+<br/><br/>
+
+## v0.4
+
+### v0.4.0
+- 🟥 upgraded to [@e280/strata](https://github.com/e280/strata) v0.4
+ - 🟥 this is not compatible with strata 0.3, which means 0.4 will not respond to 0.3 signals, eg, your app also needs to adopt strata 0.4 to work with sly now -- strata is now a proper peerDependency of sly
+  - 🟥 strata-oriented hooks like `useSignal` now return strata 0.4 signals, not 0.3 signals, they're different, see the [strata changelog](https://github.com/e280/strata/blob/main/CHANGELOG.md) for details
+  - 🟥 removed `useLazy` hook in favor of improved lazy `useDerived`
+  - 🟥 renamed `useWaitResult` to `useWaitFormal`
+  - 🟥 `useEffect` is now simpler and only takes one simple fn, returns nothing
+- 🟥 delete old deprecated `Op` stuff in favor of newer `wait` stuff from strata
+- 🟥 delete old deprecated `loader` stuff in favor of newer `spinner` stuff
+
+
+
 <br/><br/>
 
 ## v0.3

README.md

@@ -52,10 +52,10 @@ export const MyShadowView = shadow(() => html`<p>shrouded in darkness</p>`)
 
     export const MyCounter = light((start: number) => {
       const $count = useSignal(start)
-      const increment = () => $count.value++
+      const increment = () => $count($count() + 1)
 
       return html`
-        <button @click="${increment}">${$count.value}</button>
+        <button @click="${increment}">${$count()}</button>
       `
     })
     ```
@@ -83,10 +83,10 @@ export const MyShadowView = shadow(() => html`<p>shrouded in darkness</p>`)
       useCss(css`button { color: cyan }`)
 
       const $count = useSignal(start)
-      const increment = () => $count.value++
+      const increment = () => $count($count() + 1)
 
       return html`
-        <button @click="${increment}">${$count.value}</button>
+        <button @click="${increment}">${$count()}</button>
         <slot></slot>
       `
     })
@@ -216,7 +216,7 @@ you must not call these hooks under if-conditionals, or for-loops, or inside cal
     // write the signal
     $count(2)
     ```
-- **useDerived,** create a [strata](https://github.com/e280/strata) derived signal
+- **useDerived,** create a [strata](https://github.com/e280/strata) derived formula
     ```ts
     const $product = useDerived(() => $count() * $whatever())
     ```
@@ -286,9 +286,9 @@ you must not call these hooks under if-conditionals, or for-loops, or inside cal
         await $wait.ready
           // 123
         ```
-- **useWaitResult,** start a [strata#wait](https://github.com/e280/strata#wait), but with a formal [stz#ok](https://github.com/e280/stz#ok) ok/err result
+- **useWaitFormal,** start a [strata#wait](https://github.com/e280/strata#wait), but with a formal [stz#ok](https://github.com/e280/stz#ok) ok/err result
     ```ts
-    const $wait = useWaitResult(async() => {
+    const $wait = useWaitFormal(async() => {
       await nap(2000)
       return (Math.random() > 0.5)
         ? ok(123)
@@ -306,7 +306,7 @@ you must not call these hooks under if-conditionals, or for-loops, or inside cal
 
     useMount(() => cycle(async() => {
       await nap(1000)
-      $seconds.value++
+      $seconds($seconds() + 1)
     }))
     ```
 - wake + rendered, to do something after each mount's first render
@@ -463,7 +463,7 @@ now, if you want to setup `location.hash` routing, you might want these primitiv
     const $hash = hashSignal()
     ```
     ```ts
-    $hash.value
+    $hash()
       // "user/123/profile"
     ```
     - the signal value auto-updates whenever the hash changes

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@e280/sly",
-	"version": "0.3.12",
+	"version": "0.4.0-next.5",
 	"description": "web shadow views",
 	"license": "MIT",
 	"type": "module",
@@ -15,9 +15,7 @@
 		"./loot": "./x/loot/index.js",
 		"./spa": "./x/spa/index.js",
 		"./spinner": "./x/spinner/index.js",
-		"./view": "./x/view/index.js",
-		"./loader": "./x/deprecated/loader/index.js",
-		"./op": "./x/deprecated/op/index.js"
+		"./view": "./x/view/index.js"
 	},
 	"scripts": {
 		"build": "rm -rf x && mkdir x && tsc && scute -v",
@@ -26,11 +24,11 @@
 		"count": "find s -path '*/_archive' -prune -o -name '*.ts' -exec wc -l {} +"
 	},
 	"peerDependencies": {
-		"lit": "^3.3.2"
+		"@e280/strata": "0.4.0-next.8",
+		"lit": "^3.3.3"
 	},
 	"dependencies": {
-		"@e280/strata": "^0.3.4",
-		"@e280/stz": "^0.2.34"
+		"@e280/stz": "0.3.0-next.1"
 	},
 	"devDependencies": {
 		"@e280/hottie": "^0.1.1",

s/demo/views/counter-light.ts

@@ -4,7 +4,7 @@ import {light, useSignal} from "../../view/index.js"
 
 export const CounterLight = light((start: number) => {
 	const $count = useSignal(start)
-	const increment = () => $count.value++
+	const increment = () => $count($count() + 1)
 
 	return html`
 		<button @click="${increment}">${$count()}</button>

s/demo/views/counter-shadow.ts

@@ -7,7 +7,7 @@ export const CounterShadow = shadow((start: number) => {
 	useCss(css`:host{display:inline-block} button{color:cyan}`)
 
 	const $count = useSignal(start)
-	const increment = () => $count.value++
+	const increment = () => $count($count() + 1)
 
 	return html`
 		<button @click="${increment}">${$count()}</button>

s/demo/views/loaders.ts

@@ -1,6 +1,6 @@
 
 import {css, html} from "lit"
-import {newWait} from "@e280/strata"
+import {makeWait} from "@e280/strata"
 import {shadow} from "../../view/shadow.js"
 import {moonSpinner} from "../../spinner/spinners/moon.js"
 import {waveSpinner} from "../../spinner/spinners/wave.js"
@@ -13,7 +13,7 @@ export const LoadersView = shadow(() => {
 	useName("loaders")
 	useStyles(cssReset, styles)
 
-	const wait = useOnce(() => newWait())
+	const wait = useOnce(() => makeWait())
 
 	return Object.entries(spinners).map(([key, spinner]) => html`
 		<div data-anim=spinner>