{"bugs":{"url":"https://github.com/alloc/fluids/issues"},"dist":{"shasum":"15700ed04fc28d95c66d5694d6ae10274e9ac746","tarball":"https://registry.npmjs.org/fluids/-/fluids-0.3.0-rc.0.tgz","fileCount":9,"integrity":"sha512-mGjehrovasroOMRX95sx84xJOvXm6shcD6rK6IW1B19x6gFQj5pqzpXg2RcKiDLl+IdExmY5VotGRIJQRhm/Mg==","signatures":[{"sig":"MEYCIQDyuk+BlGapeZ8aI4lH9G7I/ip5oxhcKS1pBHXpR4ARiQIhAIQ7lGIdw686rdLqp4EqS0XV9+dNgA4Rk7SKMtw2gqJU","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":28876,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgo+j1CRA9TVsSAnZWagAAnvYQAKSvTDFL1ZK7idpkowyy\n2+meyCgjOWWAHfQ1176bvvcRjGBG2CER+hjS23EXjTI6yMAVwr2jnVm/U0QK\nAHfAHFk2tonrz8QkAuOL51Lw7hNKWS0c/UBvAVNFYyIa3Zb5N+BeBAyDKwt4\nFimqivolMoIFp/r6a6EPC0uBLT/q+7hhXT+E7xC1Ex2Psianz0KOEcxtabk5\nNB1apdwkNrb6IQkUk9y9mdveXwJe1FyrXKMRzR3xOpxqFSdFiXmRFlWBZXg9\n8KBGLbPFfyvi/mZoQYqTcDtGqLI3tma9otsXYsBp55fJbA8exbwPF5MkQH91\nCPz6Q9bDXRiXqGlaMAaUagodN66hGMpxJPyZxRJJHyJZIrLIxTkgLKzB21Ou\njH3vfOz8d8QGJOgRgJ1LPtSvE8qpq3h32AQpalsNdP48xAIXH7OC64hw30bR\ngLdNzy+IoU3D93RFkiCIjhVQCAKlG7y6EwmdjZcs52v8pimwkjyZbDlq8fW2\nCxjmIPOltEfJ3DR7e/M8ZEoWoFzOLaWxrPzMwBz0I/CdDQJuQKnkfHrbJl+2\nHdUFmK44IvFlu/Z2CBp1iakmZohE4eOsXroYYOG2AnHG6/vNhk905DD9DsKX\nupEhKIjksKqT7iKRDvjvXUo89n5MldZciPo7pQyviBHtO8rVPru6gTF+6WJO\nTyt+\r\n=qAtw\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/cjs/index","name":"fluids","author":{"name":"Alec Larson"},"module":"dist/esm/index","readme":"# fluids\n\nThis library is a tiny glue layer for observable events.\n\n- Create a tree of observable values\n- Let parent nodes send arbitrary events to children (for maximum flexibility)\n- Stay small yet provide helpers for easier integration\n\n&nbsp;\n\n### Observe a value\n\nAny object can be observed, but `FluidValue` objects have strongly typed\nevents. Observed objects are basically event emitters whose listeners\nreceive every event, and they typically represent a single value.\n\nTo start observing:\n\n```ts\nimport { addFluidObserver } from 'fluids'\n\n// You can pass a function:\nlet observer = addFluidObserver(target, (event) => {\n  console.log(event)\n})\n\n// or pass an object:\nobserver = addFluidObserver(target, {\n  eventObserved(event) {\n    console.log(event)\n  },\n})\n```\n\nTo stop observing:\n\n```ts\nimport { removeFluidObserver } from 'fluids'\n\nremoveFluidObserver(target, observer)\n```\n\n### Create an observed object\n\nYou can extend the `FluidValue` class for automatic TypeScript support with\n`fluids`-compatible libraries.\n\n```ts\nimport { FluidValue, FluidObservable, callFluidObservers } from 'fluids'\n\n// Your class can have multiple event types.\n// The `type` and `parent` properties are required.\ntype RefEvent<T> = { type: 'change'; value: T; parent: Ref<T> }\n\n// Use \"interface merging\" to attach the event types.\ninterface Ref<T> extends FluidObservable<RefEvent<T>> {}\n\n// This example is an observable React ref.\nclass Ref<T> extends FluidValue<T> {\n  private _current: T\n  constructor(initialValue: T) {\n    // Passing a getter to super is only required\n    // if your class has no \"get\" method.\n    super(() => this._current)\n\n    this._current = initialValue\n  }\n  get current() {\n    return this._current\n  }\n  set current(value: T) {\n    this._current = value\n\n    // Send the change to all observers.\n    callFluidObservers(this, {\n      type: 'change',\n      value,\n      parent: this,\n    })\n  }\n  //\n  // These methods are completely optional.\n  //\n  protected observerAdded(count: number) {\n    if (count == 1) {\n      // Do something when the first observer is added.\n    }\n  }\n  protected observerRemoved(count: number) {\n    if (count == 0) {\n      // Do something when the last observer is removed.\n    }\n  }\n}\n```\n\nIf extending `FluidValue` isn't an option, you can outfit an object or\nprototype with the `setFluidGetter` function:\n\n```ts\nimport { setFluidGetter, callFluidObservers } from 'fluids'\n\n// This example augments an existing React ref.\nlet { current } = ref\nlet get = () => current\nsetFluidGetter(ref, get)\nObject.defineProperty(ref, 'current', {\n  get,\n  set(value) {\n    current = value\n\n    // Remember to notify any observers.\n    callFluidObservers(ref, {\n      type: 'change',\n      value,\n      parent: ref,\n    })\n  },\n})\n```\n\n### For libraries\n\nThe remaining functions are useful when making a `fluids`-compatible library.\n\n```ts\nimport {\n  hasFluidValue,\n  getFluidValue,\n  getFluidObservers,\n  callFluidObserver,\n} from 'fluids'\n\n// Check if a value is observable.\nhasFluidValue(target)\n\n// Get the current value. Returns `target` if not observable.\ngetFluidValue(target)\n\n// Get the current observers (or null if none exist).\ngetFluidObservers(target)\n\n// Call a single observer. Useful for special observation, like waterfalls.\ncallFluidObserver(observer, event)\n```\n","gitHead":"94fa24cf05ba7ad44f707de889bb2518a426efe3","license":"MIT","scripts":{"build":"tsc -p . --outDir dist/cjs && tsc -p . --module es6 --outDir dist/esm","prepare":"yarn build"},"_npmUser":{"name":"aleclarson","email":"aleclarson@protonmail.com"},"homepage":"https://github.com/alloc/fluids#readme","keywords":["reactive","reactivity","glue","observable","watch"],"repository":{"url":"git+https://github.com/alloc/fluids.git","type":"git"},"_npmVersion":"7.10.0","description":"Glue layer for reactivity","directories":{},"maintainers":[{"name":"aleclarson","email":"aleclarson@protonmail.com"}],"_nodeVersion":"14.13.1","_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"typescript":"^4.1.2"},"_npmOperationalInternal":{"tmp":"tmp/fluids_0.3.0-rc.0_1621354740960_0.4372710648106053","host":"s3://npm-registry-packages"},"_id":"fluids@0.3.0-rc.0","version":"0.3.0-rc.0"}