@scalar/agent-chat 0.1.2

package/dist/views/PromptForm.vue2.js

@@ -0,0 +1,125 @@
+import { defineComponent, useTemplateRef, computed, watch, createElementBlock, openBlock, createElementVNode, withModifiers, withDirectives, unref, vModelText, createBlock, normalizeClass, createVNode, createTextVNode } from "vue";
+import { ScalarIconButton, ScalarLoading } from "@scalar/components";
+import { ScalarIconPlay, ScalarIconArrowUp } from "@scalar/icons";
+import { useState } from "../state/state.js";
+const _hoisted_1 = { class: "actionContainer" };
+const _hoisted_2 = ["disabled"];
+const _hoisted_3 = { class: "inputActionsContainer" };
+const _hoisted_4 = { class: "contextContainer" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "PromptForm",
+  emits: ["submit"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const emit = __emit;
+    __expose({ focusPrompt });
+    const promptRef = useTemplateRef("prompt");
+    const state = useState();
+    const inputHasContent = computed(() => state.prompt.value.trim().length > 0);
+    watch(state.prompt, () => {
+      if (!promptRef?.value) return;
+      if (!state.prompt.value.length) {
+        promptRef.value.style.height = "0px";
+        return;
+      }
+      promptRef.value.style.height = "auto";
+      promptRef.value.style.height = promptRef.value.scrollHeight + "px";
+    });
+    function onAutoSendClick() {
+      state.mode.value = state.mode.value === "agent" ? "search" : "agent";
+    }
+    function handleSubmit() {
+      if (!inputHasContent.value) return;
+      emit("submit");
+    }
+    function handlePromptKeydown(e) {
+      if (state.loading.value) return;
+      if (e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        handleSubmit();
+        window.scrollTo(0, document.body.scrollHeight);
+      }
+    }
+    function focusPrompt() {
+      promptRef.value?.focus();
+    }
+    watch(
+      () => state.chat.status,
+      (status) => {
+        if (status === "ready" || status === "error") promptRef.value?.focus();
+      }
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("form", {
+          class: "promptForm",
+          onSubmit: withModifiers(handleSubmit, ["prevent"])
+        }, [
+          withDirectives(createElementVNode("textarea", {
+            ref: "prompt",
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => unref(state).prompt.value = $event),
+            class: "prompt",
+            disabled: unref(state).loading.value,
+            name: "prompt",
+            placeholder: "Ask me anything...",
+            onKeydown: handlePromptKeydown
+          }, null, 40, _hoisted_2), [
+            [vModelText, unref(state).prompt.value]
+          ]),
+          createElementVNode("div", _hoisted_3, [
+            createElementVNode("button", {
+              class: normalizeClass(["autoSendButton", {
+                "autoSendButton-enabled": unref(state).mode.value === "agent"
+              }]),
+              type: "button",
+              onClick: onAutoSendClick
+            }, [
+              createVNode(unref(ScalarIconPlay), { weight: "bold" }),
+              _cache[2] || (_cache[2] = createTextVNode(" Agent Mode ", -1))
+            ], 2),
+            !unref(state).loading.value ? (openBlock(), createBlock(unref(ScalarIconButton), {
+              key: 0,
+              class: "sendButton",
+              disabled: !inputHasContent.value,
+              icon: unref(ScalarIconArrowUp),
+              label: "Scalar",
+              size: "md",
+              type: "submit",
+              weight: "bold"
+            }, null, 8, ["disabled", "icon"])) : (openBlock(), createBlock(unref(ScalarLoading), {
+              key: 1,
+              class: "loader",
+              loader: {
+                isLoading: unref(state).loading.value,
+                isValid: false,
+                clear: async () => {
+                },
+                invalidate: async () => {
+                },
+                isInvalid: false,
+                isActive: false,
+                validate: async () => {
+                },
+                start: () => {
+                }
+              },
+              size: "2xl"
+            }, null, 8, ["loader"]))
+          ])
+        ], 32),
+        createElementVNode("div", _hoisted_4, [
+          _cache[3] || (_cache[3] = createElementVNode("span", null, "Type @ to add context from other API's", -1)),
+          createElementVNode("button", {
+            class: "settingsButton",
+            label: "Settings",
+            type: "button",
+            onClick: _cache[1] || (_cache[1] = ($event) => unref(state).settingsModal.show())
+          }, " Settings ")
+        ])
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=PromptForm.vue2.js.map

package/dist/views/PromptForm.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromptForm.vue2.js","sources":["../../src/views/PromptForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, useTemplateRef, watch } from 'vue'\n\nimport { ScalarIconButton, ScalarLoading } from '@scalar/components'\nimport { ScalarIconArrowUp, ScalarIconPlay } from '@scalar/icons'\n\nimport { useState } from '@/state/state'\n\nconst emit = defineEmits<{\n  (e: 'submit'): void\n}>()\n\ndefineExpose({ focusPrompt })\n\nconst promptRef = useTemplateRef<HTMLTextAreaElement>('prompt')\n\nconst state = useState()\nconst inputHasContent = computed(() => state.prompt.value.trim().length > 0)\n\nwatch(state.prompt, () => {\n  if (!promptRef?.value) return\n\n  if (!state.prompt.value.length) {\n    promptRef.value.style.height = '0px'\n    return\n  }\n\n  promptRef.value.style.height = 'auto'\n  promptRef.value.style.height = promptRef.value.scrollHeight + 'px'\n})\n\nfunction onAutoSendClick() {\n  state.mode.value = state.mode.value === 'agent' ? 'search' : 'agent'\n}\n\nfunction handleSubmit() {\n  if (!inputHasContent.value) return\n\n  emit('submit')\n}\n\nfunction handlePromptKeydown(e: KeyboardEvent) {\n  if (state.loading.value) return\n\n  if (e.key === 'Enter' && !e.shiftKey) {\n    e.preventDefault()\n    handleSubmit()\n    window.scrollTo(0, document.body.scrollHeight)\n  }\n}\n\nfunction focusPrompt() {\n  promptRef.value?.focus()\n}\n\nwatch(\n  () => state.chat.status,\n  (status) => {\n    if (status === 'ready' || status === 'error') promptRef.value?.focus()\n  },\n)\n</script>\n\n<template>\n  <div class=\"actionContainer\">\n    <form\n      class=\"promptForm\"\n      @submit.prevent=\"handleSubmit\">\n      <textarea\n        ref=\"prompt\"\n        v-model=\"state.prompt.value\"\n        class=\"prompt\"\n        :disabled=\"state.loading.value\"\n        name=\"prompt\"\n        placeholder=\"Ask me anything...\"\n        @keydown=\"handlePromptKeydown\" />\n      <div class=\"inputActionsContainer\">\n        <button\n          class=\"autoSendButton\"\n          :class=\"{\n            'autoSendButton-enabled': state.mode.value === 'agent',\n          }\"\n          type=\"button\"\n          @click=\"onAutoSendClick\">\n          <ScalarIconPlay weight=\"bold\" />\n          Agent Mode\n        </button>\n        <ScalarIconButton\n          v-if=\"!state.loading.value\"\n          class=\"sendButton\"\n          :disabled=\"!inputHasContent\"\n          :icon=\"ScalarIconArrowUp\"\n          label=\"Scalar\"\n          size=\"md\"\n          type=\"submit\"\n          weight=\"bold\" />\n        <ScalarLoading\n          v-else\n          class=\"loader\"\n          :loader=\"{\n            isLoading: state.loading.value,\n            isValid: false,\n            clear: async () => {},\n            invalidate: async () => {},\n            isInvalid: false,\n            isActive: false,\n            validate: async () => {},\n            start: () => {},\n          }\"\n          size=\"2xl\" />\n      </div>\n    </form>\n    <div class=\"contextContainer\">\n      <span>Type @ to add context from other API's</span>\n      <button\n        class=\"settingsButton\"\n        label=\"Settings\"\n        type=\"button\"\n        @click=\"state.settingsModal.show()\">\n        Settings\n      </button>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.actionContainer {\n  background: color-mix(\n    in srgb,\n    var(--scalar-background-2),\n    var(--scalar-background-1)\n  );\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-radius: 22px 22px 12px 12px;\n  width: 100%;\n  /* visually hides overflowing text below */\n  box-shadow: 0 50px 0 2px var(--scalar-background-1);\n}\n.promptForm {\n  width: 100%;\n  position: relative;\n  display: flex;\n}\n\n.inputActionsContainer {\n  display: flex;\n  justify-content: space-between;\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n  padding: 0 8px 8px 8px;\n  pointer-events: none;\n}\n\n.prompt {\n  width: 100%;\n  resize: none;\n  background: var(--scalar-background-1);\n  border-radius: 22px;\n  box-shadow: var(--scalar-shadow-1);\n  outline: none;\n  border: none;\n  font-family: var(--scalar-font);\n  font-size: 16px;\n  padding: 12px;\n  min-height: 92px;\n  field-sizing: content;\n  padding-bottom: 48px;\n  word-wrap: break-word;\n}\n.dark-mode .prompt {\n  background: var(--scalar-background-2);\n  box-shadow: 0 0 0 var(--scalar-border-width) var(--scalar-border-color);\n}\n.prompt:focus-within {\n  box-shadow: 0 0 0 1.5px var(--scalar-color-blue);\n}\n.prompt:disabled {\n  color: var(--scalar-color-3);\n}\n\n.autoSendButton {\n  color: var(--scalar-color-3);\n  font-size: var(--scalar-font-size-3);\n  padding: 0 8px;\n  height: 28px;\n  font-weight: var(--scalar-bold);\n  border-radius: 20px;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  pointer-events: all;\n}\n.autoSendButton:hover {\n  background: color-mix(\n    in srgb,\n    var(--scalar-background-2),\n    var(--scalar-background-1)\n  );\n  box-shadow: 0 0 0 var(--scalar-border-width) var(--scalar-border-color);\n}\n.dark-mode .autoSendButton:hover {\n  background: var(--scalar-background-3);\n}\n.autoSendButton:active {\n  background: var(--scalar-background-2);\n}\n.autoSendButton-enabled,\n.autoSendButton-enabled:hover,\n.dark-mode .autoSendButton-enabled:hover {\n  background: color-mix(in srgb, var(--scalar-color-blue), transparent 90%);\n  color: var(--scalar-color-blue);\n}\n\n.sendButton {\n  background: var(--scalar-agent-blue) !important;\n  color: white;\n  border-radius: 50% !important;\n  margin: 0 !important;\n  pointer-events: all;\n  width: 28px;\n  height: 28px;\n  padding: 6px;\n}\n\n.sendButton[aria-disabled='true'] {\n  background: var(--scalar-background-2) !important;\n  color: var(--scalar-color-3);\n}\n\n.contextContainer {\n  display: flex;\n  width: 100%;\n  padding: 10px 12px 12px 12px;\n  color: var(--scalar-color-2);\n  font-size: var(--scalar-font-size-3);\n  user-select: none;\n  justify-content: space-between;\n}\n\n.settingsButton {\n  font-weight: var(--scalar-semibold);\n  border-radius: var(--scalar-radius-lg);\n  padding: 4px 6px;\n  margin: -4px -6px;\n}\n.settingsButton:hover {\n  background: var(--scalar-background-2);\n  box-shadow: 0 0 var(--scalar-border-width) 0 var(--scalar-border-color);\n  cursor: pointer;\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_createElementVNode","_unref","_createVNode","_createBlock"],"mappings":";;;;;;;;;;;;AAQA,UAAM,OAAO;AAIb,aAAa,EAAE,aAAa;AAE5B,UAAM,YAAY,eAAoC,QAAQ;AAE9D,UAAM,QAAQ,SAAA;AACd,UAAM,kBAAkB,SAAS,MAAM,MAAM,OAAO,MAAM,KAAA,EAAO,SAAS,CAAC;AAE3E,UAAM,MAAM,QAAQ,MAAM;AACxB,UAAI,CAAC,WAAW,MAAO;AAEvB,UAAI,CAAC,MAAM,OAAO,MAAM,QAAQ;AAC9B,kBAAU,MAAM,MAAM,SAAS;AAC/B;AAAA,MACF;AAEA,gBAAU,MAAM,MAAM,SAAS;AAC/B,gBAAU,MAAM,MAAM,SAAS,UAAU,MAAM,eAAe;AAAA,IAChE,CAAC;AAED,aAAS,kBAAkB;AACzB,YAAM,KAAK,QAAQ,MAAM,KAAK,UAAU,UAAU,WAAW;AAAA,IAC/D;AAEA,aAAS,eAAe;AACtB,UAAI,CAAC,gBAAgB,MAAO;AAE5B,WAAK,QAAQ;AAAA,IACf;AAEA,aAAS,oBAAoB,GAAkB;AAC7C,UAAI,MAAM,QAAQ,MAAO;AAEzB,UAAI,EAAE,QAAQ,WAAW,CAAC,EAAE,UAAU;AACpC,UAAE,eAAA;AACF,qBAAA;AACA,eAAO,SAAS,GAAG,SAAS,KAAK,YAAY;AAAA,MAC/C;AAAA,IACF;AAEA,aAAS,cAAc;AACrB,gBAAU,OAAO,MAAA;AAAA,IACnB;AAEA;AAAA,MACE,MAAM,MAAM,KAAK;AAAA,MACjB,CAAC,WAAW;AACV,YAAI,WAAW,WAAW,WAAW,QAAS,WAAU,OAAO,MAAA;AAAA,MACjE;AAAA,IAAA;;AAKA,aAAAA,UAAA,GAAAC,mBA0DM,OA1DN,YA0DM;AAAA,QAzDJC,mBA8CO,QAAA;AAAA,UA7CL,OAAM;AAAA,UACL,wBAAgB,cAAY,CAAA,SAAA,CAAA;AAAA,QAAA;yBAC7BA,mBAOmC,YAAA;AAAA,YANjC,KAAI;AAAA,yEACKC,MAAA,KAAA,EAAM,OAAO,QAAK;AAAA,YAC3B,OAAM;AAAA,YACL,UAAUA,MAAA,KAAA,EAAM,QAAQ;AAAA,YACzB,MAAK;AAAA,YACL,aAAY;AAAA,YACX,WAAS;AAAA,UAAA;yBALDA,MAAA,KAAA,EAAM,OAAO,KAAK;AAAA,UAAA;UAM7BD,mBAkCM,OAlCN,YAkCM;AAAA,YAjCJA,mBASS,UAAA;AAAA,cARP,uBAAM,kBAAgB;AAAA,0CAC0BC,MAAA,KAAA,EAAM,KAAK,UAAK;AAAA,cAAA;cAGhE,MAAK;AAAA,cACJ,SAAO;AAAA,YAAA;cACRC,YAAgCD,MAAA,cAAA,GAAA,EAAhB,QAAO,QAAM;AAAA,wDAAG,gBAElC,EAAA;AAAA,YAAA;aAESA,MAAA,KAAA,EAAM,QAAQ,sBADvBE,YAQkBF,MAAA,gBAAA,GAAA;AAAA;cANhB,OAAM;AAAA,cACL,WAAW,gBAAA;AAAA,cACX,MAAMA,MAAA,iBAAA;AAAA,cACP,OAAM;AAAA,cACN,MAAK;AAAA,cACL,MAAK;AAAA,cACL,QAAO;AAAA,YAAA,mDACTE,YAaeF,MAAA,aAAA,GAAA;AAAA;cAXb,OAAM;AAAA,cACL,QAAM;AAAA,2BAA2BA,MAAA,KAAA,EAAM,QAAQ;AAAA;;;;;;;;;;;;cAUhD,MAAK;AAAA,YAAA;;;QAGXD,mBASM,OATN,YASM;AAAA,UARJ,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAA,mBAAmD,cAA7C,0CAAsC,EAAA;AAAA,UAC5CA,mBAMS,UAAA;AAAA,YALP,OAAM;AAAA,YACN,OAAM;AAAA,YACN,MAAK;AAAA,YACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAEC,MAAA,KAAA,EAAM,cAAc,KAAA;AAAA,UAAI,GAAI,YAEtC;AAAA,QAAA;;;;;"}

package/dist/views/Settings.vue.d.ts

@@ -0,0 +1,7 @@
+import { type ModalState } from '@scalar/components';
+type __VLS_Props = {
+    modalState: ModalState;
+};
+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=Settings.vue.d.ts.map

package/dist/views/Settings.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Settings.vue.d.ts","sourceRoot":"","sources":["../../src/views/Settings.vue"],"names":[],"mappings":"AAkHA,OAAO,EACL,KAAK,UAAU,EAGhB,MAAM,oBAAoB,CAAA;AAM3B,KAAK,WAAW,GAAG;IACjB,UAAU,EAAE,UAAU,CAAA;CACvB,CAAC;;AA2KF,wBAEG"}

package/dist/views/Settings.vue.js

@@ -0,0 +1,9 @@
+import _sfc_main from "./Settings.vue2.js";
+/* empty css              */
+/* empty css              */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+const Settings = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-87a83fbb"]]);
+export {
+  Settings as default
+};
+//# sourceMappingURL=Settings.vue.js.map

package/dist/views/Settings.vue.js.map

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

package/dist/views/Settings.vue2.js

@@ -0,0 +1,81 @@
+import { defineComponent, computed, createBlock, openBlock, unref, withCtx, createElementVNode, createElementBlock, createCommentVNode, createVNode, isRef } from "vue";
+import { mergeAuthConfig } from "@scalar/api-client/v2/blocks/scalar-auth-selector-block";
+import { getSelectedServer } from "@scalar/api-client/v2/features/operation";
+import { getActiveEnvironment } from "@scalar/api-client/v2/helpers";
+import { ServerSelector } from "@scalar/api-reference/blocks";
+import { ScalarModal, ScalarTextInput } from "@scalar/components";
+import { ScalarIconGear } from "@scalar/icons";
+import { useState } from "../state/state.js";
+import _sfc_main$1 from "./Auth.vue.js";
+const _hoisted_1 = { class: "settingsHeading" };
+const _hoisted_2 = {
+  key: 0,
+  class: "serverSettings"
+};
+const _hoisted_3 = { class: "proxyUrlContainer" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "Settings",
+  props: {
+    modalState: {}
+  },
+  setup(__props) {
+    const { proxyUrl, workspaceStore, config, eventBus } = useState();
+    const doc = computed(() => workspaceStore.workspace.activeDocument);
+    const environment = computed(
+      () => getActiveEnvironment(
+        workspaceStore,
+        workspaceStore.workspace.activeDocument ?? null
+      )
+    );
+    const selectedServer = computed(() => getSelectedServer(doc.value ?? null));
+    const securitySchemes = computed(
+      () => mergeAuthConfig(
+        doc.value?.components?.securitySchemes,
+        config.value.authentication?.securitySchemes
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ScalarModal), { state: _ctx.modalState }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(unref(ScalarIconGear)),
+            _cache[1] || (_cache[1] = createElementVNode("h1", null, "Settings", -1))
+          ]),
+          doc.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
+            createElementVNode("div", null, [
+              createVNode(unref(ServerSelector), {
+                eventBus: unref(eventBus),
+                selectedServer: selectedServer.value,
+                servers: doc.value?.servers ?? []
+              }, null, 8, ["eventBus", "selectedServer", "servers"])
+            ]),
+            createElementVNode("div", null, [
+              createVNode(_sfc_main$1, {
+                document: doc.value,
+                environment: environment.value,
+                eventBus: unref(eventBus),
+                options: unref(config),
+                securitySchemes: securitySchemes.value,
+                selectedServer: selectedServer.value
+              }, null, 8, ["document", "environment", "eventBus", "options", "securitySchemes", "selectedServer"])
+            ]),
+            createElementVNode("div", _hoisted_3, [
+              _cache[2] || (_cache[2] = createElementVNode("label", { for: "proxyUrl" }, "Proxy URL", -1)),
+              createVNode(unref(ScalarTextInput), {
+                id: "proxyUrl",
+                modelValue: unref(proxyUrl),
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(proxyUrl) ? proxyUrl.value = $event : null),
+                placeholder: "https://proxy.scalar.com"
+              }, null, 8, ["modelValue"])
+            ])
+          ])) : createCommentVNode("", true)
+        ]),
+        _: 1
+      }, 8, ["state"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=Settings.vue2.js.map

package/dist/views/Settings.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Settings.vue2.js","sources":["../../src/views/Settings.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport { mergeAuthConfig } from '@scalar/api-client/v2/blocks/scalar-auth-selector-block'\nimport { getSelectedServer } from '@scalar/api-client/v2/features/operation'\nimport { getActiveEnvironment } from '@scalar/api-client/v2/helpers'\nimport { ServerSelector } from '@scalar/api-reference/blocks'\nimport {\n  type ModalState,\n  ScalarModal,\n  ScalarTextInput,\n} from '@scalar/components'\nimport { ScalarIconGear } from '@scalar/icons'\n\nimport { useState } from '@/state/state'\nimport Auth from '@/views/Auth.vue'\n\ndefineProps<{\n  modalState: ModalState\n}>()\n\nconst { proxyUrl, workspaceStore, config, eventBus } = useState()\n\nconst doc = computed(() => workspaceStore.workspace.activeDocument)\n\nconst environment = computed(() =>\n  getActiveEnvironment(\n    workspaceStore,\n    workspaceStore.workspace.activeDocument ?? null,\n  ),\n)\n\nconst selectedServer = computed(() => getSelectedServer(doc.value ?? null))\n\n/** Merge authentication config with the document security schemes */\nconst securitySchemes = computed(() =>\n  mergeAuthConfig(\n    doc.value?.components?.securitySchemes,\n    config.value.authentication?.securitySchemes,\n  ),\n)\n</script>\n\n<template>\n  <ScalarModal :state=\"modalState\">\n    <div class=\"settingsHeading\">\n      <ScalarIconGear />\n      <h1>Settings</h1>\n    </div>\n    <div\n      v-if=\"doc\"\n      class=\"serverSettings\">\n      <div>\n        <ServerSelector\n          :eventBus\n          :selectedServer\n          :servers=\"doc?.servers ?? []\" />\n      </div>\n      <div>\n        <Auth\n          :document=\"doc\"\n          :environment\n          :eventBus\n          :options=\"config\"\n          :securitySchemes\n          :selectedServer />\n      </div>\n      <div class=\"proxyUrlContainer\">\n        <label for=\"proxyUrl\">Proxy URL</label>\n        <ScalarTextInput\n          id=\"proxyUrl\"\n          v-model=\"proxyUrl\"\n          placeholder=\"https://proxy.scalar.com\" />\n      </div>\n    </div>\n  </ScalarModal>\n</template>\n\n<style>\n.scalar-modal-layout {\n  z-index: 1000 !important;\n}\n</style>\n\n<style scoped>\n.settingsHeading {\n  font-size: var(--scalar-font-size-1);\n  margin-bottom: 15px;\n  display: flex;\n  gap: 5px;\n  align-items: center;\n}\n\n.serverSettings {\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n}\n\n.proxyUrlContainer {\n  font-size: var(--scalar-font-size-3);\n  display: flex;\n  gap: 5px;\n  flex-direction: column;\n}\n</style>\n"],"names":["_createBlock","_unref","modalState","_createElementVNode","_createVNode","_openBlock","_createElementBlock","Auth"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqBA,UAAM,EAAE,UAAU,gBAAgB,QAAQ,SAAA,IAAa,SAAA;AAEvD,UAAM,MAAM,SAAS,MAAM,eAAe,UAAU,cAAc;AAElE,UAAM,cAAc;AAAA,MAAS,MAC3B;AAAA,QACE;AAAA,QACA,eAAe,UAAU,kBAAkB;AAAA,MAAA;AAAA,IAC7C;AAGF,UAAM,iBAAiB,SAAS,MAAM,kBAAkB,IAAI,SAAS,IAAI,CAAC;AAG1E,UAAM,kBAAkB;AAAA,MAAS,MAC/B;AAAA,QACE,IAAI,OAAO,YAAY;AAAA,QACvB,OAAO,MAAM,gBAAgB;AAAA,MAAA;AAAA,IAC/B;;0BAKAA,YA+BcC,MAAA,WAAA,GAAA,EA/BA,OAAOC,KAAAA,cAAU;AAAA,yBAC7B,MAGM;AAAA,UAHNC,mBAGM,OAHN,YAGM;AAAA,YAFJC,YAAkBH,MAAA,cAAA,CAAA;AAAA,YAClB,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAE,mBAAiB,YAAb,YAAQ,EAAA;AAAA,UAAA;UAGN,IAAA,SADRE,UAAA,GAAAC,mBAyBM,OAzBN,YAyBM;AAAA,YAtBJH,mBAKM,OAAA,MAAA;AAAA,cAJJC,YAGkCH,MAAA,cAAA,GAAA;AAAA,gBAF/B,UAAAA,MAAA,QAAA;AAAA,gBACA,gBAAA,eAAA;AAAA,gBACA,SAAS,IAAA,OAAK,WAAO,CAAA;AAAA,cAAA;;YAE1BE,mBAQM,OAAA,MAAA;AAAA,cAPJC,YAMoBG,aAAA;AAAA,gBALjB,UAAU,IAAA;AAAA,gBACV,aAAA,YAAA;AAAA,gBACA,UAAAN,MAAA,QAAA;AAAA,gBACA,SAASA,MAAA,MAAA;AAAA,gBACT,iBAAA,gBAAA;AAAA,gBACA,gBAAA,eAAA;AAAA,cAAA;;YAELE,mBAMM,OANN,YAMM;AAAA,cALJ,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAA,mBAAuC,SAAA,EAAhC,KAAI,WAAA,GAAW,aAAS,EAAA;AAAA,cAC/BC,YAG2CH,MAAA,eAAA,GAAA;AAAA,gBAFzC,IAAG;AAAA,4BACMA,MAAA,QAAA;AAAA,+FAAA,SAAQ,QAAA,SAAA;AAAA,gBACjB,aAAY;AAAA,cAAA;;;;;;;;;"}

package/dist/views/Start.vue.d.ts

@@ -0,0 +1,7 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    submit: () => any;
+}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{
+    onSubmit?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;
+//# sourceMappingURL=Start.vue.d.ts.map

package/dist/views/Start.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Start.vue.d.ts","sourceRoot":"","sources":["../../src/views/Start.vue"],"names":[],"mappings":";;;;;AAiRA,wBAEG"}

package/dist/views/Start.vue.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./Start.vue2.js";
+/* empty css           */
+import _export_sfc from "../_virtual/_plugin-vue_export-helper.js";
+const Start = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-824d38a8"]]);
+export {
+  Start as default
+};
+//# sourceMappingURL=Start.vue.js.map

package/dist/views/Start.vue.js.map

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

package/dist/views/Start.vue2.js

@@ -0,0 +1,57 @@
+import { defineComponent, useTemplateRef, createElementBlock, openBlock, createVNode, createElementVNode, createTextVNode } from "vue";
+import Logo from "../components/Logo.vue.js";
+import Suggestion from "../components/Suggestion.vue.js";
+import PromptForm from "./PromptForm.vue.js";
+const _hoisted_1 = { class: "startContainer" };
+const _hoisted_2 = { class: "suggestionsContainer" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "Start",
+  emits: ["submit"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const textFieldRef = useTemplateRef("promptRef");
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(Logo, { class: "agentLogo" }),
+        _cache[4] || (_cache[4] = createElementVNode("h1", { class: "heading" }, "How can I help you today?", -1)),
+        createVNode(PromptForm, {
+          ref: "promptRef",
+          loading: false,
+          onSubmit: _cache[0] || (_cache[0] = ($event) => emit("submit"))
+        }, null, 512),
+        createElementVNode("div", _hoisted_2, [
+          createVNode(Suggestion, {
+            text: "Can you generate an example OpenAPI spec for me?",
+            onClick: _cache[1] || (_cache[1] = ($event) => textFieldRef.value?.focusPrompt())
+          }),
+          createVNode(Suggestion, {
+            text: "What are the most popular APIs this week?",
+            onClick: _cache[2] || (_cache[2] = ($event) => textFieldRef.value?.focusPrompt())
+          }),
+          createVNode(Suggestion, {
+            text: "Explain to me how Agent Scalar works",
+            onClick: _cache[3] || (_cache[3] = ($event) => textFieldRef.value?.focusPrompt())
+          })
+        ]),
+        _cache[5] || (_cache[5] = createElementVNode("p", { class: "disclaimerText" }, [
+          createTextVNode(" By messaging Agent Scalar, you agree to our "),
+          createElementVNode("a", {
+            class: "disclaimerLink",
+            href: "https://scalar.com/legal/terms-and-conditions",
+            target: "_blank"
+          }, "Terms"),
+          createTextVNode(" and "),
+          createElementVNode("a", {
+            class: "disclaimerLink",
+            href: "https://scalar.com/legal/privacy-policy",
+            target: "_blank"
+          }, "Privacy Policy")
+        ], -1))
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=Start.vue2.js.map

package/dist/views/Start.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Start.vue2.js","sources":["../../src/views/Start.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTemplateRef } from 'vue'\n\nimport Logo from '@/components/Logo.vue'\nimport Suggestion from '@/components/Suggestion.vue'\nimport PromptForm from '@/views/PromptForm.vue'\n\nconst emit = defineEmits<{\n  (e: 'submit'): void\n}>()\n\nconst textFieldRef =\n  useTemplateRef<InstanceType<typeof PromptForm>>('promptRef')\n</script>\n\n<template>\n  <div class=\"startContainer\">\n    <Logo class=\"agentLogo\" />\n    <h1 class=\"heading\">How can I help you today?</h1>\n    <PromptForm\n      ref=\"promptRef\"\n      :loading=\"false\"\n      @submit=\"emit('submit')\" />\n    <div class=\"suggestionsContainer\">\n      <Suggestion\n        text=\"Can you generate an example OpenAPI spec for me?\"\n        @click=\"textFieldRef?.focusPrompt()\" />\n      <Suggestion\n        text=\"What are the most popular APIs this week?\"\n        @click=\"textFieldRef?.focusPrompt()\" />\n      <Suggestion\n        text=\"Explain to me how Agent Scalar works\"\n        @click=\"textFieldRef?.focusPrompt()\" />\n    </div>\n    <p class=\"disclaimerText\">\n      By messaging Agent Scalar, you agree to our\n      <a\n        class=\"disclaimerLink\"\n        href=\"https://scalar.com/legal/terms-and-conditions\"\n        target=\"_blank\"\n        >Terms</a\n      >\n      and\n      <a\n        class=\"disclaimerLink\"\n        href=\"https://scalar.com/legal/privacy-policy\"\n        target=\"_blank\"\n        >Privacy Policy</a\n      >\n    </p>\n  </div>\n</template>\n\n<style scoped>\n.agentLogo {\n  margin-bottom: 15px;\n}\n\n.startContainer {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  max-width: 720px;\n}\n\n.heading {\n  font-size: 1.5rem;\n  font-weight: var(--scalar-font-bold);\n  margin-bottom: 30px;\n}\n\n.suggestionsContainer {\n  display: flex;\n  justify-content: center;\n  gap: 10px;\n  flex-wrap: wrap;\n  margin: 25px 0;\n}\n\n.disclaimerText {\n  text-align: center;\n  color: var(--scalar-color-3);\n  font-size: var(--scalar-font-size-3);\n}\n\n.disclaimerLink {\n  text-decoration: underline;\n}\n</style>\n"],"names":["_openBlock","_createElementBlock","_createVNode","_createElementVNode"],"mappings":";;;;;;;;;;AAOA,UAAM,OAAO;AAIb,UAAM,eACJ,eAAgD,WAAW;;AAI3D,aAAAA,UAAA,GAAAC,mBAkCM,OAlCN,YAkCM;AAAA,QAjCJC,YAA0B,MAAA,EAApB,OAAM,aAAW;AAAA,QACvB,OAAA,CAAA,MAAA,OAAA,CAAA,IAAAC,mBAAkD,MAAA,EAA9C,OAAM,UAAA,GAAU,6BAAyB,EAAA;AAAA,QAC7CD,YAG6B,YAAA;AAAA,UAF3B,KAAI;AAAA,UACH,SAAS;AAAA,UACT,gDAAQ,KAAI,QAAA;AAAA,QAAA;QACfC,mBAUM,OAVN,YAUM;AAAA,UATJD,YAEyC,YAAA;AAAA,YADvC,MAAK;AAAA,YACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,aAAA,OAAc,YAAA;AAAA,UAAW;UACnCA,YAEyC,YAAA;AAAA,YADvC,MAAK;AAAA,YACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,aAAA,OAAc,YAAA;AAAA,UAAW;UACnCA,YAEyC,YAAA;AAAA,YADvC,MAAK;AAAA,YACJ,SAAK,OAAA,CAAA,MAAA,OAAA,CAAA,IAAA,CAAA,WAAE,aAAA,OAAc,YAAA;AAAA,UAAW;;kCAErCC,mBAeI,KAAA,EAfD,OAAM,oBAAgB;AAAA,0BAAC,+CAExB;AAAA,UAAAA,mBAKC,KAAA;AAAA,YAJC,OAAM;AAAA,YACN,MAAK;AAAA,YACL,QAAO;AAAA,UAAA,GACN,OAAK;AAAA,0BACP,OAED;AAAA,UAAAA,mBAKC,KAAA;AAAA,YAJC,OAAM;AAAA,YACN,MAAK;AAAA,YACL,QAAO;AAAA,UAAA,GACN,gBAAc;AAAA,QAAA;;;;;"}

package/package.json

@@ -0,0 +1,63 @@
+{
+  "name": "@scalar/agent-chat",
+  "description": "Agent chat components",
+  "version": "0.1.2",
+  "author": "Copyright API Documentation Inc. 2026",
+  "license": "UNLICENSED",
+  "private": false,
+  "engines": {
+    "node": ">=24"
+  },
+  "files": [
+    "dist"
+  ],
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./*.css": {
+      "import": "./dist/*.css",
+      "require": "./dist/*.css",
+      "default": "./dist/*.css"
+    },
+    "./css/*.css": {
+      "import": "./dist/css/*.css",
+      "require": "./dist/css/*.css",
+      "default": "./dist/css/*.css"
+    }
+  },
+  "dependencies": {
+    "@ai-sdk/vue": "3.0.33",
+    "@scalar/api-client": "2.18.0",
+    "@scalar/api-reference": "1.43.4",
+    "@scalar/components": "0.16.19",
+    "@scalar/helpers": "0.2.7",
+    "@scalar/icons": "0.5.2",
+    "@scalar/json-magic": "0.9.0",
+    "@scalar/openapi-parser": "0.23.13",
+    "@scalar/openapi-types": "0.5.3",
+    "@scalar/types": "0.5.7",
+    "@scalar/workspace-store": "0.24.6",
+    "ai": "6.0.33",
+    "markstream-vue": "0.0.6-beta.0",
+    "vue": "3.5.21",
+    "@scalar-org/css": "0.0.0",
+    "@scalar-org/entities": "0.0.3"
+  },
+  "devDependencies": {
+    "@scalar/build-tooling": "0.4.1",
+    "@vitejs/plugin-vue": "6.0.1",
+    "vite": "7.1.12"
+  },
+  "scripts": {
+    "build": "scalar-build-vite && cp package.json dist",
+    "build:watch": "vite build --watch",
+    "playground": "cd playground && vite",
+    "types:build": "scalar-types-build-vue",
+    "types:check": "scalar-types-check-vue"
+  }
+}