@yak-io/vue 0.2.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,8 +1,9 @@
1
- import { type Ref, type DeepReadonly } from "vue";
2
- import { type TriggerButtonConfig, type ChatConfigProvider, type ToolCallHandler, type ToolCallEvent, type GraphQLSchemaHandler, type RESTSchemaHandler, type Theme } from "@yak-io/javascript";
1
+ import { type ChatConfigProvider, type GraphQLSchemaHandler, type RESTSchemaHandler, type Theme, type ToolCallEvent, type ToolCallHandler, type TriggerButtonConfig, type VoiceMachine, type WidgetMode } from "@yak-io/javascript";
2
+ import { type DeepReadonly, type Ref } from "vue";
3
3
  export type ToolCallEventHandler = (event: ToolCallEvent) => void;
4
4
  export type YakProviderOptions = {
5
5
  appId: string;
6
+ mode?: WidgetMode;
6
7
  getConfig?: ChatConfigProvider;
7
8
  onToolCall?: ToolCallHandler;
8
9
  onGraphQLSchemaCall?: GraphQLSchemaHandler;
@@ -19,30 +20,27 @@ export type YakApi = {
19
20
  close: () => void;
20
21
  openWithPrompt: (prompt: string) => void;
21
22
  subscribeToToolEvents: (handler: ToolCallEventHandler) => () => void;
23
+ voiceMachine: DeepReadonly<Ref<VoiceMachine>>;
24
+ voiceStart: () => Promise<void>;
25
+ voiceStop: () => Promise<void>;
26
+ voiceToggle: () => Promise<void>;
22
27
  };
23
28
  /**
24
- * Sets up the yak chat widget and provides it to descendant components.
29
+ * Sets up the yak widget (chat + voice) and provides it to descendants.
25
30
  * Call this once in a root/layout component.
26
31
  *
27
32
  * @example
28
33
  * ```ts
29
- * // App.vue <script setup>
30
- * import { createYakProvider } from "@yak-io/vue";
31
- *
32
34
  * createYakProvider({
33
35
  * appId: "my-app",
34
- * trigger: { label: "Ask with AI" },
36
+ * mode: "both",
37
+ * getConfig: async () => ({ routes: { routes: [], generated_at: "" } }),
35
38
  * });
36
39
  * ```
37
40
  */
38
41
  export declare function createYakProvider(options: YakProviderOptions): YakApi;
39
42
  /**
40
- * Access the yak chat widget API.
41
- *
42
- * @example
43
- * ```ts
44
- * const { open, isOpen, openWithPrompt } = useYak();
45
- * ```
43
+ * Access the yak widget API (chat + voice).
46
44
  *
47
45
  * @throws {Error} if used outside a component tree with createYakProvider
48
46
  */
@@ -50,15 +48,6 @@ export declare function useYak(): YakApi;
50
48
  /**
51
49
  * Subscribe to tool call completion events.
52
50
  * Automatically cleans up on component unmount.
53
- *
54
- * @example
55
- * ```ts
56
- * useYakToolEvent((event) => {
57
- * if (event.ok && event.name.startsWith("task.")) {
58
- * refreshTasks();
59
- * }
60
- * });
61
- * ```
62
51
  */
63
52
  export declare function useYakToolEvent(handler: ToolCallEventHandler): void;
64
53
  //# sourceMappingURL=composables.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"composables.d.ts","sourceRoot":"","sources":["../src/composables.ts"],"names":[],"mappings":"AAAA,OAAO,EAQL,KAAK,GAAG,EACR,KAAK,YAAY,EAClB,MAAM,KAAK,CAAC;AACb,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,eAAe,EACpB,KAAK,aAAa,EAClB,KAAK,oBAAoB,EACzB,KAAK,iBAAiB,EACtB,KAAK,KAAK,EACX,MAAM,oBAAoB,CAAC;AAK5B,MAAM,MAAM,oBAAoB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;AAElE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,mBAAmB,CAAC,EAAE,oBAAoB,CAAC;IAC3C,gBAAgB,CAAC,EAAE,iBAAiB,CAAC;IACrC,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG;IACnB,MAAM,EAAE,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC;IACnC,OAAO,EAAE,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC;IACpC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,qBAAqB,EAAE,CAAC,OAAO,EAAE,oBAAoB,KAAK,MAAM,IAAI,CAAC;CACtE,CAAC;AAQF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,kBAAkB,GAAG,MAAM,CA6FrE;AAID;;;;;;;;;GASG;AACH,wBAAgB,MAAM,IAAI,MAAM,CAM/B;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAUnE"}
1
+ {"version":3,"file":"composables.d.ts","sourceRoot":"","sources":["../src/composables.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,kBAAkB,EACvB,KAAK,oBAAoB,EAGzB,KAAK,iBAAiB,EACtB,KAAK,KAAK,EACV,KAAK,aAAa,EAClB,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,YAAY,EACjB,KAAK,UAAU,EAEhB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,KAAK,YAAY,EAMjB,KAAK,GAAG,EAGT,MAAM,KAAK,CAAC;AAIb,MAAM,MAAM,oBAAoB,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;AAElE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,mBAAmB,CAAC,EAAE,oBAAoB,CAAC;IAC3C,gBAAgB,CAAC,EAAE,iBAAiB,CAAC;IACrC,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG;IAEnB,MAAM,EAAE,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC;IACnC,OAAO,EAAE,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC;IACpC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,qBAAqB,EAAE,CAAC,OAAO,EAAE,oBAAoB,KAAK,MAAM,IAAI,CAAC;IAErE,YAAY,EAAE,YAAY,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC,CAAC;IAC9C,UAAU,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,WAAW,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAClC,CAAC;AAQF;;;;;;;;;;;;GAYG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,kBAAkB,GAAG,MAAM,CA6GrE;AAID;;;;GAIG;AACH,wBAAgB,MAAM,IAAI,MAAM,CAM/B;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAUnE"}
@@ -1,27 +1,25 @@
1
- import { ref, readonly, onMounted, onUnmounted, inject, provide, } from "vue";
2
- import { YakEmbed, } from "@yak-io/javascript";
3
- import { logger } from "@yak-io/javascript";
1
+ import { INITIAL_VOICE_MACHINE, logger, YakEmbed, } from "@yak-io/javascript";
2
+ import { inject, onMounted, onUnmounted, provide, readonly, ref, } from "vue";
4
3
  // ── Injection key ───────────────────────────────────────────────────────────
5
4
  const YAK_KEY = Symbol("yak");
6
5
  // ── Provider composable ─────────────────────────────────────────────────────
7
6
  /**
8
- * Sets up the yak chat widget and provides it to descendant components.
7
+ * Sets up the yak widget (chat + voice) and provides it to descendants.
9
8
  * Call this once in a root/layout component.
10
9
  *
11
10
  * @example
12
11
  * ```ts
13
- * // App.vue <script setup>
14
- * import { createYakProvider } from "@yak-io/vue";
15
- *
16
12
  * createYakProvider({
17
13
  * appId: "my-app",
18
- * trigger: { label: "Ask with AI" },
14
+ * mode: "both",
15
+ * getConfig: async () => ({ routes: { routes: [], generated_at: "" } }),
19
16
  * });
20
17
  * ```
21
18
  */
22
19
  export function createYakProvider(options) {
23
20
  const isOpen = ref(false);
24
21
  const isReady = ref(false);
22
+ const voiceMachine = ref(INITIAL_VOICE_MACHINE);
25
23
  const toolEventSubscribers = new Set();
26
24
  const handleToolCallComplete = (event) => {
27
25
  logger.debug("Tool call completed, notifying subscribers:", {
@@ -42,8 +40,10 @@ export function createYakProvider(options) {
42
40
  (typeof window !== "undefined" ? (path) => window.location.assign(path) : undefined);
43
41
  const embed = new YakEmbed({
44
42
  appId: options.appId,
43
+ mode: options.mode,
45
44
  theme: options.theme,
46
45
  trigger: options.trigger ?? false,
46
+ getConfig: options.getConfig,
47
47
  onToolCall: options.onToolCall,
48
48
  onGraphQLSchemaCall: options.onGraphQLSchemaCall,
49
49
  onRESTSchemaCall: options.onRESTSchemaCall,
@@ -51,12 +51,13 @@ export function createYakProvider(options) {
51
51
  options: { disableRestartButton: options.disableRestartButton },
52
52
  onToolCallComplete: handleToolCallComplete,
53
53
  });
54
- // Subscribe to state changes
55
54
  embed.onStateChange((state) => {
56
55
  isOpen.value = state.isOpen;
57
56
  isReady.value = state.isReady;
58
57
  });
59
- // Mount/unmount with component lifecycle
58
+ embed.onVoiceStateChange((m) => {
59
+ voiceMachine.value = m;
60
+ });
60
61
  onMounted(() => {
61
62
  embed.mount();
62
63
  });
@@ -83,6 +84,14 @@ export function createYakProvider(options) {
83
84
  }
84
85
  });
85
86
  }
87
+ const voiceStart = async () => {
88
+ try {
89
+ await embed.voiceStart();
90
+ }
91
+ catch (err) {
92
+ logger.warn("Voice start failed", err);
93
+ }
94
+ };
86
95
  const api = {
87
96
  isOpen: readonly(isOpen),
88
97
  isReady: readonly(isReady),
@@ -95,18 +104,17 @@ export function createYakProvider(options) {
95
104
  toolEventSubscribers.delete(handler);
96
105
  };
97
106
  },
107
+ voiceMachine: readonly(voiceMachine),
108
+ voiceStart,
109
+ voiceStop: () => embed.voiceStop(),
110
+ voiceToggle: () => embed.voiceToggle(),
98
111
  };
99
112
  provide(YAK_KEY, api);
100
113
  return api;
101
114
  }
102
115
  // ── Consumer composables ────────────────────────────────────────────────────
103
116
  /**
104
- * Access the yak chat widget API.
105
- *
106
- * @example
107
- * ```ts
108
- * const { open, isOpen, openWithPrompt } = useYak();
109
- * ```
117
+ * Access the yak widget API (chat + voice).
110
118
  *
111
119
  * @throws {Error} if used outside a component tree with createYakProvider
112
120
  */
@@ -120,15 +128,6 @@ export function useYak() {
120
128
  /**
121
129
  * Subscribe to tool call completion events.
122
130
  * Automatically cleans up on component unmount.
123
- *
124
- * @example
125
- * ```ts
126
- * useYakToolEvent((event) => {
127
- * if (event.ok && event.name.startsWith("task.")) {
128
- * refreshTasks();
129
- * }
130
- * });
131
- * ```
132
131
  */
133
132
  export function useYakToolEvent(handler) {
134
133
  const api = inject(YAK_KEY);
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- export { useYak, useYakToolEvent, createYakProvider } from "./composables.js";
2
- export type { YakProviderOptions, YakApi, ToolCallEventHandler } from "./composables.js";
3
- export { enableYakLogging, disableYakLogging, isYakLoggingEnabled } from "@yak-io/javascript";
4
- export type { GraphQLSchemaHandler, RESTSchemaHandler, GraphQLRequest, RESTRequest, ToolCallHandler, ToolCallEvent, SchemaSource, GraphQLSchemaSource, OpenAPISchemaSource, Theme, ThemeColors, TriggerButtonConfig, WidgetPosition, ChatConfigProvider, } from "@yak-io/javascript";
1
+ export type { ChatConfigProvider, GraphQLRequest, GraphQLSchemaHandler, GraphQLSchemaSource, OpenAPISchemaSource, RESTRequest, RESTSchemaHandler, SchemaSource, Theme, ThemeColors, ToolCallEvent, ToolCallHandler, TriggerButtonConfig, VoiceMachine, VoiceState, WidgetMode, WidgetPosition, } from "@yak-io/javascript";
2
+ export { disableYakLogging, enableYakLogging, isYakLoggingEnabled } from "@yak-io/javascript";
3
+ export type { ToolCallEventHandler, YakApi, YakProviderOptions } from "./composables.js";
4
+ export { createYakProvider, useYak, useYakToolEvent } from "./composables.js";
5
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAC9E,YAAY,EAAE,kBAAkB,EAAE,MAAM,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAGzF,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAG9F,YAAY,EACV,oBAAoB,EACpB,iBAAiB,EACjB,cAAc,EACd,WAAW,EACX,eAAe,EACf,aAAa,EACb,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACnB,KAAK,EACL,WAAW,EACX,mBAAmB,EACnB,cAAc,EACd,kBAAkB,GACnB,MAAM,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,YAAY,EACV,kBAAkB,EAClB,cAAc,EACd,oBAAoB,EACpB,mBAAmB,EACnB,mBAAmB,EACnB,WAAW,EACX,iBAAiB,EACjB,YAAY,EACZ,KAAK,EACL,WAAW,EACX,aAAa,EACb,eAAe,EACf,mBAAmB,EACnB,YAAY,EACZ,UAAU,EACV,UAAU,EACV,cAAc,GACf,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAC9F,YAAY,EAAE,oBAAoB,EAAE,MAAM,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACzF,OAAO,EAAE,iBAAiB,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC"}
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
1
  // Public API
2
- export { useYak, useYakToolEvent, createYakProvider } from "./composables.js";
3
2
  // Re-export logging utilities
4
- export { enableYakLogging, disableYakLogging, isYakLoggingEnabled } from "@yak-io/javascript";
3
+ export { disableYakLogging, enableYakLogging, isYakLoggingEnabled } from "@yak-io/javascript";
4
+ export { createYakProvider, useYak, useYakToolEvent } from "./composables.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yak-io/vue",
3
- "version": "0.2.0",
3
+ "version": "0.3.0",
4
4
  "description": "Vue SDK for embedding yak chatbot",
5
5
  "type": "module",
6
6
  "license": "SEE LICENSE IN LICENSE",
@@ -41,15 +41,15 @@
41
41
  "./package.json": "./package.json"
42
42
  },
43
43
  "dependencies": {
44
- "@yak-io/javascript": "0.7.0"
44
+ "@yak-io/javascript": "0.8.0"
45
45
  },
46
46
  "peerDependencies": {
47
47
  "vue": "^3.3.0"
48
48
  },
49
49
  "devDependencies": {
50
- "@types/node": "^24.12.0",
50
+ "@types/node": "^24.12.4",
51
51
  "typescript": "^5.3.0",
52
- "vue": "^3.5.16",
52
+ "vue": "^3.5.34",
53
53
  "@repo/typescript-config": "0.0.0"
54
54
  },
55
55
  "scripts": {