@manyducks.co/dolla 0.67.0 → 0.68.0

package/README.md

@@ -466,7 +466,7 @@ function ExampleView(props, ctx) {
 
 function LayoutView() {
   return (
-    <StoreScope store={ExampleStore}>
+    <StoreScope stores={[ExampleStore]}>
       <ExampleView />
     </StoreScope>
   );
@@ -512,7 +512,7 @@ The main view (defined with the app's `main` method) is the top-level view that
 // Here is a hypothetical main view with a layout and navigation:
 app.main((props, ctx) => {
   return (
-    <div className="todo-layout">
+    <div class="todo-layout">
       <nav>
         <ul>
           <li>

package/lib/index.d.ts

@@ -12,7 +12,7 @@ export type { ViewContext } from "./view.js";
 export type { StoreContext } from "./store.js";
 export type { Markup } from "./markup.js";
 export type { HTTPMiddleware } from "./stores/http.js";
-export type { InputType } from "./types.js";
+export type { InputType, Renderable } from "./types.js";
 import type { IntrinsicElements as Elements } from "./types";
 declare global {
     namespace JSX {

package/lib/index.js

@@ -774,7 +774,14 @@ function computed(...args) {
     const readable2 = args[0];
     const compute = args[1];
     return {
-      get: () => compute(readable2.get()),
+      get: () => {
+        const computed2 = compute(readable2.get());
+        if (isReadable(computed2)) {
+          return computed2.get();
+        } else {
+          return computed2;
+        }
+      },
       [OBSERVE]: (callback) => {
         let lastComputedValue = UNOBSERVED;
         let lastObservedValue;
@@ -2692,7 +2699,7 @@ function LanguageStore(ctx) {
       if (values) {
         const readableValues = {};
         for (const [key2, value] of Object.entries(values)) {
-          if (typeof value?.observe === "function") {
+          if (isReadable(value)) {
             readableValues[key2] = value;
           }
         }
@@ -4021,23 +4028,35 @@ function Fragment(_, ctx) {
 // src/views/store-scope.ts
 function StoreScope(props, ctx) {
   const { appContext, elementContext } = getViewSecrets(ctx);
-  const instance = initStore({
-    store: props.store,
-    options: props.options,
-    appContext,
-    elementContext
-  });
-  instance.setup();
-  elementContext.stores.set(props.store, {
-    store: props.store,
-    options: props.options,
-    instance
-  });
+  const instances = [];
+  for (const config of props.stores) {
+    let store;
+    let options;
+    if (isFunction(config)) {
+      store = config;
+    } else {
+      store = config.store;
+      options = config.options;
+    }
+    const instance = initStore({
+      store,
+      options,
+      appContext,
+      elementContext
+    });
+    instance.setup();
+    elementContext.stores.set(store, { store, options, instance });
+    instances.push(instance);
+  }
   ctx.beforeConnect(() => {
-    return instance.connect();
+    for (const instance of instances) {
+      instance.connect();
+    }
   });
   ctx.onDisconnected(() => {
-    instance.disconnect();
+    for (const instance of instances) {
+      instance.disconnect();
+    }
   });
   return ctx.outlet();
 }