reactive-vscode - npm Package Compare versions

Comparing version 0.2.0-beta.3 to 0.2.0-beta.4

dist/index.d.ts

@@ -64,3 +64,17 @@ /// <reference types="vscode" />
 
-export declare interface ConfigRef<T> extends ShallowRef<T> {
+export declare type ConfigObject<C extends object> = ShallowReactive<C & {
+    /**
+     * Write the configuration value to the workspace.
+     *
+     * @see https://code.visualstudio.com/api/references/vscode-api#WorkspaceConfiguration.update
+     */
+    $update: (key: keyof C, value: C[keyof C], configurationTarget?: Nullable<ConfigurationTarget>, overrideInLanguage?: boolean) => Promise<void>;
+}>;
+
+export declare interface ConfigRef<T> extends WritableComputedRef<T> {
+    /**
+     * Write the configuration value to the workspace.
+     *
+     * @see https://code.visualstudio.com/api/references/vscode-api#WorkspaceConfiguration.update
+     */
     update: (value: T, configurationTarget?: ConfigurationTarget | boolean | null, overrideInLanguage?: boolean) => Promise<void>;
@@ -73,7 +87,7 @@ }
 
-declare type ConfigTypeOptions = Record<string, ConfigTypeRaw<any>>;
+/* Excluded from this release type: ConfigTypeOptions */
 
 declare type ConfigTypeRaw<T> = ConfigTypeSingle<T> | ConfigTypeSingle<T>[];
 
-declare type ConfigTypeSingle<T> = string | typeof String | typeof Number | typeof Boolean | typeof Array | typeof Object | null | ConfigType<T>;
+declare type ConfigTypeSingle<T> = typeof String | typeof Number | typeof Boolean | typeof Array | typeof Object | null | ConfigType<T>;
 
@@ -101,7 +115,22 @@ declare const ConfigTypeSymbol: unique symbol;
  *
+ * You can use this function with [vscode-ext-gen](https://github.com/antfu/vscode-ext-gen).
+ *
  * @category lifecycle
  */
-export declare function defineConfigs<const C extends ConfigTypeOptions>(section: string, configs: C, scope?: ConfigurationScope | null | undefined): ParseConfigTypeOptions<C>;
+export declare function defineConfigObject<const C extends ConfigTypeOptions>(section: string, configs: C, scope?: Nullable<ConfigurationScope>): ConfigObject<ParseConfigTypeOptions<C>>;
 
+export declare function defineConfigObject<C extends object>(section: string, configs: C, scope?: Nullable<ConfigurationScope>): ConfigObject<C>;
+
 /**
+ * Define configurations of an extension. See `vscode::workspace.getConfiguration`.
+ *
+ * You can use this function with [vscode-ext-gen](https://github.com/antfu/vscode-ext-gen).
+ *
+ * @category lifecycle
+ */
+export declare function defineConfigs<const C extends ConfigTypeOptions>(section: string, configs: C, scope?: Nullable<ConfigurationScope>): ToConfigRefs<ParseConfigTypeOptions<C>>;
+
+export declare function defineConfigs<C extends object>(section: string, configs: C, scope?: Nullable<ConfigurationScope>): ToConfigRefs<C>;
+
+/**
  * Define a new extension.
@@ -111,4 +140,4 @@ *
  */
-export declare function defineExtension(setup: () => void): {
-    activate: (extCtx: ExtensionContext) => void;
+export declare function defineExtension<T>(setup: () => T): {
+    activate: (extCtx: ExtensionContext) => T | undefined;
     deactivate: () => void;
@@ -186,10 +215,12 @@ };
 
-declare type ParseConfigType<C extends ConfigTypeRaw<any>> = C extends string ? (C extends 'string' ? string : C extends 'number' ? number : C extends 'boolean' ? boolean : C extends 'null' ? null : C extends 'integer' ? number : C extends 'array' ? any[] : C extends 'object' ? Record<string | number, any> : never) : C extends (infer C1)[] ? (C1 extends ConfigTypeSingle<any> ? ParseConfigType<C1> : never) : C extends ConfigType<infer T> ? T : (C extends typeof String ? string : C extends typeof Number ? number : C extends typeof Boolean ? boolean : C extends typeof Array ? any[] : C extends typeof Object ? Record<string | number, any> : C extends null ? null : never);
+declare type ParseConfigType<C extends ConfigTypeRaw<any>> = C extends (infer C1)[] ? (C1 extends ConfigTypeSingle<any> ? ParseConfigType<C1> : never) : C extends ConfigType<infer T> ? T : (C extends typeof String ? string : C extends typeof Number ? number : C extends typeof Boolean ? boolean : C extends typeof Array ? any[] : C extends typeof Object ? Record<string | number, any> : C extends null ? null : never);
 
-declare type ParseConfigTypeOptions<C extends ConfigTypeOptions> = {
-    [K in keyof C]: ConfigRef<ParseConfigType<C[K]>>;
-};
+/* Excluded from this release type: ParseConfigTypeOptions */
 
 export declare type TextEditorCommandCallback = (textEditor: TextEditor, edit: TextEditorEdit, ...args: any[]) => void;
 
+declare type ToConfigRefs<C extends object> = {
+    [K in keyof C]: ConfigRef<C[K]>;
+};
+
 export declare interface TreeViewNode {
@@ -196,0 +227,0 @@ readonly children?: this[];

dist/index.js

@@ -1,8 +0,8 @@
-import { getCurrentScope as A, onScopeDispose as N, shallowRef as l, effectScope as H, computed as d, toValue as a, watchEffect as h, watch as b, ref as x, shallowReactive as U, toRaw as q, isRef as J } from "@reactive-vscode/reactivity";
+import { getCurrentScope as N, onScopeDispose as F, shallowRef as l, effectScope as q, computed as d, shallowReactive as L, toValue as a, watchEffect as h, watch as C, ref as x, toRaw as J, isRef as K } from "@reactive-vscode/reactivity";
 export * from "@reactive-vscode/reactivity";
-import { workspace as m, commands as E, window as c, debug as y, extensions as p, comments as K, env as w, EventEmitter as F, tasks as T, Uri as z, languages as Y, ColorThemeKind as R, l10n as V } from "vscode";
-function G(e) {
-  return A() ? (N(e), !0) : !1;
+import { workspace as b, commands as E, window as c, debug as y, extensions as k, comments as z, env as w, EventEmitter as O, tasks as D, Uri as Y, languages as G, ColorThemeKind as V, l10n as A } from "vscode";
+function Q(e) {
+  return N() ? (F(e), !0) : !1;
 }
-function L(e, t) {
+function W(e, t) {
   const n = /* @__PURE__ */ new Map();
@@ -15,3 +15,3 @@ return (...r) => {
       refCount: 1
-    }, n.set(i, o)), G(() => {
+    }, n.set(i, o)), Q(() => {
       --o.refCount === 0 && n.delete(i);
@@ -21,34 +21,35 @@ }), o.data;
 }
-function v(e) {
+function g(e) {
   let t;
   return () => t ?? (t = e());
 }
-const W = [];
-function le(e) {
-  W.push(e);
+const I = [];
+function fe(e) {
+  I.push(e);
 }
-const S = l(null), k = H();
-function de(e) {
+const p = l(null), R = q();
+function ve(e) {
   return {
-    activate: (t) => {
-      S.value = t, k.run(() => {
-        I.map((n) => n(t)), e();
-      });
-    },
+    activate: (t) => (p.value = t, R.run(() => (P.map((n) => n(t)), e()))),
     deactivate: () => {
-      W.map((t) => t()), k.stop();
+      I.map((t) => t()), R.stop();
     }
   };
 }
-const I = [];
-function O(e) {
-  S.value ? e(S.value) : I.push(e);
+const P = [];
+function $(e) {
+  p.value ? e(p.value) : P.push(e);
 }
-function fe(e, t, n) {
-  const r = m.getConfiguration(e, n);
-  function i(u, g) {
-    const f = l(g);
-    return f.update = async (C, j, B) => {
-      await r.update(u, C, j, B), f.value = C;
-    }, f;
+function X(e, t, n) {
+  const r = b.getConfiguration(e, n);
+  function i(u, f) {
+    const v = l(f), m = d({
+      get: () => v.value,
+      set: (T) => {
+        v.value = T, r.update(u, T);
+      }
+    });
+    return m.update = async (T, H, U) => {
+      await r.update(u, T, H, U), m.value = T;
+    }, m;
   }
@@ -58,16 +59,25 @@ const o = Object.fromEntries(
   );
-  return O(() => {
-    s(m.onDidChangeConfiguration((u) => {
+  return $(() => {
+    s(b.onDidChangeConfiguration((u) => {
       if (!u.affectsConfiguration(e))
         return;
-      const g = m.getConfiguration(e);
-      for (const f in t)
-        u.affectsConfiguration(`${e}.${f}`) && (o[f].value = g.get(f));
+      const f = b.getConfiguration(e);
+      for (const v in t)
+        u.affectsConfiguration(`${e}.${v}`) && (o[v].value = f.get(v));
     }));
   }), o;
 }
-function ve(e, t) {
+function ge(e, t, n) {
+  const r = X(e, t, n);
+  return L({
+    ...r,
+    $update(i, o, u, f) {
+      return r[i].update(o, u, f);
+    }
+  });
+}
+function he(e, t) {
   const n = l(null), r = [], i = (o) => (...u) => n.value ? n.value[o](...u) : (r.push([o, u]), null);
-  return O(() => {
-    n.value = ie(e, t);
+  return $(() => {
+    n.value = oe(e, t);
     for (const [o, u] of r)
@@ -92,7 +102,7 @@ n.value[o](...u);
 }
-function ge(e, ...t) {
+function me(e, ...t) {
   return E.executeCommand(e, ...t);
 }
-function Q(e, t = !1) {
-  const n = S.value;
+function Z(e, t = !1) {
+  const n = p.value;
   if (!n && !t)
@@ -102,9 +112,9 @@ throw new Error("Cannot get absolute path because the extension is not activated yet");
 }
-function he(e, t = !1) {
-  return d(() => Q(a(e), t));
+function be(e, t = !1) {
+  return d(() => Z(a(e), t));
 }
 function s(e) {
-  return (A() ?? k).cleanups.push(e.dispose.bind(e)), e;
+  return (N() ?? R).cleanups.push(e.dispose.bind(e)), e;
 }
-const X = v(() => {
+const _ = g(() => {
   const e = l(c.activeColorTheme);
@@ -114,3 +124,3 @@ return s(c.onDidChangeActiveColorTheme((t) => {
   })), e;
-}), me = v(() => {
+}), Ce = g(() => {
   const e = l(y.activeDebugSession);
@@ -120,3 +130,3 @@ return s(y.onDidChangeActiveDebugSession((t) => {
   })), d(() => e.value);
-}), Z = v(() => {
+}), ee = g(() => {
   const e = l(c.activeTextEditor);
@@ -127,3 +137,3 @@ return s(c.onDidChangeActiveTextEditor((t) => {
 });
-function _(e, t, n) {
+function te(e, t, n) {
   const r = "key" in t ? t : c.createTextEditorDecorationType(t);
@@ -135,7 +145,7 @@ h(() => {
 }
-function be(e, t) {
-  const n = Z();
-  _(n, e, t);
+function we(e, t) {
+  const n = ee();
+  te(n, e, t);
 }
-const Ce = v(() => {
+const Te = g(() => {
   const e = l(c.activeNotebookEditor);
@@ -145,3 +155,3 @@ return s(c.onDidChangeActiveNotebookEditor((t) => {
   })), e;
-}), we = v(() => {
+}), De = g(() => {
   const e = l(c.activeTerminal);
@@ -151,22 +161,22 @@ return s(c.onDidChangeActiveTerminal((t) => {
   })), e;
-}), Te = v(() => {
-  const e = l(p.all);
-  return s(p.onDidChange(() => {
-    e.value = p.all;
+}), Se = g(() => {
+  const e = l(k.all);
+  return s(k.onDidChange(() => {
+    e.value = k.all;
   })), d(() => e.value);
 });
-function ee(e, t) {
+function ne(e, t) {
   s(E.registerCommand(e, t));
 }
-function De(e) {
+function pe(e) {
   for (const [t, n] of Object.entries(e))
-    n && ee(t, n);
+    n && ne(t, n);
 }
-function Se(e, t) {
-  return s(K.createCommentController(e, t));
+function xe(e, t) {
+  return s(z.createCommentController(e, t));
 }
-function P(e) {
+function M(e) {
   var n;
   const t = l((n = a(e)) == null ? void 0 : n.state);
-  return b(e, () => {
+  return C(e, () => {
     var r;
@@ -178,3 +188,3 @@ t.value = (r = a(e)) == null ? void 0 : r.state;
 }
-function xe(...e) {
+function Ee(...e) {
   const t = x(null);
@@ -187,4 +197,4 @@ function n() {
   }
-  function i(g) {
-    r().sendText(g);
+  function i(f) {
+    r().sendText(f);
   }
@@ -197,3 +207,3 @@ function o() {
   }
-  return N(u), {
+  return F(u), {
     terminal: t,
@@ -204,6 +214,6 @@ getIsActive: n,
     close: u,
-    state: P(t)
+    state: M(t)
   };
 }
-const Ee = v(() => {
+const ke = g(() => {
   const e = l(w.shell);
@@ -214,3 +224,3 @@ return s(w.onDidChangeShell((t) => {
 });
-function pe(e) {
+function Re(e) {
   var n;
@@ -221,7 +231,7 @@ const t = l((n = a(e)) == null ? void 0 : n.getText());
     t.value = (r = a(e)) == null ? void 0 : r.getText();
-  }), s(m.onDidChangeTextDocument((r) => {
+  }), s(b.onDidChangeTextDocument((r) => {
     r.document === a(e) && (t.value = r.document.getText());
   })), t;
 }
-function D(e, t = []) {
+function S(e, t = []) {
   const n = (r, i, o) => s(e(r, i, o));
@@ -232,4 +242,4 @@ for (const r of t)
 }
-function te(e, t = []) {
-  const n = Array.isArray(e) ? e : t ?? [], r = s(Array.isArray(e) || e == null ? new F() : e), i = D(r.event, n);
+function re(e, t = []) {
+  const n = Array.isArray(e) ? e : t ?? [], r = s(Array.isArray(e) || e == null ? new O() : e), i = S(r.event, n);
   for (const o of n)
@@ -243,7 +253,7 @@ i(o);
 }
-function ke(e) {
-  return d(() => T.fetchTasks(a(e)));
+function ye(e) {
+  return d(() => D.fetchTasks(a(e)));
 }
-function ne(e) {
-  return U({
+function ie(e) {
+  return L({
     get scheme() {
@@ -278,10 +288,10 @@ return a(e).scheme;
 }
-function ye(e) {
-  return ne(() => z.file(a(e)));
+function Ve(e) {
+  return ie(() => Y.file(a(e)));
 }
-function Re(e, t) {
-  const n = new F(), r = l();
+function Ae(e, t) {
+  const n = new O(), r = l();
   h(() => {
     r.value && n.fire(), r.value = a(t);
-  }), s(Y.registerFoldingRangeProvider(
+  }), s(G.registerFoldingRangeProvider(
     e,
@@ -291,4 +301,4 @@ {
       provideFoldingRanges(i, o, u) {
-        var g;
-        return (g = r.value) == null ? void 0 : g.call(r, i, o, u);
+        var f;
+        return (f = r.value) == null ? void 0 : f.call(r, i, o, u);
       }
@@ -298,15 +308,15 @@ }
 }
-function Ve(e, t, n, r) {
-  const i = s(m.createFileSystemWatcher(e, t, n, r));
+function Ne(e, t, n, r) {
+  const i = s(b.createFileSystemWatcher(e, t, n, r));
   return {
     ...i,
-    onDidCreate: D(i.onDidCreate),
-    onDidChange: D(i.onDidChange),
-    onDidDelete: D(i.onDidDelete)
+    onDidCreate: S(i.onDidCreate),
+    onDidChange: S(i.onDidChange),
+    onDidDelete: S(i.onDidDelete)
   };
 }
-const Ae = v(() => {
-  const e = X();
-  return d(() => e.value.kind === R.Dark || e.value.kind === R.HighContrast);
-}), Ne = v(() => {
+const Fe = g(() => {
+  const e = _();
+  return d(() => e.value.kind === V.Dark || e.value.kind === V.HighContrast);
+}), Le = g(() => {
   const e = l(w.isTelemetryEnabled);
@@ -317,6 +327,6 @@ return s(w.onDidChangeTelemetryEnabled((t) => {
 });
-function Fe(e, ...t) {
-  return d(() => typeof t[0] == "object" ? V.t(a(e), q(t[0])) : V.t(a(e), ...t.map(a)));
+function Oe(e, ...t) {
+  return d(() => typeof t[0] == "object" ? A.t(a(e), J(t[0])) : A.t(a(e), ...t.map(a)));
 }
-const Le = v(() => {
+const We = g(() => {
   const e = l(w.logLevel);
@@ -327,11 +337,11 @@ return s(w.onDidChangeLogLevel((t) => {
 });
-function re(e, t) {
+function ae(e, t) {
   return s(c.createOutputChannel(e, t));
 }
-function We(e) {
-  const t = /* @__PURE__ */ new Date(), n = String(t.getFullYear()).padStart(4, "0"), r = String(t.getMonth() + 1).padStart(2, "0"), i = String(t.getDate()).padStart(2, "0"), o = String(t.getHours()).padStart(2, "0"), u = String(t.getMinutes()).padStart(2, "0"), g = String(t.getSeconds()).padStart(2, "0"), f = String(t.getMilliseconds()).padStart(3, "0");
-  return `${n}-${r}-${i} ${o}:${u}:${g}.${f} [${e}] `;
+function Ie(e) {
+  const t = /* @__PURE__ */ new Date(), n = String(t.getFullYear()).padStart(4, "0"), r = String(t.getMonth() + 1).padStart(2, "0"), i = String(t.getDate()).padStart(2, "0"), o = String(t.getHours()).padStart(2, "0"), u = String(t.getMinutes()).padStart(2, "0"), f = String(t.getSeconds()).padStart(2, "0"), v = String(t.getMilliseconds()).padStart(3, "0");
+  return `${n}-${r}-${i} ${o}:${u}:${f}.${v} [${e}] `;
 }
-function ie(e, t = {}) {
-  const n = t.outputChannel ?? re(e), r = (i) => (...o) => {
+function oe(e, t = {}) {
+  const n = t.outputChannel ?? ae(e), r = (i) => (...o) => {
     var u;
@@ -354,6 +364,6 @@ n.appendLine((((u = t.getPrefix) == null ? void 0 : u.call(t, i)) ?? "") + o.join(" "));
 }
-function ae(e) {
+function ue(e) {
   var n;
   const t = l(((n = a(e)) == null ? void 0 : n.selections) ?? []);
-  return b(e, () => {
+  return C(e, () => {
     var r;
@@ -374,4 +384,4 @@ t.value = ((r = a(e)) == null ? void 0 : r.selections) ?? [];
 }
-function Ie(e) {
-  const t = ae(e);
+function Pe(e) {
+  const t = ue(e);
   return d({
@@ -386,6 +396,6 @@ get() {
 }
-function Oe(e) {
+function $e(e) {
   var n;
   const t = l(((n = a(e)) == null ? void 0 : n.visibleRanges) ?? []);
-  return b(e, () => {
+  return C(e, () => {
     var r;
@@ -397,3 +407,3 @@ t.value = ((r = a(e)) == null ? void 0 : r.visibleRanges) ?? [];
 }
-const Pe = v(() => {
+const Me = g(() => {
   const e = l(c.terminals);
@@ -405,3 +415,3 @@ function t() {
 });
-function $e(e) {
+function je(e) {
   const t = s(e.id ? c.createStatusBarItem(e.id, e.alignment, e.priority) : c.createStatusBarItem(e.alignment, e.priority));
@@ -422,10 +432,10 @@ function n(r) {
 }
-const Me = v(() => {
-  const e = l(T.taskExecutions);
+const Be = g(() => {
+  const e = l(D.taskExecutions);
   function t() {
-    e.value = T.taskExecutions;
+    e.value = D.taskExecutions;
   }
-  return s(T.onDidStartTask(t)), s(T.onDidEndTask(t)), d(() => e.value);
+  return s(D.onDidStartTask(t)), s(D.onDidEndTask(t)), d(() => e.value);
 });
-function je(...e) {
+function He(...e) {
   const t = s(c.createTerminal(...e));
@@ -449,16 +459,16 @@ return {
     hide: t.hide.bind(t),
-    state: P(t)
+    state: M(t)
   };
 }
-function oe(e, t) {
+function se(e, t) {
   s(E.registerTextEditorCommand(e, t));
 }
-function Be(e) {
+function Ue(e) {
   for (const [t, n] of Object.entries(e))
-    oe(t, n);
+    se(t, n);
 }
-function ue(e, t) {
+function ce(e, t) {
   var r;
   const n = l(((r = a(e)) == null ? void 0 : r.selections) ?? []);
-  return b(e, () => {
+  return C(e, () => {
     var i;
@@ -480,4 +490,4 @@ n.value = ((i = a(e)) == null ? void 0 : i.selections) ?? [];
 }
-function He(e, t) {
-  const n = ue(e, t);
+function qe(e, t) {
+  const n = ce(e, t);
   return d({
@@ -492,6 +502,6 @@ get() {
 }
-function Ue(e) {
+function Je(e) {
   var n;
   const t = l((n = a(e)) == null ? void 0 : n.viewColumn);
-  return b(e, () => {
+  return C(e, () => {
     var r;
@@ -503,6 +513,6 @@ t.value = (r = a(e)) == null ? void 0 : r.viewColumn;
 }
-function qe(e) {
+function Ke(e) {
   var n;
   const t = l(((n = a(e)) == null ? void 0 : n.visibleRanges) ?? []);
-  return b(e, () => {
+  return C(e, () => {
     var r;
@@ -514,3 +524,3 @@ t.value = ((r = a(e)) == null ? void 0 : r.visibleRanges) ?? [];
 }
-function $(e, t) {
+function j(e, t) {
   h(() => {
@@ -521,3 +531,3 @@ const n = a(e);
 }
-function M(e, t) {
+function B(e, t) {
   h(() => {
@@ -528,6 +538,6 @@ const n = a(e);
 }
-const Je = L(
+const ze = W(
   (e, t, n) => {
-    const r = te();
-    b(t, () => r.fire()), n != null && n.watchSource && b(n.watchSource, () => r.fire());
+    const r = re();
+    C(t, () => r.fire()), n != null && n.watchSource && C(n.watchSource, () => r.fire());
     const i = /* @__PURE__ */ new WeakMap(), o = s(c.createTreeView(e, {
@@ -542,4 +552,4 @@ ...n,
         getChildren(u) {
-          var g;
-          return u ? ((g = u.children) == null || g.forEach((f) => i.set(f, u)), u.children) : a(t);
+          var f;
+          return u ? ((f = u.children) == null || f.forEach((v) => i.set(v, u)), u.children) : a(t);
         },
@@ -551,7 +561,7 @@ getParent(u) {
     }));
-    return n != null && n.title && M(o, n.title), n != null && n.badge && $(o, n.badge), o;
+    return n != null && n.title && B(o, n.title), n != null && n.badge && j(o, n.badge), o;
   },
   (e) => e
 );
-function Ke(e) {
+function Ye(e) {
   var r;
@@ -571,3 +581,3 @@ const t = x((r = a(e)) == null ? void 0 : r.visible);
 }
-const ze = v(() => {
+const Ge = g(() => {
   const e = l(c.visibleNotebookEditors);
@@ -577,3 +587,3 @@ return s(c.onDidChangeVisibleNotebookEditors((t) => {
   })), e;
-}), Ye = v(() => {
+}), Qe = g(() => {
   const e = l(c.visibleTextEditors);
@@ -584,4 +594,4 @@ return s(c.onDidChangeVisibleTextEditors((t) => {
 });
-function Ge(e, t, n = !0) {
-  const r = J(t) ? t : typeof t == "function" ? d(t) : x(t);
+function Xe(e, t, n = !0) {
+  const r = K(t) ? t : typeof t == "function" ? d(t) : x(t);
   return h(() => {
@@ -591,3 +601,3 @@ a(n) && E.executeCommand("setContext", e, r.value);
 }
-const Qe = L(
+const Ze = W(
   (e, t, n) => {
@@ -598,4 +608,4 @@ const r = l(), i = l();
       {
-        resolveWebviewView(f, C) {
-          r.value = f, i.value = C, n != null && n.onDidReceiveMessage && f.webview.onDidReceiveMessage(n.onDidReceiveMessage);
+        resolveWebviewView(v, m) {
+          r.value = v, i.value = m, n != null && n.onDidReceiveMessage && v.webview.onDidReceiveMessage(n.onDidReceiveMessage);
         }
@@ -616,16 +626,16 @@ },
     }), n != null && n.webviewOptions) {
-      const f = n.webviewOptions;
+      const v = n.webviewOptions;
       h(() => {
-        r.value && (r.value.webview.options = a(f));
+        r.value && (r.value.webview.options = a(v));
       });
     }
-    n != null && n.title && M(r, n.title), n != null && n.badge && $(r, n.badge);
-    function g(f) {
-      var C;
-      return (C = r.value) == null ? void 0 : C.webview.postMessage(f);
+    n != null && n.title && B(r, n.title), n != null && n.badge && j(r, n.badge);
+    function f(v) {
+      var m;
+      return (m = r.value) == null ? void 0 : m.webview.postMessage(v);
     }
-    return { view: r, context: i, postMessage: g, forceRefresh: u };
+    return { view: r, context: i, postMessage: f, forceRefresh: u };
   },
   (e) => e
-), Xe = v(() => {
+), _e = g(() => {
   const e = l(c.state);
@@ -638,76 +648,77 @@ return s(c.onDidChangeWindowState((t) => {
   };
-}), Ze = v(() => {
-  const e = l(m.workspaceFolders);
-  return s(m.onDidChangeWorkspaceFolders(() => {
-    e.value = m.workspaceFolders;
+}), et = g(() => {
+  const e = l(b.workspaceFolders);
+  return s(b.onDidChangeWorkspaceFolders(() => {
+    e.value = b.workspaceFolders;
   })), d(() => e.value);
 });
 export {
-  I as activateCbs,
-  L as createKeyedComposable,
-  v as createSingletonComposable,
-  W as deactivateCbs,
-  fe as defineConfigs,
-  de as defineExtension,
-  ve as defineLogger,
-  ge as executeCommand,
-  S as extensionContext,
-  k as extensionScope,
-  We as getDefaultLoggerPrefix,
-  O as onActivate,
-  le as onDeactivate,
-  G as tryOnScopeDispose,
-  he as useAbsolutePath,
-  X as useActiveColorTheme,
-  me as useActiveDebugSession,
-  be as useActiveEditorDecorations,
-  Ce as useActiveNotebookEditor,
-  we as useActiveTerminal,
-  Z as useActiveTextEditor,
-  Te as useAllExtensions,
-  ee as useCommand,
-  De as useCommands,
-  Se as useCommentController,
-  xe as useControlledTerminal,
-  Ee as useDefaultShell,
+  P as activateCbs,
+  W as createKeyedComposable,
+  g as createSingletonComposable,
+  I as deactivateCbs,
+  ge as defineConfigObject,
+  X as defineConfigs,
+  ve as defineExtension,
+  he as defineLogger,
+  me as executeCommand,
+  p as extensionContext,
+  R as extensionScope,
+  Ie as getDefaultLoggerPrefix,
+  $ as onActivate,
+  fe as onDeactivate,
+  Q as tryOnScopeDispose,
+  be as useAbsolutePath,
+  _ as useActiveColorTheme,
+  Ce as useActiveDebugSession,
+  we as useActiveEditorDecorations,
+  Te as useActiveNotebookEditor,
+  De as useActiveTerminal,
+  ee as useActiveTextEditor,
+  Se as useAllExtensions,
+  ne as useCommand,
+  pe as useCommands,
+  xe as useCommentController,
+  Ee as useControlledTerminal,
+  ke as useDefaultShell,
   s as useDisposable,
-  pe as useDocumentText,
-  _ as useEditorDecorations,
-  D as useEvent,
-  te as useEventEmitter,
-  ke as useFetchTasks,
-  ye as useFileUri,
-  Re as useFoldingRangeProvider,
-  Ve as useFsWatcher,
-  Ae as useIsDarkTheme,
-  Ne as useIsTelemetryEnabled,
-  Fe as useL10nText,
-  Le as useLogLevel,
-  ie as useLogger,
-  Ie as useNotebookEditorSelection,
-  ae as useNotebookEditorSelections,
-  Oe as useNotebookEditorVisibleRanges,
-  Pe as useOpenedTerminals,
-  re as useOutputChannel,
-  $e as useStatusBarItem,
-  Me as useTaskExecutions,
-  je as useTerminal,
-  P as useTerminalState,
-  oe as useTextEditorCommand,
-  Be as useTextEditorCommands,
-  He as useTextEditorSelection,
-  ue as useTextEditorSelections,
-  Ue as useTextEditorViewColumn,
-  qe as useTextEditorVisibleRanges,
-  Je as useTreeView,
-  ne as useUri,
-  $ as useViewBadge,
-  M as useViewTitle,
-  Ke as useViewVisibility,
-  ze as useVisibleNotebookEditors,
-  Ye as useVisibleTextEditors,
-  Ge as useVscodeContext,
-  Qe as useWebviewView,
-  Xe as useWindowState,
-  Ze as useWorkspaceFolders
+  Re as useDocumentText,
+  te as useEditorDecorations,
+  S as useEvent,
+  re as useEventEmitter,
+  ye as useFetchTasks,
+  Ve as useFileUri,
+  Ae as useFoldingRangeProvider,
+  Ne as useFsWatcher,
+  Fe as useIsDarkTheme,
+  Le as useIsTelemetryEnabled,
+  Oe as useL10nText,
+  We as useLogLevel,
+  oe as useLogger,
+  Pe as useNotebookEditorSelection,
+  ue as useNotebookEditorSelections,
+  $e as useNotebookEditorVisibleRanges,
+  Me as useOpenedTerminals,
+  ae as useOutputChannel,
+  je as useStatusBarItem,
+  Be as useTaskExecutions,
+  He as useTerminal,
+  M as useTerminalState,
+  se as useTextEditorCommand,
+  Ue as useTextEditorCommands,
+  qe as useTextEditorSelection,
+  ce as useTextEditorSelections,
+  Je as useTextEditorViewColumn,
+  Ke as useTextEditorVisibleRanges,
+  ze as useTreeView,
+  ie as useUri,
+  j as useViewBadge,
+  B as useViewTitle,
+  Ye as useViewVisibility,
+  Ge as useVisibleNotebookEditors,
+  Qe as useVisibleTextEditors,
+  Xe as useVscodeContext,
+  Ze as useWebviewView,
+  _e as useWindowState,
+  et as useWorkspaceFolders
 };

package.json

 {
   "name": "reactive-vscode",
   "type": "module",
-  "version": "0.2.0-beta.3",
+  "version": "0.2.0-beta.4",
   "description": "Develop VSCode extension with Vue Reactivity API",
@@ -40,3 +40,3 @@ "author": "_Kerman <[e-mail]>",
   "dependencies": {
-    "@reactive-vscode/reactivity": "0.2.0-beta.3"
+    "@reactive-vscode/reactivity": "0.2.0-beta.4"
   },
@@ -43,0 +43,0 @@ "devDependencies": {

README.md

@@ -8,6 +8,67 @@ # reactive-vscode
 ![Header](./docs/public/header.png)
+
 **Develop VSCode extension with Vue Reactivity API**
 
-[**Documentation**](https://kermanx.github.io/reactive-vscode/) | [**Why reactive-vscode**](https://kermanx.github.io/reactive-vscode/guide/why) | [**Functions**](https://kermanx.github.io/reactive-vscode/functions/) | [**Examples**](https://kermanx.github.io/reactive-vscode/examples/)
+- [**Documentation**](https://kermanx.github.io/reactive-vscode/)
+- [**Why reactive-vscode**](https://kermanx.github.io/reactive-vscode/guide/why)
+- [**All Functions**](https://kermanx.github.io/reactive-vscode/functions/)
 
+### Counter Example
+
+```ts
+import { defineExtension, ref, useCommands, useStatusBarItem } from 'reactive-vscode'
+import { StatusBarAlignment } from 'vscode'
+
+export = defineExtension(() => {
+  const counter = ref(0)
+
+  useStatusBarItem({
+    alignment: StatusBarAlignment.Right,
+    priority: 100,
+    text: () => `$(megaphone) Hello*${counter.value}`,
+  })
+
+  useCommands({
+    'extension.sayHello': () => counter.value++,
+    'extension.sayGoodbye': () => counter.value--,
+  })
+})
+```
+
+<details>
+<summary> Implementation with original VSCode API </summary>
+
+```ts
+import type { ExtensionContext } from 'vscode'
+import { StatusBarAlignment, commands, window } from 'vscode'
+
+export function activate(extensionContext: ExtensionContext) {
+  let counter = 0
+
+  const item = window.createStatusBarItem(StatusBarAlignment.Right, 100)
+
+  function updateStatusBar() {
+    item.text = `$(megaphone) Hello*${counter}`
+    item.show()
+  }
+
+  updateStatusBar()
+
+  extensionContext.subscriptions.push(
+    commands.registerCommand('extension.sayHello', () => {
+      counter++
+      updateStatusBar()
+    }),
+    commands.registerCommand('extension.sayGoodbye', () => {
+      counter--
+      updateStatusBar()
+    }),
+  )
+}
+```
+
+</details>
+
+[More examples](https://kermanx.github.io/reactive-vscode/examples/).
+
 ## License
@@ -14,0 +75,0 @@

No alert changes

Improved metrics

Total package byte prevSize

47524

increased by5.93%

Lines of code

1261

increased by2.94%

Number of lines in readme file

95

increased by179.41%

Dependency changes

• + Added@reactive-vscode/reactivity@0.2.0-beta.4(transitive)

• - Removed@reactive-vscode/reactivity@0.2.0-beta.3(transitive)

• Updated@reactive-vscode/reactivity@0.2.0-beta.4