@alfakit/vue 0.0.0-stage → 0.1.0

package/dist/components/actions/ActionModals.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionModals.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_Fragment","_renderList","_unref","_createBlock","ActionModal","ActionModal_default","ActionModals_vue_vue_type_script_setup_true_lang_default","runner","useActionRunner","state","useStore","notifications","showToast","n","onScopeDispose","openBlock","createElementBlock","Fragment","renderList","unref","createBlock","actionPath","modal","isModalHiddenByChild","index"],"sources":["../../../src/components/actions/ActionModals.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { actionPath, isModalHiddenByChild } from '@alfakit/core'\nimport { onScopeDispose } from 'vue'\nimport { useStore } from '../../composables/use-store'\nimport { useActionRunner } from '../../context'\nimport { showToast } from '../notifications/flash-toasts'\nimport ActionModal from './ActionModal.vue'\n\n/** Renders every open action modal from the runner store. Mount once per app. */\nconst runner = useActionRunner()\nconst state = useStore(runner.store)\n\n// Notifications from JSON responses (a modal `mountUsing()` cancelled, field actions).\nrunner.setNotificationHandler((notifications) => notifications.forEach((n) => showToast(n)))\nonScopeDispose(() => runner.setNotificationHandler(undefined))\n</script>\n\n<template>\n  <ActionModal\n    v-for=\"(modal, index) in state.modals\"\n    :key=\"`${actionPath(modal.action, modal.context)}-${modal.context.record ?? ''}`\"\n    :modal=\"modal\"\n    :hidden=\"isModalHiddenByChild(state.modals, index)\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;EASA,IAAMS,IAASC,EAAgB,GACzBC,IAAQC,EAASH,EAAO,KAAK;SAGnCA,EAAO,wBAAwB,MAAkBI,EAAc,SAAS,MAAMC,EAAUC,CAAC,CAAC,CAAC,GAC3FC,QAAqBP,EAAO,uBAAuB,KAAA,CAAS,CAAC,cAI3DT,EAAA,EAAA,GAAAC,EAKEC,GAAA,MAAAC,EAJyBC,EAAAO,CAAA,CAAK,CAAC,SAAvB,GAAO,OADjBX,EAAA,GAAAK,EAKEC,GAAA;GAHC,KAAG,GAAKF,EAAAmB,CAAA,CAAU,CAACC,EAAM,QAAQA,EAAM,OAAO,EAAA,GAAKA,EAAM,QAAQ,UAAM;GAChE;GACP,QAAQpB,EAAAqB,CAAA,CAAoB,CAACrB,EAAAO,CAAA,CAAK,CAAC,QAAQe,CAAK"}

package/dist/components/actions/action-context.d.ts

@@ -0,0 +1,7 @@
+import type { ActionContext } from '@alfakit/core';
+import { type InjectionKey } from 'vue';
+export declare const PAGE_ACTION_KEY: InjectionKey<ActionContext>;
+/** Provides the page-level action context (token + `page` component) to nested components. */
+export declare function providePageActionContext(value: ActionContext): void;
+export declare function usePageActionContext(): ActionContext;
+//# sourceMappingURL=action-context.d.ts.map

package/dist/components/actions/action-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-context.d.ts","sourceRoot":"","sources":["../../../src/components/actions/action-context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAmB,KAAK,YAAY,EAAE,MAAM,KAAK,CAAA;AAGxD,eAAO,MAAM,eAAe,EAAE,YAAY,CAAC,aAAa,CAAiC,CAAA;AAEzF,8FAA8F;AAC9F,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI,CAEnE;AAED,wBAAgB,oBAAoB,IAAI,aAAa,CAKpD"}

package/dist/components/actions/action-context.js

@@ -0,0 +1,18 @@
+import { usePageSchema as e } from "../../context.js";
+import { inject as t, provide as n } from "vue";
+//#region src/components/actions/action-context.ts
+var r = Symbol("alfakit.page-action");
+function i(e) {
+	n(r, e);
+}
+function a() {
+	let n = t(r, null), i = e();
+	return n ?? {
+		token: i.value?.token ?? "",
+		component: "page"
+	};
+}
+//#endregion
+export { r as PAGE_ACTION_KEY, i as providePageActionContext, a as usePageActionContext };
+
+//# sourceMappingURL=action-context.js.map

package/dist/components/actions/action-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-context.js","names":["PAGE_ACTION_KEY","providePageActionContext","value","usePageActionContext","context","inject","page","usePageSchema"],"sources":["../../../src/components/actions/action-context.ts"],"sourcesContent":["import type { ActionContext } from '@alfakit/core'\nimport { inject, provide, type InjectionKey } from 'vue'\nimport { usePageSchema } from '../../context'\n\nexport const PAGE_ACTION_KEY: InjectionKey<ActionContext> = Symbol('alfakit.page-action')\n\n/** Provides the page-level action context (token + `page` component) to nested components. */\nexport function providePageActionContext(value: ActionContext): void {\n  provide(PAGE_ACTION_KEY, value)\n}\n\nexport function usePageActionContext(): ActionContext {\n  const context = inject(PAGE_ACTION_KEY, null)\n  const page = usePageSchema()\n\n  return context ?? { token: page.value?.token ?? '', component: 'page' }\n}\n"],"mappings":";;;AAIA,IAAaA,IAA+C,OAAO,qBAAqB;AAGxF,SAAgBC,EAAyB,GAA4B;CACnE,EAAQD,GAAiBE,CAAK;AAChC;AAEA,SAAgBC,IAAsC;CACpD,IAAMC,IAAUC,EAAOL,GAAiB,IAAI,GACtCM,IAAOC,EAAc;CAE3B,OAAOH,KAAW;EAAE,OAAOE,EAAK,OAAO,SAAS;EAAI,WAAW;CAAO;AACxE"}

package/dist/components/actions/index.d.ts

@@ -0,0 +1,6 @@
+export { providePageActionContext, usePageActionContext } from './action-context';
+export { default as ActionButton } from './ActionButton.vue';
+export { default as ActionGroupMenu } from './ActionGroupMenu.vue';
+export { default as ActionList } from './ActionList.vue';
+export { default as ActionModals } from './ActionModals.vue';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/actions/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/actions/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAA;AACjF,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAC5D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAA;AAClE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,oBAAoB,CAAA"}

package/dist/components/ai/AiCopilot.js

@@ -0,0 +1,7 @@
+import e from "./AiCopilot.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/ai/AiCopilot.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=AiCopilot.js.map

package/dist/components/ai/AiCopilot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiCopilot.js","names":["_sfc_main","AiCopilot_vue_vue_type_script_setup_true_lang_default","AiCopilot_default"],"sources":["../../../src/components/ai/AiCopilot.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { type AiCopilotSchema, CopilotController, shortcuts } from '@alfakit/core'\nimport { SparklesIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, ref, shallowRef, watch } from 'vue'\nimport { useT } from '../../context'\nimport Button from '../ui/Button.vue'\nimport { CopilotPanel, preloadCopilotPanel } from './copilot-lazy'\n\n/**\n * The copilot of alfasix/alfakit-ai (`ai:copilot`): a topbar button (and `mod+j`) opening\n * a chat slide-over. Questions, tools and actions run on the server; proposed actions\n * run only when the user confirms them in the chat.\n */\nconst props = defineProps<{ component: AiCopilotSchema }>()\nconst t = useT()\n// One controller per panel: Inertia visits pass new props objects.\nconst controller = new CopilotController(props.component)\nconst state = shallowRef(controller.state)\nconst mounted = ref(false)\nconst label = computed(() => t('ai.open', {}, 'Open AI copilot'))\n\nconst unsubscribe = controller.subscribe((next) => {\n  state.value = next\n\n  if (next.open) mounted.value = true\n})\n\nlet unregister: (() => void) | undefined\n\nwatch(\n  () => [JSON.stringify(props.component.keyBindings ?? []), label.value] as const,\n  ([keys, text]) => {\n    unregister?.()\n    unregister = undefined\n\n    const bindings = JSON.parse(keys) as string[]\n\n    if (bindings.length === 0) return\n\n    unregister = shortcuts.register({\n      id: 'ai.copilot',\n      keys: bindings,\n      label: text,\n      group: 'general',\n      allowInInputs: true,\n      handler: () => controller.toggle(),\n    })\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unsubscribe()\n  unregister?.()\n})\n</script>\n\n<template>\n  <div v-if=\"props.component.canUse !== false\" data-slot=\"ai-copilot\" class=\"contents\">\n    <Button\n      type=\"button\"\n      variant=\"ghost\"\n      size=\"icon\"\n      data-slot=\"ai-copilot-trigger\"\n      :aria-label=\"label\"\n      :aria-expanded=\"state.open\"\n      aria-haspopup=\"dialog\"\n      :title=\"label\"\n      @click=\"controller.open()\"\n      @pointerenter=\"preloadCopilotPanel()\"\n      @focus=\"preloadCopilotPanel()\"\n    >\n      <SparklesIcon aria-hidden=\"true\" />\n    </Button>\n    <CopilotPanel v-if=\"mounted\" :controller=\"controller\" />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/ai/AiCopilot.vue.d.ts

@@ -0,0 +1,12 @@
+import { type AiCopilotSchema } from '@alfakit/core';
+/**
+ * The copilot of alfasix/alfakit-ai (`ai:copilot`): a topbar button (and `mod+j`) opening
+ * a chat slide-over. Questions, tools and actions run on the server; proposed actions
+ * run only when the user confirms them in the chat.
+ */
+type __VLS_Props = {
+    component: AiCopilotSchema;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=AiCopilot.vue.d.ts.map

package/dist/components/ai/AiCopilot.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiCopilot.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ai/AiCopilot.vue"],"names":[],"mappings":"AA+EA,OAAO,EAAE,KAAK,eAAe,EAAgC,MAAM,eAAe,CAAA;AAOlF;;;;GAIG;AACH,KAAK,WAAW,GAAG;IAAE,SAAS,EAAE,eAAe,CAAA;CAAE,CAAC;;AA0JlD,wBAMG"}

package/dist/components/ai/AiCopilot.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,60 @@
+import { useT as e } from "../../context.js";
+import t from "../ui/Button2.js";
+import { CopilotPanel as n, preloadCopilotPanel as r } from "./copilot-lazy.js";
+import { CopilotController as i, shortcuts as a } from "@alfakit/core";
+import { computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createVNode as u, defineComponent as d, onBeforeUnmount as f, openBlock as p, ref as m, shallowRef as h, unref as g, watch as _, withCtx as v } from "vue";
+import { SparklesIcon as y } from "@lucide/vue";
+//#region src/components/ai/AiCopilot.vue?vue&type=script&setup=true&lang.ts
+var b = {
+	key: 0,
+	"data-slot": "ai-copilot",
+	class: "contents"
+}, x = /*@__PURE__*/ d({
+	__name: "AiCopilot",
+	props: { component: {} },
+	setup(d) {
+		let x = d, S = e(), C = new i(x.component), w = h(C.state), T = m(!1), E = o(() => S("ai.open", {}, "Open AI copilot")), D = C.subscribe((e) => {
+			w.value = e, e.open && (T.value = !0);
+		}), O;
+		return _(() => [JSON.stringify(x.component.keyBindings ?? []), E.value], ([e, t]) => {
+			O?.(), O = void 0;
+			let n = JSON.parse(e);
+			n.length !== 0 && (O = a.register({
+				id: "ai.copilot",
+				keys: n,
+				label: t,
+				group: "general",
+				allowInInputs: !0,
+				handler: () => C.toggle()
+			}));
+		}, { immediate: !0 }), f(() => {
+			D(), O?.();
+		}), (e, i) => x.component.canUse === !1 ? c("", !0) : (p(), l("div", b, [u(t, {
+			type: "button",
+			variant: "ghost",
+			size: "icon",
+			"data-slot": "ai-copilot-trigger",
+			"aria-label": E.value,
+			"aria-expanded": w.value.open,
+			"aria-haspopup": "dialog",
+			title: E.value,
+			onClick: i[0] ||= (e) => g(C).open(),
+			onPointerenter: i[1] ||= (e) => g(r)(),
+			onFocus: i[2] ||= (e) => g(r)()
+		}, {
+			default: v(() => [u(g(y), { "aria-hidden": "true" })]),
+			_: 1
+		}, 8, [
+			"aria-label",
+			"aria-expanded",
+			"title"
+		]), T.value ? (p(), s(g(n), {
+			key: 0,
+			controller: g(C)
+		}, null, 8, ["controller"])) : c("", !0)]));
+	}
+});
+//#endregion
+export { x as default };
+
+//# sourceMappingURL=AiCopilot.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/ai/AiCopilot.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiCopilot.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createVNode","Button","_unref","_withCtx","_createBlock","_createCommentVNode","Button_default","_hoisted_1","AiCopilot_vue_vue_type_script_setup_true_lang_default","props","__props","t","useT","controller","CopilotController","state","shallowRef","mounted","ref","label","computed","unsubscribe","next","unregister","watch","keys","text","bindings","shortcuts","onBeforeUnmount","createCommentVNode","openBlock","createElementBlock","createVNode","_cache","unref","preloadCopilotPanel","withCtx","SparklesIcon","createBlock","CopilotPanel"],"sources":["../../../src/components/ai/AiCopilot.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { type AiCopilotSchema, CopilotController, shortcuts } from '@alfakit/core'\nimport { SparklesIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, ref, shallowRef, watch } from 'vue'\nimport { useT } from '../../context'\nimport Button from '../ui/Button.vue'\nimport { CopilotPanel, preloadCopilotPanel } from './copilot-lazy'\n\n/**\n * The copilot of alfasix/alfakit-ai (`ai:copilot`): a topbar button (and `mod+j`) opening\n * a chat slide-over. Questions, tools and actions run on the server; proposed actions\n * run only when the user confirms them in the chat.\n */\nconst props = defineProps<{ component: AiCopilotSchema }>()\nconst t = useT()\n// One controller per panel: Inertia visits pass new props objects.\nconst controller = new CopilotController(props.component)\nconst state = shallowRef(controller.state)\nconst mounted = ref(false)\nconst label = computed(() => t('ai.open', {}, 'Open AI copilot'))\n\nconst unsubscribe = controller.subscribe((next) => {\n  state.value = next\n\n  if (next.open) mounted.value = true\n})\n\nlet unregister: (() => void) | undefined\n\nwatch(\n  () => [JSON.stringify(props.component.keyBindings ?? []), label.value] as const,\n  ([keys, text]) => {\n    unregister?.()\n    unregister = undefined\n\n    const bindings = JSON.parse(keys) as string[]\n\n    if (bindings.length === 0) return\n\n    unregister = shortcuts.register({\n      id: 'ai.copilot',\n      keys: bindings,\n      label: text,\n      group: 'general',\n      allowInInputs: true,\n      handler: () => controller.toggle(),\n    })\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unsubscribe()\n  unregister?.()\n})\n</script>\n\n<template>\n  <div v-if=\"props.component.canUse !== false\" data-slot=\"ai-copilot\" class=\"contents\">\n    <Button\n      type=\"button\"\n      variant=\"ghost\"\n      size=\"icon\"\n      data-slot=\"ai-copilot-trigger\"\n      :aria-label=\"label\"\n      :aria-expanded=\"state.open\"\n      aria-haspopup=\"dialog\"\n      :title=\"label\"\n      @click=\"controller.open()\"\n      @pointerenter=\"preloadCopilotPanel()\"\n      @focus=\"preloadCopilotPanel()\"\n    >\n      <SparklesIcon aria-hidden=\"true\" />\n    </Button>\n    <CopilotPanel v-if=\"mounted\" :controller=\"controller\" />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAaA,IAAMW,IAAQC,GACRC,IAAIC,EAAK,GAETC,IAAa,IAAIC,EAAkBL,EAAM,SAAS,GAClDM,IAAQC,EAAWH,EAAW,KAAK,GACnCI,IAAUC,EAAI,EAAK,GACnBC,IAAQC,QAAeT,EAAE,WAAW,CAAC,GAAG,iBAAiB,CAAC,GAE1DU,IAAcR,EAAW,WAAW,MAAS;GAGjD,AAFA,EAAM,QAAQS,GAEVA,EAAK,SAAM,EAAQ,QAAQ;EACjC,CAAC,GAEGC;SAEJC,QACQ,CAAC,KAAK,UAAUf,EAAM,UAAU,eAAe,CAAC,CAAC,GAAGU,EAAM,KAAK,IACpE,CAACM,GAAMC,OAAU;GAEhB,AADAH,IAAa,GACb,IAAa,KAAA;GAEb,IAAMI,IAAW,KAAK,MAAMF,CAAI;GAEhC,AAAIE,EAAS,WAAW,MAExB,IAAaC,EAAU,SAAS;IAC9B,IAAI;IACJ,MAAMD;IACN,OAAOD;IACP,OAAO;IACP,eAAe;IACf,eAAeb,EAAW,OAAO;GACnC,CAAC;EACH,GACA,EAAE,WAAW,GAAK,CACpB,GAEAgB,QAAsB;GAEpB,AADAR,EAAY,GACZE,IAAa;EACf,CAAC,aAIYd,EAAM,UAAU,WAAM,kBAAjCX,EAAA,GAAAC,EAiBM,OAjBNQ,GAiBM,CAhBJP,EAcSC,GAAA;GAbP,MAAK;GACL,SAAQ;GACR,MAAK;GACL,aAAU;GACT,cAAYkB,EAAA;GACZ,iBAAeJ,EAAA,MAAM;GACtB,iBAAc;GACb,OAAOI,EAAA;GACP,SAAK,AAAAe,EAAA,QAAA,MAAEhC,EAAAW,CAAA,CAAU,CAAC,KAAI;GACtB,gBAAY,AAAAqB,EAAA,QAAA,MAAEhC,EAAAkC,CAAA,CAAmB,CAAA;GACjC,SAAK,AAAAF,EAAA,QAAA,MAAEhC,EAAAkC,CAAA,CAAmB,CAAA;;GAE3B,SAAAjC,QAAmC,CAAnCH,EAAmCE,EAAAoC,CAAA,GAAA,EAArB,eAAY,OAAM,CAAA,CAAA,CAAA;;;;;;EAEd,CAAA,GAAArB,EAAA,SAApBnB,EAAA,GAAAM,EAAwDF,EAAAsC,CAAA,GAAA;;GAA1B,YAAYtC,EAAAW,CAAA"}

package/dist/components/ai/AiStream.js

@@ -0,0 +1,7 @@
+import e from "./AiStream.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/ai/AiStream.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=AiStream.js.map

package/dist/components/ai/AiStream.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiStream.js","names":["_sfc_main","AiStream_vue_vue_type_script_setup_true_lang_default","AiStream_default"],"sources":["../../../src/components/ai/AiStream.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { AiStreamController, type AiStreamSchema } from '@alfakit/core'\nimport { LoaderCircleIcon, SquareIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\nimport { useT } from '../../context'\nimport { useFormStore } from '../form/form-context'\nimport Button from '../ui/Button.vue'\n\n/**\n * `ai:stream` (alfasix/alfakit-ai `streaming()`): streams an answer into a modal form. The\n * text shows as it is written (plain text) with a \"Stop\" button; a polite live region\n * announces it in batches. When it is done the finished answer (cleaned up by the server)\n * goes into the target field and the form refreshes, so the server renders it.\n */\nconst props = defineProps<{ component: AiStreamSchema }>()\nconst t = useT()\nconst form = useFormStore()\n\nconst values = shallowRef(form.state.values)\nconst unsubscribeForm = form.subscribe((state) => (values.value = state.values))\nconst token = computed(() => {\n  void values.value\n\n  return form.getValue<string | null>(props.component.statePath, null)\n})\n\nconst settle = (next: Record<string, unknown>) => {\n  form.setValue(props.component.statePath, null, { silent: true })\n\n  for (const [path, value] of Object.entries(next)) {\n    form.setValue(path, value, { silent: true })\n  }\n\n  void form.refresh(props.component.target)\n}\n\nconst controller = new AiStreamController({\n  endpoint: props.component.endpoint,\n  onDone: (text) => settle({ [props.component.target]: text, [props.component.errorPath]: null }),\n  onError: (message) =>\n    settle({\n      [props.component.errorPath]:\n        message || t('ai.stream.failed', {}, 'The answer could not be written. Try again.'),\n    }),\n  onCancel: () => settle({ [props.component.errorPath]: t('ai.stream.stopped', {}, 'Stopped.') }),\n})\n\nconst state = shallowRef(controller.state)\nconst unsubscribe = controller.store.subscribe((next) => (state.value = next))\n\nwatch(\n  token,\n  (value) => {\n    if (typeof value === 'string' && value !== '') void controller.start(value)\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unsubscribe()\n  unsubscribeForm()\n  controller.dispose()\n})\n\nconst streaming = computed(() => state.value.status === 'streaming')\n</script>\n\n<template>\n  <div\n    v-if=\"streaming || token\"\n    data-slot=\"ai-stream\"\n    class=\"bg-muted/40 flex flex-col gap-3 rounded-md border p-3\"\n    :aria-busy=\"streaming\"\n  >\n    <div class=\"flex items-center justify-between gap-3\">\n      <span class=\"text-muted-foreground flex items-center gap-2 text-sm\">\n        <LoaderCircleIcon class=\"size-4 animate-spin\" aria-hidden=\"true\" />\n        {{ t('ai.stream.writing', {}, 'Writing…') }}\n      </span>\n      <Button\n        type=\"button\"\n        variant=\"outline\"\n        size=\"sm\"\n        data-slot=\"ai-stream-stop\"\n        :aria-label=\"t('ai.stream.stop_label', {}, 'Stop writing the answer')\"\n        @click=\"controller.cancel()\"\n      >\n        <SquareIcon aria-hidden=\"true\" class=\"size-3.5\" />\n        {{ t('ai.stream.stop', {}, 'Stop') }}\n      </Button>\n    </div>\n    <div\n      v-if=\"state.text !== ''\"\n      data-slot=\"ai-stream-text\"\n      class=\"text-start text-sm leading-relaxed break-words whitespace-pre-wrap\"\n    >\n      {{ state.text }}\n    </div>\n    <div class=\"sr-only\" aria-live=\"polite\" aria-atomic=\"true\">{{ state.announcement }}</div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/ai/AiStream.vue.d.ts

@@ -0,0 +1,13 @@
+import { type AiStreamSchema } from '@alfakit/core';
+/**
+ * `ai:stream` (alfasix/alfakit-ai `streaming()`): streams an answer into a modal form. The
+ * text shows as it is written (plain text) with a "Stop" button; a polite live region
+ * announces it in batches. When it is done the finished answer (cleaned up by the server)
+ * goes into the target field and the form refreshes, so the server renders it.
+ */
+type __VLS_Props = {
+    component: AiStreamSchema;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=AiStream.vue.d.ts.map

package/dist/components/ai/AiStream.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiStream.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ai/AiStream.vue"],"names":[],"mappings":"AAuGA,OAAO,EAAsB,KAAK,cAAc,EAAE,MAAM,eAAe,CAAA;AAOvE;;;;;GAKG;AACH,KAAK,WAAW,GAAG;IAAE,SAAS,EAAE,cAAc,CAAA;CAAE,CAAC;;AA+LjD,wBAMG"}

package/dist/components/ai/AiStream.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,70 @@
+import { useT as e } from "../../context.js";
+import t from "../ui/Button2.js";
+import { useFormStore as n } from "../form/form-context.js";
+import { AiStreamController as r } from "@alfakit/core";
+import { computed as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, onBeforeUnmount as d, openBlock as f, shallowRef as p, toDisplayString as m, unref as h, watch as g, withCtx as _ } from "vue";
+import { LoaderCircleIcon as v, SquareIcon as y } from "@lucide/vue";
+//#region src/components/ai/AiStream.vue?vue&type=script&setup=true&lang.ts
+var b = ["aria-busy"], x = { class: "flex items-center justify-between gap-3" }, S = { class: "text-muted-foreground flex items-center gap-2 text-sm" }, C = {
+	key: 0,
+	"data-slot": "ai-stream-text",
+	class: "text-start text-sm leading-relaxed break-words whitespace-pre-wrap"
+}, w = {
+	class: "sr-only",
+	"aria-live": "polite",
+	"aria-atomic": "true"
+}, T = /*@__PURE__*/ u({
+	__name: "AiStream",
+	props: { component: {} },
+	setup(u) {
+		let T = u, E = e(), D = n(), O = p(D.state.values), k = D.subscribe((e) => O.value = e.values), A = i(() => (O.value, D.getValue(T.component.statePath, null))), j = (e) => {
+			D.setValue(T.component.statePath, null, { silent: !0 });
+			for (let [t, n] of Object.entries(e)) D.setValue(t, n, { silent: !0 });
+			D.refresh(T.component.target);
+		}, M = new r({
+			endpoint: T.component.endpoint,
+			onDone: (e) => j({
+				[T.component.target]: e,
+				[T.component.errorPath]: null
+			}),
+			onError: (e) => j({ [T.component.errorPath]: e || E("ai.stream.failed", {}, "The answer could not be written. Try again.") }),
+			onCancel: () => j({ [T.component.errorPath]: E("ai.stream.stopped", {}, "Stopped.") })
+		}), N = p(M.state), P = M.store.subscribe((e) => N.value = e);
+		g(A, (e) => {
+			typeof e == "string" && e !== "" && M.start(e);
+		}, { immediate: !0 }), d(() => {
+			P(), k(), M.dispose();
+		});
+		let F = i(() => N.value.status === "streaming");
+		return (e, n) => F.value || A.value ? (f(), o("div", {
+			key: 0,
+			"data-slot": "ai-stream",
+			class: "bg-muted/40 flex flex-col gap-3 rounded-md border p-3",
+			"aria-busy": F.value
+		}, [
+			s("div", x, [s("span", S, [l(h(v), {
+				class: "size-4 animate-spin",
+				"aria-hidden": "true"
+			}), c(" " + m(h(E)("ai.stream.writing", {}, "Writing…")), 1)]), l(t, {
+				type: "button",
+				variant: "outline",
+				size: "sm",
+				"data-slot": "ai-stream-stop",
+				"aria-label": h(E)("ai.stream.stop_label", {}, "Stop writing the answer"),
+				onClick: n[0] ||= (e) => h(M).cancel()
+			}, {
+				default: _(() => [l(h(y), {
+					"aria-hidden": "true",
+					class: "size-3.5"
+				}), c(" " + m(h(E)("ai.stream.stop", {}, "Stop")), 1)]),
+				_: 1
+			}, 8, ["aria-label"])]),
+			N.value.text === "" ? a("", !0) : (f(), o("div", C, m(N.value.text), 1)),
+			s("div", w, m(N.value.announcement), 1)
+		], 8, b)) : a("", !0);
+	}
+});
+//#endregion
+export { T as default };
+
+//# sourceMappingURL=AiStream.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/ai/AiStream.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AiStream.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createElementVNode","_createVNode","_unref","_createTextVNode","_toDisplayString","Button","_withCtx","_createCommentVNode","Button_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","AiStream_vue_vue_type_script_setup_true_lang_default","props","__props","t","useT","form","useFormStore","values","shallowRef","unsubscribeForm","state","token","computed","settle","path","value","next","controller","AiStreamController","text","message","unsubscribe","watch","onBeforeUnmount","streaming","openBlock","createElementBlock","createElementVNode","createVNode","unref","LoaderCircleIcon","createTextVNode","toDisplayString","_cache","withCtx","SquareIcon","createCommentVNode"],"sources":["../../../src/components/ai/AiStream.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { AiStreamController, type AiStreamSchema } from '@alfakit/core'\nimport { LoaderCircleIcon, SquareIcon } from '@lucide/vue'\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\nimport { useT } from '../../context'\nimport { useFormStore } from '../form/form-context'\nimport Button from '../ui/Button.vue'\n\n/**\n * `ai:stream` (alfasix/alfakit-ai `streaming()`): streams an answer into a modal form. The\n * text shows as it is written (plain text) with a \"Stop\" button; a polite live region\n * announces it in batches. When it is done the finished answer (cleaned up by the server)\n * goes into the target field and the form refreshes, so the server renders it.\n */\nconst props = defineProps<{ component: AiStreamSchema }>()\nconst t = useT()\nconst form = useFormStore()\n\nconst values = shallowRef(form.state.values)\nconst unsubscribeForm = form.subscribe((state) => (values.value = state.values))\nconst token = computed(() => {\n  void values.value\n\n  return form.getValue<string | null>(props.component.statePath, null)\n})\n\nconst settle = (next: Record<string, unknown>) => {\n  form.setValue(props.component.statePath, null, { silent: true })\n\n  for (const [path, value] of Object.entries(next)) {\n    form.setValue(path, value, { silent: true })\n  }\n\n  void form.refresh(props.component.target)\n}\n\nconst controller = new AiStreamController({\n  endpoint: props.component.endpoint,\n  onDone: (text) => settle({ [props.component.target]: text, [props.component.errorPath]: null }),\n  onError: (message) =>\n    settle({\n      [props.component.errorPath]:\n        message || t('ai.stream.failed', {}, 'The answer could not be written. Try again.'),\n    }),\n  onCancel: () => settle({ [props.component.errorPath]: t('ai.stream.stopped', {}, 'Stopped.') }),\n})\n\nconst state = shallowRef(controller.state)\nconst unsubscribe = controller.store.subscribe((next) => (state.value = next))\n\nwatch(\n  token,\n  (value) => {\n    if (typeof value === 'string' && value !== '') void controller.start(value)\n  },\n  { immediate: true },\n)\n\nonBeforeUnmount(() => {\n  unsubscribe()\n  unsubscribeForm()\n  controller.dispose()\n})\n\nconst streaming = computed(() => state.value.status === 'streaming')\n</script>\n\n<template>\n  <div\n    v-if=\"streaming || token\"\n    data-slot=\"ai-stream\"\n    class=\"bg-muted/40 flex flex-col gap-3 rounded-md border p-3\"\n    :aria-busy=\"streaming\"\n  >\n    <div class=\"flex items-center justify-between gap-3\">\n      <span class=\"text-muted-foreground flex items-center gap-2 text-sm\">\n        <LoaderCircleIcon class=\"size-4 animate-spin\" aria-hidden=\"true\" />\n        {{ t('ai.stream.writing', {}, 'Writing…') }}\n      </span>\n      <Button\n        type=\"button\"\n        variant=\"outline\"\n        size=\"sm\"\n        data-slot=\"ai-stream-stop\"\n        :aria-label=\"t('ai.stream.stop_label', {}, 'Stop writing the answer')\"\n        @click=\"controller.cancel()\"\n      >\n        <SquareIcon aria-hidden=\"true\" class=\"size-3.5\" />\n        {{ t('ai.stream.stop', {}, 'Stop') }}\n      </Button>\n    </div>\n    <div\n      v-if=\"state.text !== ''\"\n      data-slot=\"ai-stream-text\"\n      class=\"text-start text-sm leading-relaxed break-words whitespace-pre-wrap\"\n    >\n      {{ state.text }}\n    </div>\n    <div class=\"sr-only\" aria-live=\"polite\" aria-atomic=\"true\">{{ state.announcement }}</div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAcA,IAAMiB,IAAQC,GACRC,IAAIC,EAAK,GACTC,IAAOC,EAAa,GAEpBC,IAASC,EAAWH,EAAK,MAAM,MAAM,GACrCI,IAAkBJ,EAAK,WAAW,MAAW,EAAO,QAAQK,EAAM,MAAO,GACzEC,IAAQC,SACZL,EAAY,OAELF,EAAK,SAAwBJ,EAAM,UAAU,WAAW,IAAI,EACpE,GAEKY,KAAU,MAAkC;GAChD,EAAK,SAASZ,EAAM,UAAU,WAAW,MAAM,EAAE,QAAQ,GAAK,CAAC;GAE/D,KAAK,IAAM,CAACa,GAAMC,MAAU,OAAO,QAAQC,CAAI,GAC7C,EAAK,SAASF,GAAMC,GAAO,EAAE,QAAQ,GAAK,CAAC;GAG7C,EAAU,QAAQd,EAAM,UAAU,MAAM;EAC1C,GAEMgB,IAAa,IAAIC,EAAmB;GACxC,UAAUjB,EAAM,UAAU;GAC1B,SAAS,MAASY,EAAO;KAAGZ,EAAM,UAAU,SAASkB;KAAOlB,EAAM,UAAU,YAAY;GAAK,CAAC;GAC9F,UAAU,MACRY,EAAO,GACJZ,EAAM,UAAU,YACfmB,KAAWjB,EAAE,oBAAoB,CAAC,GAAG,6CAA6C,EACtF,CAAC;GACH,gBAAgBU,EAAO,GAAGZ,EAAM,UAAU,YAAYE,EAAE,qBAAqB,CAAC,GAAG,UAAU,EAAE,CAAC;EAChG,CAAC,GAEKO,IAAQF,EAAWS,EAAW,KAAK,GACnCI,IAAcJ,EAAW,MAAM,WAAW,MAAU,EAAM,QAAQD,CAAK;EAU7E,AARAM,EACEX,IACC,MAAU;GACT,AAAI,OAAOI,KAAU,YAAYA,MAAU,MAAIE,EAAgB,MAAMF,CAAK;EAC5E,GACA,EAAE,WAAW,GAAK,CACpB,GAEAQ,QAAsB;GAGpB,AAFAF,EAAY,GACZZ,EAAgB,GAChBQ,EAAW,QAAQ;EACrB,CAAC;EAED,IAAMO,IAAYZ,QAAeF,EAAM,MAAM,WAAW,WAAW;mBAKzDc,EAAA,SAAab,EAAA,SADrB3B,EAAA,GAAAC,EA+BM,OAAA;;GA7BJ,aAAU;GACV,OAAM;GACL,aAAWuC,EAAA;;GAEZtC,EAgBM,OAhBNU,GAgBM,CAfJV,EAGO,QAHPW,GAGO,CAFLV,EAAmEC,EAAA0C,CAAA,GAAA;IAAjD,OAAM;IAAsB,eAAY;GAASzC,CAAAA,GAAAA,EAAA,MACnEC,EAAGF,EAAAe,CAAA,CAAC,CAAA,qBAAA,CAAA,GAAA,UAAA,CAAA,GAAA,CAAA,CAAA,CAAA,GAENhB,EAUSI,GAAA;IATP,MAAK;IACL,SAAQ;IACR,MAAK;IACL,aAAU;IACT,cAAYH,EAAAe,CAAA,CAAC,CAAA,wBAAA,CAAA,GAAA,yBAAA;IACb,SAAK,AAAA8B,EAAA,QAAA,MAAE7C,EAAA6B,CAAA,CAAU,CAAC,OAAM;;IAEzB,SAAAzB,QAAkD,CAAlDL,EAAkDC,EAAA+C,CAAA,GAAA;KAAtC,eAAY;KAAO,OAAM;IAAa9C,CAAAA,GAAAA,EAAA,MAClDC,EAAGF,EAAAe,CAAA,CAAC,CAAA,kBAAA,CAAA,GAAA,MAAA,CAAA,GAAA,CAAA,CAAA,CAAA;;;GAIAO,EAAA,MAAM,SAAI,KAIH0B,EAAA,IAAA,EAAA,KALfpD,EAAA,GAAAC,EAMM,OANNa,GAMMR,EADDoB,EAAA,MAAM,IAAI,GAAA,CAAA;GAEfxB,EAAyF,OAAzFa,GAAyFT,EAA3BoB,EAAA,MAAM,YAAY,GAAA,CAAA"}

package/dist/components/ai/CopilotPanel.js

@@ -0,0 +1,7 @@
+import e from "./CopilotPanel.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/ai/CopilotPanel.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=CopilotPanel.js.map

package/dist/components/ai/CopilotPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopilotPanel.js","names":["_sfc_main","CopilotPanel_vue_vue_type_script_setup_true_lang_default","CopilotPanel_default"],"sources":["../../../src/components/ai/CopilotPanel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { type AiMessageSchema, type CopilotController, copilotBlocks } from '@alfakit/core'\nimport { router } from '@inertiajs/vue3'\nimport {\n  ArrowUpIcon,\n  CircleAlertIcon,\n  ExternalLinkIcon,\n  HistoryIcon,\n  InfoIcon,\n  MessageSquarePlusIcon,\n  SparklesIcon,\n  SquareIcon,\n  Trash2Icon,\n  TriangleAlertIcon,\n} from '@lucide/vue'\nimport { computed, nextTick, onBeforeUnmount, ref, shallowRef, watch } from 'vue'\nimport { useDirection, useFormatter, useT } from '../../context'\nimport Badge from '../ui/Badge.vue'\nimport Button from '../ui/Button.vue'\nimport Sheet from '../ui/Sheet.vue'\nimport SheetContent from '../ui/SheetContent.vue'\nimport SheetDescription from '../ui/SheetDescription.vue'\nimport SheetHeader from '../ui/SheetHeader.vue'\nimport SheetTitle from '../ui/SheetTitle.vue'\nimport Spinner from '../ui/Spinner.vue'\nimport Textarea from '../ui/Textarea.vue'\n\nconst props = defineProps<{ controller: CopilotController }>()\nconst t = useT()\nconst direction = useDirection()\nconst format = useFormatter()\nconst state = shallowRef(props.controller.state)\nconst end = ref<HTMLElement | null>(null)\nconst currency = props.controller.schema.currency\nconst notice = props.controller.schema.notice\n\nconst unsubscribe = props.controller.subscribe((next) => (state.value = next))\nonBeforeUnmount(unsubscribe)\n\nconst totals = computed(() => props.controller.totals(state.value.messages))\nconst title = computed(() =>\n  state.value.view === 'history'\n    ? t('ai.history', {}, 'Conversations')\n    : state.value.conversation?.title || t('ai.title', {}, 'Copilot'),\n)\n\nwatch(\n  () => [state.value.messages.length, state.value.sending, state.value.streaming?.text],\n  () => nextTick(() => end.value?.scrollIntoView?.({ block: 'end' })),\n)\n\nfunction tokens(count: number): string {\n  return t('ai.tokens', { count: format.value.number(count) }, ':count tokens')\n}\n\nfunction cost(value: number): string {\n  return t(\n    'ai.cost',\n    { cost: format.value.money(value, currency, { maximumFractionDigits: 4 }) },\n    '≈ :cost',\n  )\n}\n\nfunction usage(message: AiMessageSchema): string | null {\n  if (!message.usage) return null\n\n  const parts = [tokens(message.usage.inputTokens + message.usage.outputTokens)]\n\n  if (message.usage.cost !== undefined && currency) parts.push(cost(message.usage.cost))\n\n  return parts.join(' · ')\n}\n\nfunction onKeydown(event: KeyboardEvent): void {\n  if (event.key === 'Enter' && !event.shiftKey && !event.isComposing) {\n    event.preventDefault()\n    void props.controller.send()\n  }\n}\n\nfunction statusLabel(status: string): string {\n  if (status === 'confirmed') return t('ai.confirmed', {}, 'Done')\n  if (status === 'failed') return t('ai.failed', {}, 'Failed')\n\n  return t('ai.rejected', {}, 'Cancelled')\n}\n</script>\n\n<template>\n  <Sheet :open=\"state.open\" @update:open=\"(open: boolean) => controller.setOpen(open)\">\n    <SheetContent\n      :side=\"direction === 'rtl' ? 'left' : 'right'\"\n      data-slot=\"ai-copilot-panel\"\n      class=\"flex w-full flex-col gap-0 p-0 sm:max-w-md\"\n    >\n      <SheetHeader class=\"border-b pe-12\">\n        <div class=\"flex items-center gap-2\">\n          <SparklesIcon class=\"text-primary size-4\" aria-hidden=\"true\" />\n          <SheetTitle class=\"flex-1 truncate\">{{ title }}</SheetTitle>\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"icon-sm\"\n            :aria-label=\"\n              state.view === 'history'\n                ? t('ai.back', {}, 'Back to the conversation')\n                : t('ai.history', {}, 'Conversations')\n            \"\n            :aria-pressed=\"state.view === 'history'\"\n            @click=\"state.view === 'history' ? controller.showChat() : controller.showHistory()\"\n          >\n            <HistoryIcon aria-hidden=\"true\" />\n          </Button>\n          <Button\n            type=\"button\"\n            variant=\"ghost\"\n            size=\"icon-sm\"\n            :aria-label=\"t('ai.new', {}, 'New conversation')\"\n            @click=\"controller.newConversation()\"\n          >\n            <MessageSquarePlusIcon aria-hidden=\"true\" />\n          </Button>\n        </div>\n        <SheetDescription class=\"text-xs\" data-slot=\"ai-disclaimer\">\n          {{ t('ai.disclaimer', {}, 'AI can make mistakes. Check important information.') }}\n        </SheetDescription>\n      </SheetHeader>\n\n      <div\n        v-if=\"notice\"\n        role=\"status\"\n        data-slot=\"ai-notice\"\n        :data-status=\"notice.status\"\n        class=\"bg-muted/50 flex items-start gap-2 border-b px-4 py-3 text-sm\"\n      >\n        <TriangleAlertIcon\n          v-if=\"notice.status === 'warning'\"\n          class=\"text-destructive mt-0.5 size-4 shrink-0\"\n          aria-hidden=\"true\"\n        />\n        <InfoIcon v-else class=\"text-primary mt-0.5 size-4 shrink-0\" aria-hidden=\"true\" />\n        <div class=\"flex min-w-0 flex-col gap-0.5\">\n          <p class=\"font-medium\">{{ notice.heading }}</p>\n          <p v-if=\"notice.description\" class=\"text-muted-foreground break-words\">\n            {{ notice.description }}\n          </p>\n        </div>\n      </div>\n\n      <div\n        v-if=\"state.view === 'history'\"\n        class=\"flex-1 overflow-y-auto p-2\"\n        data-slot=\"ai-history\"\n      >\n        <div v-if=\"state.loading\" class=\"flex justify-center p-6\">\n          <Spinner />\n          <span class=\"sr-only\">{{ t('ai.loading', {}, 'Loading') }}</span>\n        </div>\n        <p\n          v-else-if=\"state.conversations.length === 0\"\n          class=\"text-muted-foreground p-6 text-center text-sm\"\n        >\n          {{ t('ai.no_conversations', {}, 'No conversations yet.') }}\n        </p>\n        <ul v-else class=\"flex flex-col gap-1\">\n          <li\n            v-for=\"conversation in state.conversations\"\n            :key=\"conversation.id\"\n            class=\"group flex items-center gap-1\"\n          >\n            <button\n              type=\"button\"\n              class=\"hover:bg-accent focus-visible:ring-ring flex min-w-0 flex-1 flex-col items-start rounded-md px-3 py-2 text-start outline-none focus-visible:ring-2\"\n              @click=\"controller.openConversation(conversation.id)\"\n            >\n              <span class=\"w-full truncate text-sm font-medium\">{{\n                conversation.title || t('ai.title', {}, 'Copilot')\n              }}</span>\n              <span v-if=\"conversation.updatedAt\" class=\"text-muted-foreground text-xs\">{{\n                format.relative(conversation.updatedAt)\n              }}</span>\n            </button>\n            <Button\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"icon-sm\"\n              :aria-label=\"t('ai.delete', {}, 'Delete conversation')\"\n              @click=\"controller.deleteConversation(conversation.id)\"\n            >\n              <Trash2Icon aria-hidden=\"true\" />\n            </Button>\n          </li>\n        </ul>\n      </div>\n\n      <div\n        v-else\n        class=\"flex-1 overflow-y-auto px-4 py-4\"\n        role=\"log\"\n        aria-live=\"polite\"\n        :aria-label=\"t('ai.messages', {}, 'Messages')\"\n        data-slot=\"ai-messages\"\n      >\n        <div v-if=\"state.loading\" class=\"flex justify-center p-6\">\n          <Spinner />\n          <span class=\"sr-only\">{{ t('ai.loading', {}, 'Loading') }}</span>\n        </div>\n        <div\n          v-if=\"!state.loading && state.messages.length === 0\"\n          class=\"flex flex-col items-center gap-2 px-6 py-12 text-center\"\n          data-slot=\"ai-empty\"\n        >\n          <SparklesIcon class=\"text-primary size-8\" aria-hidden=\"true\" />\n          <p class=\"font-medium\">{{ t('ai.empty_title', {}, 'How can I help?') }}</p>\n          <p class=\"text-muted-foreground text-sm\">\n            {{\n              t(\n                'ai.empty_description',\n                {},\n                'Ask me to find or explain records, open pages or run actions. I always ask before changing anything.',\n              )\n            }}\n          </p>\n        </div>\n        <div class=\"flex flex-col gap-4\">\n          <template v-for=\"message in state.messages\" :key=\"message.id\">\n            <div\n              v-if=\"message.role === 'user'\"\n              data-slot=\"ai-message\"\n              data-role=\"user\"\n              class=\"flex justify-end\"\n            >\n              <p\n                class=\"bg-primary text-primary-foreground max-w-[85%] rounded-2xl rounded-ee-sm px-3 py-2 text-sm whitespace-pre-wrap\"\n              >\n                <span class=\"sr-only\">{{ t('ai.you', {}, 'You') }}: </span>{{ message.content }}\n              </p>\n            </div>\n\n            <p\n              v-else-if=\"message.role === 'error'\"\n              data-slot=\"ai-message\"\n              data-role=\"error\"\n              role=\"alert\"\n              class=\"text-destructive flex items-start gap-2 text-sm\"\n            >\n              <CircleAlertIcon class=\"mt-0.5 size-4 shrink-0\" aria-hidden=\"true\" />\n              {{ message.content }}\n            </p>\n\n            <div\n              v-else-if=\"message.role === 'navigation'\"\n              data-slot=\"ai-message\"\n              data-role=\"navigation\"\n            >\n              <Button\n                type=\"button\"\n                variant=\"outline\"\n                size=\"sm\"\n                @click=\"message.url && router.visit(message.url)\"\n              >\n                <ExternalLinkIcon class=\"rtl:-scale-x-100\" aria-hidden=\"true\" />\n                {{ t('ai.open_link', {}, 'Open') }}: {{ message.content }}\n              </Button>\n            </div>\n\n            <div\n              v-else-if=\"message.role === 'action' && message.action\"\n              data-slot=\"ai-action-card\"\n              :data-status=\"message.action.status\"\n              class=\"bg-card rounded-lg border p-3 text-sm shadow-xs\"\n            >\n              <p class=\"text-muted-foreground text-xs font-medium tracking-wide uppercase\">\n                {{ t('ai.proposed_action', {}, 'Proposed action') }}\n              </p>\n              <p class=\"mt-1 font-medium\">\n                {{ message.action.label\n                }}<span v-if=\"message.action.record\" class=\"text-muted-foreground font-normal\">\n                  · {{ message.action.record }}</span\n                >\n              </p>\n              <p v-if=\"message.content\" class=\"text-muted-foreground mt-1\">{{ message.content }}</p>\n              <dl\n                v-if=\"message.action.inputs && message.action.inputs.length > 0\"\n                class=\"mt-2 grid grid-cols-[auto_1fr] gap-x-3 gap-y-1 text-xs\"\n              >\n                <div v-for=\"(input, index) in message.action.inputs\" :key=\"index\" class=\"contents\">\n                  <dt class=\"text-muted-foreground\">{{ input.label }}</dt>\n                  <dd class=\"break-words\">{{ String(input.value ?? '—') }}</dd>\n                </div>\n              </dl>\n              <p v-if=\"message.action.error\" class=\"text-destructive mt-2 text-xs\">\n                {{ message.action.error }}\n              </p>\n              <div class=\"mt-3 flex items-center gap-2\">\n                <template v-if=\"message.action.status === 'pending'\">\n                  <Button\n                    type=\"button\"\n                    size=\"sm\"\n                    :disabled=\"state.deciding[message.id] !== undefined\"\n                    @click=\"controller.decide(message.id, 'confirm')\"\n                  >\n                    <Spinner v-if=\"state.deciding[message.id] === 'confirm'\" class=\"size-3\" />\n                    {{ t('ai.confirm', {}, 'Confirm') }}\n                  </Button>\n                  <Button\n                    type=\"button\"\n                    size=\"sm\"\n                    variant=\"ghost\"\n                    :disabled=\"state.deciding[message.id] !== undefined\"\n                    @click=\"controller.decide(message.id, 'reject')\"\n                  >\n                    {{ t('ai.cancel', {}, 'Cancel') }}\n                  </Button>\n                  <span class=\"text-muted-foreground ms-auto text-xs\">{{\n                    t('ai.pending', {}, 'Waiting for your confirmation')\n                  }}</span>\n                </template>\n                <Badge\n                  v-else\n                  :variant=\"\n                    message.action.status === 'confirmed'\n                      ? 'default'\n                      : message.action.status === 'failed'\n                        ? 'destructive'\n                        : 'secondary'\n                  \"\n                >\n                  {{ statusLabel(message.action.status) }}\n                </Badge>\n              </div>\n            </div>\n\n            <div\n              v-else\n              data-slot=\"ai-message\"\n              data-role=\"assistant\"\n              :data-demo=\"message.demo ? '' : undefined\"\n              class=\"flex flex-col gap-2\"\n            >\n              <Badge\n                v-if=\"message.demo\"\n                variant=\"outline\"\n                class=\"self-start font-normal\"\n                data-ai-sample=\"\"\n              >\n                {{ t('ai.sample', {}, \"Sample answer — AI isn't configured\") }}\n              </Badge>\n              <div\n                v-if=\"message.activity && message.activity.length > 0\"\n                class=\"flex flex-wrap gap-1\"\n              >\n                <Badge\n                  v-for=\"(item, index) in message.activity\"\n                  :key=\"index\"\n                  variant=\"secondary\"\n                  class=\"font-normal\"\n                  >{{ item.label }}</Badge\n                >\n              </div>\n              <div class=\"flex flex-col gap-2 text-sm leading-relaxed\">\n                <span class=\"sr-only\">{{ t('ai.assistant', {}, 'Copilot') }}: </span>\n                <template v-for=\"(block, index) in copilotBlocks(message.content)\" :key=\"index\">\n                  <p v-if=\"block.type === 'p'\" class=\"whitespace-pre-wrap\">\n                    {{ block.lines.join('\\n') }}\n                  </p>\n                  <ol v-else-if=\"block.type === 'ol'\" class=\"flex list-decimal flex-col gap-1 ps-5\">\n                    <li v-for=\"(line, item) in block.lines\" :key=\"item\">{{ line }}</li>\n                  </ol>\n                  <ul v-else class=\"flex list-disc flex-col gap-1 ps-5\">\n                    <li v-for=\"(line, item) in block.lines\" :key=\"item\">{{ line }}</li>\n                  </ul>\n                </template>\n              </div>\n              <p v-if=\"usage(message)\" class=\"text-muted-foreground text-xs\">\n                {{ usage(message) }}\n              </p>\n            </div>\n          </template>\n          <div\n            v-if=\"state.sending && state.streaming && state.streaming.text !== ''\"\n            class=\"bg-muted/60 rounded-lg px-3 py-2 text-sm leading-relaxed break-words whitespace-pre-wrap\"\n            data-slot=\"ai-streaming\"\n            aria-busy=\"true\"\n          >\n            {{ state.streaming.text }}\n          </div>\n          <div\n            v-if=\"state.sending\"\n            class=\"text-muted-foreground flex items-center gap-2 text-sm\"\n            data-slot=\"ai-thinking\"\n          >\n            <Spinner class=\"size-4\" />\n            {{\n              state.streaming\n                ? t('ai.stream.writing', {}, 'Writing…')\n                : t('ai.thinking', {}, 'Thinking…')\n            }}\n            <Button\n              v-if=\"state.streaming\"\n              type=\"button\"\n              variant=\"ghost\"\n              size=\"sm\"\n              class=\"ms-auto\"\n              data-slot=\"ai-stream-stop\"\n              :aria-label=\"t('ai.stream.stop_label', {}, 'Stop writing the answer')\"\n              @click=\"controller.cancel()\"\n            >\n              <SquareIcon aria-hidden=\"true\" class=\"size-3.5\" />\n              {{ t('ai.stream.stop', {}, 'Stop') }}\n            </Button>\n          </div>\n          <div class=\"sr-only\" aria-live=\"polite\" aria-atomic=\"true\">\n            {{ state.streaming?.announcement ?? '' }}\n          </div>\n        </div>\n        <div ref=\"end\" />\n      </div>\n\n      <form\n        v-if=\"state.view === 'chat'\"\n        class=\"flex flex-col gap-2 border-t p-3\"\n        data-slot=\"ai-composer\"\n        @submit.prevent=\"controller.send()\"\n      >\n        <p v-if=\"state.error\" role=\"alert\" class=\"text-destructive flex items-start gap-2 text-sm\">\n          <CircleAlertIcon class=\"mt-0.5 size-4 shrink-0\" aria-hidden=\"true\" />\n          {{ state.error.message ?? t('ai.error', {}, 'Something went wrong. Try again.') }}\n        </p>\n        <div class=\"flex items-end gap-2\">\n          <Textarea\n            :model-value=\"state.draft\"\n            :rows=\"2\"\n            :maxlength=\"4000\"\n            autofocus\n            :placeholder=\"t('ai.placeholder', {}, 'Ask about your data…')\"\n            :aria-label=\"t('ai.placeholder', {}, 'Ask about your data…')\"\n            class=\"max-h-40 min-h-10 flex-1 resize-none\"\n            @update:model-value=\"(value: string) => controller.setDraft(value)\"\n            @keydown=\"onKeydown\"\n          />\n          <Button\n            type=\"submit\"\n            size=\"icon\"\n            :disabled=\"state.sending || state.draft.trim() === ''\"\n            :aria-label=\"t('ai.send', {}, 'Send')\"\n          >\n            <ArrowUpIcon aria-hidden=\"true\" />\n          </Button>\n        </div>\n        <p v-if=\"totals\" class=\"text-muted-foreground text-end text-xs\" data-slot=\"ai-usage\">\n          {{ tokens(totals.inputTokens + totals.outputTokens)\n          }}<template v-if=\"totals.cost !== undefined && currency\">\n            · {{ cost(totals.cost) }}</template\n          >\n        </p>\n      </form>\n    </SheetContent>\n  </Sheet>\n</template>\n"],"mappings":""}

package/dist/components/ai/CopilotPanel.vue.d.ts

@@ -0,0 +1,7 @@
+import { type CopilotController } from '@alfakit/core';
+type __VLS_Props = {
+    controller: CopilotController;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=CopilotPanel.vue.d.ts.map

package/dist/components/ai/CopilotPanel.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopilotPanel.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ai/CopilotPanel.vue"],"names":[],"mappings":"AA8cA,OAAO,EAAwB,KAAK,iBAAiB,EAAiB,MAAM,eAAe,CAAA;AA0B3F,KAAK,WAAW,GAAG;IAAE,UAAU,EAAE,iBAAiB,CAAA;CAAE,CAAC;;AA6sCrD,wBAMG"}