@inkly/vue

Official Vue 3 composables for inkly. The package wraps one @inkly/client instance and exposes refs for status, actions, events, and streams.

Install

pnpm add @inkly/vue @inkly/client @inkly/protocol vue

Quickstart

import { createVueClient } from "@inkly/vue";
import { chat } from "./shared/contract";

export const inkly = createVueClient(chat, { url: "wss://api.example.com/ws" });

<script setup lang="ts">
import { inkly } from "./inkly";

const status = inkly.useStatus();
const send = inkly.useAction("sendMessage");
inkly.useEvent("message", (message) => console.log(message));
</script>

API

• createVueClient(contract, options) creates a client and typed composables.
• createInklyVue(client) wraps an existing client.
• provideInkly(client) / useInkly() support Vue provide/inject when preferred.
• useStatus() returns a Ref<ClientStatus>.
• useAction(name) returns refs plus { call, mutate }.
• useEvent(name, handler) subscribes and returns the unsubscribe function.
• useStream(name, input) returns { items, status, error, cancel } refs.

Cleanup guarantee

Composables register teardown with onScopeDispose when called inside an active Vue scope. Stopping the scope or unmounting a component removes event/status listeners and cancels streams.