open-index/open-npm huggingface dataset:
npm package: @ncpa0cpl/node-worker-bridge
Description: Wrapper for Node's Workers, easily define methods and share them between main thread and worker.
Author: Bretner Szymon
Latest version: 0.0.3

## Usage

### Expose Worker methods to the main thread

```ts
// worker.cjs
import { WorkerBridge } from "@ncpa0cpl/node-worker-bridge";

export const worker = WorkerBridge({ file: __filename }, () => {
  const calculatePi = () => {
    return "3.1415926535897932384626433832795028841971693993751058209749445923078164062862089986280348253421170679";
  };

  return { calculatePi };
});
```

```ts
// main.cjs
import { worker } from "./worker.cjs";

function main() {
  // create a pool of 4 workers
  const workerPool = worker.createPool(4);

  const piCalcResult1 = await workerPool.calculatePi();
  console.log(piCalcResult1); // will print the pi number

  // terminate the pool so the program can exit
  workerPool.close();
}

main();
```

### Expose methods from the main thread to the Worker

```ts
// worker.cjs
import { WorkerBridge } from "@ncpa0cpl/node-worker-bridge";

type MainThreadMethods = {
  getGlobalState(): { foo: string };
};

export const worker = WorkerBridge(
  { file: __filename },
  (mainThreadMethods: MainThreadMethods) => {
    const loopbackFoo = async () => {
      return (await mainThreadMethods.getGlobalState()).foo;
    };

    return { loopbackFoo };
  }
);
```

```ts
// main.cjs
import { worker } from "./worker.cjs";

const globalState = {
  foo: "Hello",
};

function main() {
  // create a pool of 4 workers
  const workerPool = worker.createPool(4, {
    getGlobalState: () => {
      return { ...globalState };
    },
  });

  const foo = await workerPool.loopbackFoo();
  console.log(foo); // will print "Hello"

  // terminate the pool so the program can exit
  workerPool.close();
}

main();
```
npm package: @ncpa0cpl/vrouter
Description: Client side router for vanilla js
Author: Szymon Bretner
Latest version: 0.0.14

# VRouter

A framework independent router for JavaScript.

## Basic Usage

```ts
import { router } from "@ncpa0cpl/vrouter";
import { renderAboutUsPage, renderHomePage } from "./pages";

// define the routes
const AppRouter = router({
  paramNames: [],
  subroutes: (define) => ({
    home: define({
      paramNames: [],
      title: "Home Page",
      default: true,
      component() {
        return renderHomePage(); // return a HTMLElement
      },
    }),
    about: define({
      paramNames: [],
      title: "About Us",
      component() {
        return renderAboutUsPage(); // return a HTMLElement
      },
    }),
  }),
});

// mount the router on the page
document.body.appendChild(AppRouter.rootElement());

// navigate to the about us page
AppRouter.nav.about.$open();
```

## Query Parameters (slugs)

```ts
// define a route with a arbitrary string in the URL
const AppRouter = router({
  paramNames: [],
  subroutes: (define) => ({
    posts: define({
      paramNames: [],
      subroutes: (define) => ({
        postID: define({
          slug: true,
          component(ctx) {
            const slugValue = ctx.slug.get();
            // listen to slug changes
            ctx.slug.add(() => {
              console.log(ctx.slug.get());
            });

            return renderPostPage();
          },
        }),
      }),
    }),
  }),
});

// navigate to the post page
AppRouter.nav.posts.postID("123").$open();
```

## Search Parameters

```ts
// define a route with search parameters
const AppRouter = router({
  paramNames: [],
  subroutes: (define) => ({
    search: define({
      searchParams: ["q"],
      component(ctx) {
        const searchValue = ctx.params.get().q;
        // listen to search parameter changes
        ctx.params.add(({ q }) => {
          console.log(q);
        });

        return renderSearchPage();
      },
    }),
  }),
});

// navigate to the search page
AppRouter.nav.search.$open({ q: "search query" });
```

## Replace routes and Nested routes

Routes defined in the router can have one of two modes, `replace` or `nest-routes`. A replace mode route will replace its Element with the active child Route if there is one, while a nest-routes mode route will append the active child Route Element to a outlet Element, which can be accessed through the Route context.

```ts
const AppRouter = router({
  paramNames: [],
  mode: "nest-routes",
  component(ctx) {
    const layout = document.createElement("div");
    layout.append(ctx.out()); // append the Outlet Element to the layout div
    return layout;
  },
  subroutes: (define) => ({
    home: define({
      paramNames: [],
      title: "Home Page",
      default: true,
      component() {
        const homeContainer = document.createElement("div");
        // this div will be appended to the layout div created above when this route is opened
        return homeContainer;
      },
    }),
  }),
});
```