@wirestate/lit-signals 0.6.0 → 0.6.1

package/CHANGELOG.md

@@ -1,3 +1,14 @@
+## 0.7.0
+
+- Add `useScope` in `@wirestate/react`
+- New lit elements modules - `@wirestate/lit` and `@wirestate/lit-signals`
+- `EventBus`: add `unsubscribe` method for explicit handler removal by reference
+- `QueryBus`: add `unregister` method for explicit handler removal by type and reference
+- `CommandBus`: add `unregister` method for explicit handler removal by type and reference
+- `WireScope`: add new event/command/query subscribe-unsubscribe methods
+- Export more alias / methods from `@wirestate/core`
+- Export more alias / methods from `@wirestate/react-mobx`
+
 ## 0.6.3
 
 - Update readme files for each module

package/README.md

@@ -11,6 +11,65 @@ Re-exports `@lit-labs/signals` for use with wirestate services in Lit elements.
 npm install @wirestate/lit-signals @lit-labs/signals
 ```
 
+## Usage
+
+```ts
+import {
+  signal,
+  computed,
+  watch,
+  Signal,
+  State,
+  Computed,
+} from '@wirestate/lit-signals';
+```
+
+Example service:
+
+```ts
+import { Injectable, Inject, WireScope } from '@wirestate/core';
+import { signal, computed, State, Computed } from '@wirestate/lit-signals';
+
+@Injectable()
+export class CounterService {
+  public readonly count: State<number> = signal(0);
+  public readonly isEven: Computed<boolean> = computed(() => this.count.get() % 2 === 0);
+
+  public constructor(@Inject(WireScope) private scope: WireScope) {}
+
+  public increment(): void {
+    this.count.set(this.count.get() + 1);
+  }
+}
+```
+
+Example Lit element:
+
+```ts
+import { LitElement, html } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { injection } from '@wirestate/lit';
+import { watch, computed } from '@wirestate/lit-signals';
+
+import { CounterService } from './services';
+
+@customElement('my-component')
+class MyComponent extends LitElement {
+  @injection({ injectionId: CounterService })
+  private readonly counterService!: CounterService;
+
+  private isOddLabel = computed(() => (this.counterService.count.get() % 2 === 0 ? "even" : "odd"));
+
+  render() {
+    return html`
+      <button @click="${() => this.counterService.increment()}">
+        count: ${watch(this.counterService.count)} (${watch(this.isOddLabel)})
+      </button>
+    `;
+  }
+}
+```
+
 ## License
 
 MIT

package/cjs/development/index.js

@@ -4,10 +4,6 @@ var signals = require('@lit-labs/signals');
 
 
 
-Object.defineProperty(exports, "Computed", {
-	enumerable: true,
-	get: function () { return signals.Computed; }
-});
 Object.defineProperty(exports, "Signal", {
 	enumerable: true,
 	get: function () { return signals.Signal; }
@@ -28,10 +24,6 @@ Object.defineProperty(exports, "signal", {
 	enumerable: true,
 	get: function () { return signals.signal; }
 });
-Object.defineProperty(exports, "svg", {
-	enumerable: true,
-	get: function () { return signals.svg; }
-});
 Object.defineProperty(exports, "watch", {
 	enumerable: true,
 	get: function () { return signals.watch; }

package/cjs/development/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/cjs/production/index.js

@@ -1 +1 @@
-"use strict";var e=require("@lit-labs/signals");Object.defineProperty(exports,"Computed",{enumerable:!0,get:function(){return e.Computed}}),Object.defineProperty(exports,"Signal",{enumerable:!0,get:function(){return e.Signal}}),Object.defineProperty(exports,"SignalWatcher",{enumerable:!0,get:function(){return e.SignalWatcher}}),Object.defineProperty(exports,"WatchDirective",{enumerable:!0,get:function(){return e.WatchDirective}}),Object.defineProperty(exports,"computed",{enumerable:!0,get:function(){return e.computed}}),Object.defineProperty(exports,"signal",{enumerable:!0,get:function(){return e.signal}}),Object.defineProperty(exports,"svg",{enumerable:!0,get:function(){return e.svg}}),Object.defineProperty(exports,"watch",{enumerable:!0,get:function(){return e.watch}}),Object.defineProperty(exports,"withWatch",{enumerable:!0,get:function(){return e.withWatch}});//# sourceMappingURL=index.js.map
+"use strict";var e=require("@lit-labs/signals");Object.defineProperty(exports,"Signal",{enumerable:!0,get:function(){return e.Signal}}),Object.defineProperty(exports,"SignalWatcher",{enumerable:!0,get:function(){return e.SignalWatcher}}),Object.defineProperty(exports,"WatchDirective",{enumerable:!0,get:function(){return e.WatchDirective}}),Object.defineProperty(exports,"computed",{enumerable:!0,get:function(){return e.computed}}),Object.defineProperty(exports,"signal",{enumerable:!0,get:function(){return e.signal}}),Object.defineProperty(exports,"watch",{enumerable:!0,get:function(){return e.watch}}),Object.defineProperty(exports,"withWatch",{enumerable:!0,get:function(){return e.withWatch}});//# sourceMappingURL=index.js.map

package/esm/development/index.js

@@ -1,2 +1,2 @@
-export { Computed, Signal, SignalWatcher, WatchDirective, computed, signal, svg, watch, withWatch } from '@lit-labs/signals';
+export { Signal, SignalWatcher, WatchDirective, computed, signal, watch, withWatch } from '@lit-labs/signals';
 //# sourceMappingURL=index.js.map

package/esm/production/index.js

@@ -1 +1 @@
-export{Computed,Signal,SignalWatcher,WatchDirective,computed,signal,svg,watch,withWatch}from"@lit-labs/signals";//# sourceMappingURL=index.js.map
+export{Signal,SignalWatcher,WatchDirective,computed,signal,watch,withWatch}from"@lit-labs/signals";//# sourceMappingURL=index.js.map

package/index.d.ts

@@ -1,6 +1,15 @@
 import { Signal } from 'signal-polyfill';
-export { Computed, Signal, SignalWatcher, WatchDirective, WatchDirectiveFunction, computed, signal, svg, watch, withWatch } from '@lit-labs/signals';
+export { Signal, SignalWatcher, WatchDirective, WatchDirectiveFunction, computed, signal, watch, withWatch } from '@lit-labs/signals';
 
+/**
+ * @group signals
+ * @see {@link https://lit.dev/docs/data/signals/}
+ */
 type State<T> = Signal.State<T>;
+/**
+ * @group signals
+ * @see {@link https://lit.dev/docs/data/signals/}
+ */
+type Computed<T> = Signal.Computed<T>;
 
-export type { State };
+export type { Computed, State };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wirestate/lit-signals",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "description": "Signals re-exports for wirestate lit elements",
   "sideEffects": false,
   "author": "Syrotenko Igor",