npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@gaubee/flow

v0.3.3

Published

启发于 kotlin 的 flow,针对 js/ts 开发人员设计的接口,通常可以作为一个事件管理器

Downloads

48

Readme

@gaubee/flow

启发于 kotlin 的 flow,针对 js/ts 开发人员设计的接口,通常可以作为一个事件管理器

docs 文档

install:

npm install @gaubee/flow
pnpm install @gaubee/flow
yarn install @gaubee/flow
deno add npm:@gaubee/flow
bun add @gaubee/flow

deno add jsr:@gaubee/flow
npx jsr add @gaubee/flow
yarn dlx jsr add @gaubee/flow
pnpm dlx jsr add @gaubee/flow
bunx jsr add @gaubee/flow

example:

  • Basic Usage: SharedFlow extends PureEventDelegate
import { SharedFlow } from "@gaubee/flow";
const shared_flow = new SharedFlow<string>();
/// basic
// add listen
const off = shared_flow.on((data) => console.log("on", data));
// dispatch listen
shared_flow.emit("hi");
// remove listen
off();

// add listen with custom key
shared_flow.on((data) => console.log("on", data), { key: "key1" });
// remove listen with custom key
shared_flow.off("key1");

// add listen width dispose function
const off = shared_flow.on((data) => console.log("on", data), {
  onDispose: async () => {
    console.log("off");
    return 123;
  },
});
// remove listen and run dispatch function
console.log(await off()); // { status: "fulfilled", value: 123 }

/// once
// add one time listen with callback function
shared_flow.once((data) => console.log("once", data));
// add one time listen without callback function and return promise
shared_flow.once().then((data) => console.log("once.then", data));
// add one time listen with filter function
shared_flow
  .once({
    filter(data) {
      return data == "match";
    },
  })
  .then((data) => console.log("once filter", data));
  • SharedFlow.stream
import { SharedFlow } from "@gaubee/flow";
const shared_flow = new SharedFlow<string>();

// add listen and got stream
const stream = shared_flow.stream();

shared_flow.emit("hi");

for await (const data of stream) {
  console.log(data);
  // break loop will remove listen
  break;
}
  • StateFlow extends SharedFlow & StateFlow.value
import { StateFlow } from "@gaubee/flow";

const state_flow = new StateFlow<string>("v1");
state_flow.emit("v2");
state_flow.value === "v2";
state_flow.value = "v3";