@manyducks.co/dolla 0.67.0 → 0.68.1

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,12 +774,26 @@ 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;
         return readable2[OBSERVE]((currentValue) => {
           const computedValue = compute(currentValue, lastObservedValue);
+          if (isReadable(computedValue)) {
+            lastComputedValue = computedValue;
+            return computedValue[OBSERVE]((current, previous) => {
+              callback(current, previous);
+              lastObservedValue = current;
+            });
+          }
           if (!deepEqual(computedValue, lastComputedValue)) {
             const previousValue = lastComputedValue === UNOBSERVED ? void 0 : lastComputedValue;
             callback(computedValue, previousValue);
@@ -2565,7 +2579,7 @@ async function makeRequest(config) {
   let response;
   const handler = async () => {
     const query2 = request.query.toString();
-    const fullURL = request.query.keys.length > 0 ? request.uri + "?" + query2 : request.uri;
+    const fullURL = query2.length > 0 ? request.uri + "?" + query2 : request.uri;
     let reqBody;
     if (!request.headers.has("content-type") && isObject(request.body)) {
       request.headers.set("content-type", "application/json");
@@ -2692,7 +2706,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;
           }
         }
@@ -3357,7 +3371,7 @@ function RouterStore(ctx) {
   const $$path = writable("");
   const $$params = writable({});
   const $$query = writable({});
-  let isRouteChange = false;
+  let isRouteChange = true;
   ctx.observe($$query, (current) => {
     if (isRouteChange) {
       isRouteChange = false;
@@ -3389,7 +3403,7 @@ function RouterStore(ctx) {
     if (location.search !== lastQuery) {
       lastQuery = location.search;
       isRouteChange = true;
-      $$query.set(parseQueryParams(location.search));
+      $$query.set(parseQueryParams(location.search.startsWith("?") ? location.search.slice(1) : location.search));
     }
     const matched = matchRoutes(ctx.options.routes, location.pathname);
     if (!matched) {
@@ -4021,23 +4035,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();
 }