@scalar/agent-chat 0.12.44 → 0.12.45

package/dist/style.css

@@ -2987,6 +2987,10 @@ input[data-v-029a43f5]::placeholder {
   flex: 1;
 }
 
+.scalar-app .flex-auto {
+  flex: auto;
+}
+
 .scalar-app .flex-shrink, .scalar-app .shrink {
   flex-shrink: 1;
 }
@@ -3525,6 +3529,10 @@ input[data-v-029a43f5]::placeholder {
   text-align: center;
 }
 
+.scalar-app .text-end {
+  text-align: end;
+}
+
 .scalar-app .text-left {
   text-align: left;
 }
@@ -4697,7 +4705,7 @@ input[data-v-029a43f5]::placeholder {
   position: relative;
 }
 
-.askForAuthentication[data-v-19cedfcd] {
+.askForAuthentication[data-v-508e8718] {
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -4710,7 +4718,7 @@ input[data-v-029a43f5]::placeholder {
     0 calc(-1 * var(--scalar-border-width)) 0 var(--scalar-background-1);
   padding: 0;
 }
-.authContent[data-v-19cedfcd] {
+.authContent[data-v-508e8718] {
   display: grid;
   grid-template-rows: 0fr;
   min-height: 0;
@@ -4720,19 +4728,19 @@ input[data-v-029a43f5]::placeholder {
   margin: auto;
   width: 100%;
 }
-.authContentInner[data-v-19cedfcd] > div {
+.authContentInner[data-v-508e8718] > div {
   margin: 36px 0 48px 0;
 }
-.authContent[data-v-19cedfcd] .markdown {
+.authContent[data-v-508e8718] .markdown {
   margin-bottom: 0 !important;
 }
-.askForAuthentication.open .authContent[data-v-19cedfcd] {
+.askForAuthentication.open .authContent[data-v-508e8718] {
   grid-template-rows: 1fr;
 }
-.continueButton[data-v-19cedfcd] {
+.continueButton[data-v-508e8718] {
   align-self: flex-end;
 }
-.toggleButton[data-v-19cedfcd] {
+.toggleButton[data-v-508e8718] {
   background: none;
   border: none;
   cursor: pointer;
@@ -4744,11 +4752,11 @@ input[data-v-029a43f5]::placeholder {
   justify-content: space-between;
   border-radius: var(--scalar-radius-lg);
 }
-.authContentInner[data-v-19cedfcd] {
+.authContentInner[data-v-508e8718] {
   min-height: 0;
   overflow: hidden;
 }
-.authorizeButton[data-v-19cedfcd] {
+.authorizeButton[data-v-508e8718] {
   background: var(--scalar-color-blue) !important;
   color: white !important;
   margin: 0 !important;
@@ -5017,7 +5025,7 @@ input[data-v-029a43f5]::placeholder {
   text-decoration: underline;
 }
 
-.executeRequestTool[data-v-9025b7d4] {
+.executeRequestTool[data-v-0c85bad4] {
   display: flex;
   flex-direction: column;
   gap: 10px;
@@ -5187,17 +5195,17 @@ input[data-v-029a43f5]::placeholder {
 }
 }
 
-.operations[data-v-cbff70ed] {
+.operations[data-v-fa6f5acc] {
   display: flex;
   gap: 5px;
   align-items: center;
   flex-wrap: wrap;
   margin-bottom: 12px;
 }
-.operations[data-v-cbff70ed]:empty {
+.operations[data-v-fa6f5acc]:empty {
   margin-bottom: -12px;
 }
-.overflowPopover[data-v-cbff70ed] {
+.overflowPopover[data-v-fa6f5acc] {
   display: flex;
   flex-direction: column;
   gap: 5px;
@@ -5544,7 +5552,7 @@ input[data-v-029a43f5]::placeholder {
   margin: 10px;
 }
 
-.uploadSection[data-v-9621c76b] {
+.uploadSection[data-v-b82d2f3a] {
   width: 100%;
   margin-bottom: -16px;
   padding: 8px 8px 24px 12px;
@@ -5563,30 +5571,30 @@ input[data-v-029a43f5]::placeholder {
   top: 0;
   transform: translate3d(0, calc(-100% + 16px), 0);
 }
-.uploadSection.error[data-v-9621c76b] {
+.uploadSection.error[data-v-b82d2f3a] {
   background: color-mix(
     in srgb,
     var(--scalar-color-red),
     var(--scalar-background-1) 95%
   );
 }
-.uploadSection.done[data-v-9621c76b] {
+.uploadSection.done[data-v-b82d2f3a] {
   background: color-mix(
     in srgb,
     var(--scalar-color-green),
     var(--scalar-background-1) 95%
   );
 }
-.uploadText[data-v-9621c76b] {
+.uploadText[data-v-b82d2f3a] {
   font-weight: var(--scalar-semibold);
   font-size: var(--scalar-font-size-3);
 }
-.icon[data-v-9621c76b] {
+.icon[data-v-b82d2f3a] {
   height: 20px;
   width: 20px;
 }
 
-.actionContainer[data-v-3a0f1d21] {
+.actionContainer[data-v-6aae4d61] {
   background: color-mix(
     in srgb,
     var(--scalar-background-2),
@@ -5599,7 +5607,7 @@ input[data-v-029a43f5]::placeholder {
   /* visually hides overflowing text below */
   box-shadow: 0 24px 0 2px var(--scalar-background-1);
 }
-.promptForm[data-v-3a0f1d21] {
+.promptForm[data-v-6aae4d61] {
   width: 100%;
   position: relative;
   display: flex;
@@ -5610,23 +5618,23 @@ input[data-v-029a43f5]::placeholder {
     0 0 0 var(--scalar-border-width) var(--scalar-border-color);
   border-radius: var(--scalar-radius-3xl);
 }
-.inputActionsContainer[data-v-3a0f1d21] {
+.inputActionsContainer[data-v-6aae4d61] {
   display: flex;
   justify-content: space-between;
   padding: 0 8px 8px 8px;
 }
-.inputActionsLeft[data-v-3a0f1d21] {
+.inputActionsLeft[data-v-6aae4d61] {
   display: flex;
   flex-wrap: wrap; /* key: allows pills to go to next line */
   align-items: center;
   gap: 5px; /* spacing between pills */
 }
-.inputActionsRight[data-v-3a0f1d21] {
+.inputActionsRight[data-v-6aae4d61] {
   display: flex;
   gap: 5px;
   position: relative;
 }
-.apiPill[data-v-3a0f1d21] {
+.apiPill[data-v-6aae4d61] {
   font-size: var(--scalar-font-size-3);
   border: var(--scalar-border-width) solid var(--scalar-border-color);
   color: var(--scalar-color-2);
@@ -5641,10 +5649,10 @@ input[data-v-029a43f5]::placeholder {
   gap: 4px;
   user-select: none;
 }
-.apiPillLogo[data-v-3a0f1d21] {
+.apiPillLogo[data-v-6aae4d61] {
   width: 15px;
 }
-.apiPillRemove[data-v-3a0f1d21] {
+.apiPillRemove[data-v-6aae4d61] {
   width: 24px;
   height: 24px;
   margin-right: -6px;
@@ -5653,16 +5661,16 @@ input[data-v-029a43f5]::placeholder {
   align-items: center;
   justify-content: center;
 }
-.apiPill:hover .apiPillRemove[data-v-3a0f1d21] {
+.apiPill:hover .apiPillRemove[data-v-6aae4d61] {
   background: var(--scalar-background-2);
 }
-.dark-mode .apiPill:hover .apiPillRemove[data-v-3a0f1d21] {
+.dark-mode .apiPill:hover .apiPillRemove[data-v-6aae4d61] {
   background: var(--scalar-background-3);
 }
-.apiPillRemove[data-v-3a0f1d21]:hover {
+.apiPillRemove[data-v-6aae4d61]:hover {
   color: var(--scalar-color-1);
 }
-.prompt[data-v-3a0f1d21] {
+.prompt[data-v-6aae4d61] {
   width: 100%;
   outline: none;
   border: none;
@@ -5679,13 +5687,13 @@ input[data-v-029a43f5]::placeholder {
   font-size: 16px;
   padding: 12px 12px 14px 12px;
 }
-.dark-mode .promptForm[data-v-3a0f1d21] {
+.dark-mode .promptForm[data-v-6aae4d61] {
   background: var(--scalar-background-2);
 }
-.prompt[data-v-3a0f1d21]:disabled {
+.prompt[data-v-6aae4d61]:disabled {
   color: var(--scalar-color-3);
 }
-.addAPIButton[data-v-3a0f1d21] {
+.addAPIButton[data-v-6aae4d61] {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -5702,7 +5710,7 @@ input[data-v-029a43f5]::placeholder {
   z-index: 1;
   box-shadow: 0 0 0 var(--scalar-border-width) var(--scalar-border-color);
 }
-.addAPIButton[data-v-3a0f1d21]:hover {
+.addAPIButton[data-v-6aae4d61]:hover {
   background: color-mix(
     in srgb,
     var(--scalar-background-2),
@@ -5710,47 +5718,47 @@ input[data-v-029a43f5]::placeholder {
   );
   box-shadow: 0 0 0 var(--scalar-border-width) var(--scalar-border-color);
 }
-.dark-mode .addAPIButton[data-v-3a0f1d21]:hover {
+.dark-mode .addAPIButton[data-v-6aae4d61]:hover {
   background: var(--scalar-background-3);
 }
-.settingsButton[data-v-3a0f1d21] {
+.settingsButton[data-v-6aae4d61] {
   color: var(--scalar-color-3) !important;
   border-radius: var(--scalar-radius-full) !important;
   margin: 0 !important;
   z-index: 1;
 }
-.settingsButton[aria-disabled='true'][data-v-3a0f1d21] {
+.settingsButton[aria-disabled='true'][data-v-6aae4d61] {
   background: var(--scalar-background-2);
 }
-.dark-mode .settingsButton[data-v-3a0f1d21]:hover {
+.dark-mode .settingsButton[data-v-6aae4d61]:hover {
   background: var(--scalar-background-3);
 }
-.sendButton[data-v-3a0f1d21] {
+.sendButton[data-v-6aae4d61] {
   background: var(--scalar-color-blue) !important;
   border-radius: var(--scalar-radius-full) !important;
   margin: 0 !important;
   z-index: 1;
   border: var(--scalar-border-width) solid var(--scalar-color-blue);
 }
-.sendButton[data-v-3a0f1d21]:not([aria-disabled='true']) {
+.sendButton[data-v-6aae4d61]:not([aria-disabled='true']) {
   color: white !important;
 }
-.sendButton[data-v-3a0f1d21]:not([aria-disabled='true']):hover {
+.sendButton[data-v-6aae4d61]:not([aria-disabled='true']):hover {
   background: color-mix(
     in srgb,
     var(--scalar-color-blue),
     transparent 10%
   ) !important;
 }
-.sendButton[aria-disabled='true'][data-v-3a0f1d21] {
+.sendButton[aria-disabled='true'][data-v-6aae4d61] {
   background: var(--scalar-background-2) !important;
   color: var(--scalar-color-3) !important;
   border: var(--scalar-border-width) solid var(--scalar-border-color);
 }
-.dark-mode .sendButton[aria-disabled='true'][data-v-3a0f1d21] {
+.dark-mode .sendButton[aria-disabled='true'][data-v-6aae4d61] {
   background: var(--scalar-background-3) !important;
 }
-.contextContainer[data-v-3a0f1d21] {
+.contextContainer[data-v-6aae4d61] {
   display: flex;
   width: 100%;
   padding: 10px 12px 12px 12px;
@@ -5759,25 +5767,25 @@ input[data-v-029a43f5]::placeholder {
   user-select: none;
   justify-content: space-between;
 }
-.settingsButton[data-v-3a0f1d21] {
+.settingsButton[data-v-6aae4d61] {
   font-weight: var(--scalar-semibold);
   border-radius: var(--scalar-radius-lg);
   padding: 4px 6px;
   margin: -4px -6px;
 }
-.settingsButton[data-v-3a0f1d21]:hover {
+.settingsButton[data-v-6aae4d61]:hover {
   background: var(--scalar-background-2);
   box-shadow: 0 0 var(--scalar-border-width) 0 var(--scalar-border-color);
   cursor: pointer;
 }
-.agentLabel[data-v-3a0f1d21] {
+.agentLabel[data-v-6aae4d61] {
   font-size: 0px;
   position: absolute;
   width: 100%;
   height: 100%;
   cursor: text;
 }
-.sendCheckboxContinue[data-v-3a0f1d21]:has(input) {
+.sendCheckboxContinue[data-v-6aae4d61]:has(input) {
   display: flex;
   align-items: center;
   border-radius: var(--scalar-radius-3xl);
@@ -5789,11 +5797,11 @@ input[data-v-029a43f5]::placeholder {
   user-select: none;
   height: 28px;
 }
-.dark-mode .sendCheckboxContinue[data-v-3a0f1d21]:has(input) {
+.dark-mode .sendCheckboxContinue[data-v-6aae4d61]:has(input) {
   background: var(--scalar-background-3);
   box-shadow: 0 0 0 1.5px var(--scalar-background-3);
 }
-.addMoreContext[data-v-3a0f1d21] {
+.addMoreContext[data-v-6aae4d61] {
   height: 40px;
   display: flex;
   position: relative;
@@ -5802,7 +5810,7 @@ input[data-v-029a43f5]::placeholder {
   padding: 0 8px 0 12px;
   align-items: center;
 }
-.addMoreContext[data-v-3a0f1d21]:before {
+.addMoreContext[data-v-6aae4d61]:before {
   content: '';
   width: 8px;
   height: 8px;
@@ -5819,10 +5827,10 @@ input[data-v-029a43f5]::placeholder {
     -0.5px -0.5px 0 var(--scalar-border-color),
     inset 0.5px 0.5px 1px var(--scalar-border-color);
 }
-.dark-mode .addMoreContext[data-v-3a0f1d21]:before {
+.dark-mode .addMoreContext[data-v-6aae4d61]:before {
   box-shadow: -0.5px -0.5px 0 var(--scalar-border-color);
 }
-.addAPIContext[data-v-3a0f1d21] {
+.addAPIContext[data-v-6aae4d61] {
   width: 28px;
   height: 28px;
   border-radius: var(--scalar-radius-full);
@@ -5831,7 +5839,7 @@ input[data-v-029a43f5]::placeholder {
   justify-content: center;
   border: var(--scalar-border-width) solid var(--scalar-border-color);
 }
-.termsAgree[data-v-3a0f1d21] {
+.termsAgree[data-v-6aae4d61] {
   display: flex;
   cursor: pointer;
   height: inherit;
@@ -5840,14 +5848,14 @@ input[data-v-029a43f5]::placeholder {
   gap: 5px;
   margin: 0px 5px;
 }
-.termsAgree[data-v-3a0f1d21]:hover {
+.termsAgree[data-v-6aae4d61]:hover {
   color: var(--scalar-color-1);
 }
-.termsAgree:hover .termsAgreeIcon[data-v-3a0f1d21] {
+.termsAgree:hover .termsAgreeIcon[data-v-6aae4d61] {
   background: var(--scalar-color-1);
   color: var(--scalar-background-1);
 }
-.termsAgreeIcon[data-v-3a0f1d21] {
+.termsAgreeIcon[data-v-6aae4d61] {
   width: inherit;
   height: inherit;
   padding: 2px;
@@ -5898,10 +5906,10 @@ div + .userMessage[data-v-6573ec87] {
   margin-bottom: 12px;
 }
 
-.agentLogo[data-v-f9ec1d34] {
+.agentLogo[data-v-b27bdc01] {
   margin-bottom: 15px;
 }
-.startContainer[data-v-f9ec1d34] {
+.startContainer[data-v-b27bdc01] {
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -5911,12 +5919,12 @@ div + .userMessage[data-v-6573ec87] {
   max-width: 720px;
   position: relative;
 }
-.promptText[data-v-f9ec1d34] {
+.promptText[data-v-b27bdc01] {
   font-size: 1.5rem;
   font-weight: var(--scalar-font-bold);
   margin-bottom: 50px;
 }
-.disclaimerText[data-v-f9ec1d34] {
+.disclaimerText[data-v-b27bdc01] {
   text-align: center;
   color: var(--scalar-color-3);
   font-size: var(--scalar-font-size-3);
@@ -5924,7 +5932,7 @@ div + .userMessage[data-v-6573ec87] {
   line-height: 1.44;
   margin-top: 40px;
 }
-.disclaimerLink[data-v-f9ec1d34] {
+.disclaimerLink[data-v-b27bdc01] {
   text-decoration: underline;
 }
 
@@ -5957,13 +5965,13 @@ div + .userMessage[data-v-6573ec87] {
   overflow-x: hidden;
 }
 
-.documentList[data-v-dd2544e6] {
+.documentList[data-v-1a8828eb] {
   display: flex;
   flex-direction: column;
   font-size: var(--scalar-font-size-3);
   margin-bottom: 12px;
 }
-.document[data-v-dd2544e6] {
+.document[data-v-1a8828eb] {
   display: flex;
   flex-direction: column;
   width: calc(100% + 24px);
@@ -5973,10 +5981,10 @@ div + .userMessage[data-v-6573ec87] {
   border-top: var(--scalar-border-width) solid var(--scalar-border-color);
   border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);
 }
-.document[data-v-dd2544e6]:first-of-type:not(:last-of-type) {
+.document[data-v-1a8828eb]:first-of-type:not(:last-of-type) {
   border-bottom: none;
 }
-.documentName[data-v-dd2544e6] {
+.documentName[data-v-1a8828eb] {
   gap: 4px;
   display: flex;
   align-items: center;
@@ -5984,10 +5992,10 @@ div + .userMessage[data-v-6573ec87] {
   color: var(--scalar-color-2);
   padding: 12px 0;
 }
-.documentNameActive[data-v-dd2544e6] {
+.documentNameActive[data-v-1a8828eb] {
   color: var(--scalar-color-1);
 }
-.settingsHeading[data-v-dd2544e6] {
+.settingsHeading[data-v-1a8828eb] {
   font-size: 19px;
   margin-bottom: 12px;
   display: flex;
@@ -5995,16 +6003,16 @@ div + .userMessage[data-v-6573ec87] {
   align-items: center;
   font-weight: var(--scalar-semibold);
 }
-.proxyUrlContainer[data-v-dd2544e6] {
+.proxyUrlContainer[data-v-1a8828eb] {
   font-size: var(--scalar-font-size-3);
   display: flex;
   gap: 5px;
   flex-direction: column;
 }
-.proxyUrlContainer label[data-v-dd2544e6] {
+.proxyUrlContainer label[data-v-1a8828eb] {
   font-weight: var(--scalar-semibold);
 }
-.noDocuments[data-v-dd2544e6] {
+.noDocuments[data-v-1a8828eb] {
   color: var(--scalar-color-2);
   margin-bottom: 10px;
 }

package/dist/views/Chat/Messages/AskForAuthentication.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AskForAuthentication.vue.d.ts","sourceRoot":"","sources":["../../../../src/views/Chat/Messages/AskForAuthentication.vue"],"names":[],"mappings":"AAwLA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,IAAI,CAAA;AACpC,OAAO,EAAY,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAIxC,OAAO,EAAE,gCAAgC,EAAE,MAAM,yCAAyC,CAAA;AAC1F,OAAO,EAAY,KAAK,KAAK,EAAE,MAAM,eAAe,CAAA;AAGpD,KAAK,WAAW,GAAG;IACjB,WAAW,EAAE,GAAG,CACd,UAAU,CAAC,IAAI,CAAC,KAAK,EAAE,OAAO,gCAAgC,CAAC,CAAC,CACjE,CAAA;CACF,CAAC;AA6LF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"AskForAuthentication.vue.d.ts","sourceRoot":"","sources":["../../../../src/views/Chat/Messages/AskForAuthentication.vue"],"names":[],"mappings":"AA8LA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,IAAI,CAAA;AACpC,OAAO,EAAY,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAIxC,OAAO,EAAE,gCAAgC,EAAE,MAAM,yCAAyC,CAAA;AAC1F,OAAO,EAAY,KAAK,KAAK,EAAE,MAAM,eAAe,CAAA;AAGpD,KAAK,WAAW,GAAG;IACjB,WAAW,EAAE,GAAG,CACd,UAAU,CAAC,IAAI,CAAC,KAAK,EAAE,OAAO,gCAAgC,CAAC,CAAC,CACjE,CAAA;CACF,CAAC;AAsMF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/views/Chat/Messages/AskForAuthentication.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import AskForAuthentication_vue_vue_type_script_setup_true_lang_default from "./AskForAuthentication.vue.script.js";
 /* empty css                                   */
 //#region src/views/Chat/Messages/AskForAuthentication.vue
-var AskForAuthentication_default = /*#__PURE__*/ _plugin_vue_export_helper_default(AskForAuthentication_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-19cedfcd"]]);
+var AskForAuthentication_default = /*#__PURE__*/ _plugin_vue_export_helper_default(AskForAuthentication_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-508e8718"]]);
 //#endregion
 export { AskForAuthentication_default as default };
 

package/dist/views/Chat/Messages/AskForAuthentication.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"AskForAuthentication.vue.js","names":[],"sources":["../../../../src/views/Chat/Messages/AskForAuthentication.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIconArrowRight } from '@scalar/icons'\nimport {\n  getActiveEnvironment,\n  getSelectedServer,\n  getServers,\n} from '@scalar/workspace-store/request-example'\nimport { isOpenApiDocument } from '@scalar/workspace-store/schemas/type-guards'\nimport type { ToolUIPart } from 'ai'\nimport { computed, type Ref } from 'vue'\n\nimport AuthenticationProvided from '@/components/AuthenticationProvided.vue'\nimport AuthenticationRequired from '@/components/AuthenticationRequired.vue'\nimport { ASK_FOR_AUTHENTICATION_TOOL_NAME } from '@/entities/tools/ask-for-authentication'\nimport { useState, type Tools } from '@/state/state'\nimport Auth from '@/views/Settings/Auth.vue'\n\nconst { messagePart } = defineProps<{\n  messagePart: Ref<\n    ToolUIPart<Pick<Tools, typeof ASK_FOR_AUTHENTICATION_TOOL_NAME>>\n  >\n}>()\n\nconst { workspaceStore, eventBus, config, chat } = useState()\n\nconst documentName = computed(() => messagePart.value.input?.documentName)\n\nconst document = computed(() => {\n  if (!documentName.value) {\n    return\n  }\n\n  const doc = workspaceStore.workspace.documents[documentName.value]\n  return isOpenApiDocument(doc) ? doc : undefined\n})\n\nconst environment = computed(() => {\n  if (!document.value) {\n    return\n  }\n\n  return getActiveEnvironment(workspaceStore, document.value).environment\n})\n\nconst selectedServer = computed(() => {\n  if (!document.value) {\n    return\n  }\n\n  const servers = getServers(document.value.servers, {\n    documentUrl: document.value['x-scalar-original-source-url'],\n  })\n\n  return getSelectedServer(document.value, null, null, servers)\n})\n\nconst isAuthenticationExpanded = computed(\n  () => documentName.value && environment.value && selectedServer.value,\n)\n\nasync function authorizeClicked() {\n  await chat.addToolOutput({\n    toolCallId: messagePart.value.toolCallId,\n    output: 'Authentication provided.',\n    tool: ASK_FOR_AUTHENTICATION_TOOL_NAME,\n    state: 'output-available',\n  })\n}\n</script>\n\n<template>\n  <div\n    class=\"askForAuthentication\"\n    :class=\"{\n      open: isAuthenticationExpanded,\n    }\">\n    <div class=\"toggleButton\">\n      <AuthenticationProvided\n        v-if=\"messagePart.value.state === 'output-available'\" />\n      <AuthenticationRequired\n        v-if=\"messagePart.value.state === 'input-available'\" />\n      <ScalarButton\n        v-if=\"messagePart.value.state === 'input-available'\"\n        class=\"authorizeButton\"\n        size=\"xs\"\n        @click=\"authorizeClicked\">\n        Authorize\n        <ScalarIconArrowRight weight=\"bold\" />\n      </ScalarButton>\n    </div>\n    <div class=\"authContent\">\n      <div class=\"authContentInner\">\n        <Auth\n          v-if=\"documentName && document && environment && selectedServer\"\n          :authStore=\"workspaceStore.auth\"\n          :document\n          :environment\n          :eventBus\n          :name=\"documentName\"\n          :options=\"config\"\n          :selectedServer />\n      </div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.askForAuthentication {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  position: relative;\n  border-top: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n  margin-bottom: 12px;\n  box-shadow:\n    0 var(--scalar-border-width) 0 var(--scalar-background-1),\n    0 calc(-1 * var(--scalar-border-width)) 0 var(--scalar-background-1);\n  padding: 0;\n}\n\n.authContent {\n  display: grid;\n  grid-template-rows: 0fr;\n  min-height: 0;\n  overflow: hidden;\n  transition: grid-template-rows 0.2s ease-out;\n  max-width: 520px;\n  margin: auto;\n  width: 100%;\n}\n.authContentInner :deep(> div) {\n  margin: 36px 0 48px 0;\n}\n.authContent :deep(.markdown) {\n  margin-bottom: 0 !important;\n}\n.askForAuthentication.open .authContent {\n  grid-template-rows: 1fr;\n}\n\n.continueButton {\n  align-self: flex-end;\n}\n\n.toggleButton {\n  background: none;\n  border: none;\n  cursor: pointer;\n  text-align: left;\n  position: relative;\n  display: flex;\n  align-items: center;\n  color: var(--scalar-color-3);\n  justify-content: space-between;\n  border-radius: var(--scalar-radius-lg);\n}\n\n.authContentInner {\n  min-height: 0;\n  overflow: hidden;\n}\n\n.authorizeButton {\n  background: var(--scalar-color-blue) !important;\n  color: white !important;\n  margin: 0 !important;\n  z-index: 1;\n  display: flex;\n  gap: 5px;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"AskForAuthentication.vue.js","names":[],"sources":["../../../../src/views/Chat/Messages/AskForAuthentication.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIconArrowRight } from '@scalar/icons'\nimport {\n  getActiveEnvironment,\n  getSelectedServer,\n  getServers,\n} from '@scalar/workspace-store/request-example'\nimport { isOpenApiDocument } from '@scalar/workspace-store/schemas/type-guards'\nimport type { ToolUIPart } from 'ai'\nimport { computed, type Ref } from 'vue'\n\nimport AuthenticationProvided from '@/components/AuthenticationProvided.vue'\nimport AuthenticationRequired from '@/components/AuthenticationRequired.vue'\nimport { ASK_FOR_AUTHENTICATION_TOOL_NAME } from '@/entities/tools/ask-for-authentication'\nimport { useState, type Tools } from '@/state/state'\nimport Auth from '@/views/Settings/Auth.vue'\n\nconst { messagePart } = defineProps<{\n  messagePart: Ref<\n    ToolUIPart<Pick<Tools, typeof ASK_FOR_AUTHENTICATION_TOOL_NAME>>\n  >\n}>()\n\nconst { workspaceStore, eventBus, config, chat } = useState()\n\nconst documentName = computed(() => messagePart.value.input?.documentName)\n\nconst document = computed(() => {\n  if (!documentName.value) {\n    return\n  }\n\n  const doc = workspaceStore.workspace.documents[documentName.value]\n  return isOpenApiDocument(doc) ? doc : undefined\n})\n\nconst environment = computed(() => {\n  if (!document.value) {\n    return\n  }\n\n  return getActiveEnvironment(workspaceStore, document.value).environment\n})\n\nconst selectedServer = computed(() => {\n  if (!document.value) {\n    return\n  }\n\n  const servers = getServers(document.value.servers, {\n    documentUrl: document.value['x-scalar-original-source-url'],\n  })\n\n  return getSelectedServer(document.value, null, null, servers)\n})\n\nconst isAuthenticationExpanded = computed(\n  () => documentName.value && environment.value && selectedServer.value,\n)\n\nasync function authorizeClicked() {\n  await chat.addToolOutput({\n    toolCallId: messagePart.value.toolCallId,\n    output: 'Authentication provided.',\n    tool: ASK_FOR_AUTHENTICATION_TOOL_NAME,\n    state: 'output-available',\n  })\n}\n</script>\n\n<template>\n  <div\n    class=\"askForAuthentication\"\n    :class=\"{\n      open: isAuthenticationExpanded,\n    }\">\n    <p\n      v-if=\"messagePart.value.state === 'output-error'\"\n      class=\"text-c-2 py-3\"\n      role=\"status\">\n      {{ messagePart.value.errorText }}\n    </p>\n    <div class=\"toggleButton\">\n      <AuthenticationProvided\n        v-if=\"messagePart.value.state === 'output-available'\" />\n      <AuthenticationRequired\n        v-if=\"messagePart.value.state === 'input-available'\" />\n      <ScalarButton\n        v-if=\"messagePart.value.state === 'input-available'\"\n        class=\"authorizeButton\"\n        size=\"xs\"\n        @click=\"authorizeClicked\">\n        Authorize\n        <ScalarIconArrowRight weight=\"bold\" />\n      </ScalarButton>\n    </div>\n    <div class=\"authContent\">\n      <div class=\"authContentInner\">\n        <Auth\n          v-if=\"documentName && document && environment && selectedServer\"\n          :authStore=\"workspaceStore.auth\"\n          :document\n          :environment\n          :eventBus\n          :name=\"documentName\"\n          :options=\"config\"\n          :selectedServer />\n      </div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.askForAuthentication {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  position: relative;\n  border-top: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-bottom: var(--scalar-border-width) solid var(--scalar-border-color);\n  margin-bottom: 12px;\n  box-shadow:\n    0 var(--scalar-border-width) 0 var(--scalar-background-1),\n    0 calc(-1 * var(--scalar-border-width)) 0 var(--scalar-background-1);\n  padding: 0;\n}\n\n.authContent {\n  display: grid;\n  grid-template-rows: 0fr;\n  min-height: 0;\n  overflow: hidden;\n  transition: grid-template-rows 0.2s ease-out;\n  max-width: 520px;\n  margin: auto;\n  width: 100%;\n}\n.authContentInner :deep(> div) {\n  margin: 36px 0 48px 0;\n}\n.authContent :deep(.markdown) {\n  margin-bottom: 0 !important;\n}\n.askForAuthentication.open .authContent {\n  grid-template-rows: 1fr;\n}\n\n.continueButton {\n  align-self: flex-end;\n}\n\n.toggleButton {\n  background: none;\n  border: none;\n  cursor: pointer;\n  text-align: left;\n  position: relative;\n  display: flex;\n  align-items: center;\n  color: var(--scalar-color-3);\n  justify-content: space-between;\n  border-radius: var(--scalar-radius-lg);\n}\n\n.authContentInner {\n  min-height: 0;\n  overflow: hidden;\n}\n\n.authorizeButton {\n  background: var(--scalar-color-blue) !important;\n  color: white !important;\n  margin: 0 !important;\n  z-index: 1;\n  display: flex;\n  gap: 5px;\n}\n</style>\n"],"mappings":""}

package/dist/views/Chat/Messages/AskForAuthentication.vue.script.js

@@ -3,15 +3,20 @@ import { useState } from "../../../state/state.js";
 import AuthenticationProvided_default from "../../../components/AuthenticationProvided.vue.js";
 import AuthenticationRequired_default from "../../../components/AuthenticationRequired.vue.js";
 import Auth_default from "../../Settings/Auth.vue.js";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, unref, withCtx } from "vue";
-import { getActiveEnvironment, getSelectedServer, getServers } from "@scalar/workspace-store/request-example";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref, withCtx } from "vue";
 import { isOpenApiDocument } from "@scalar/workspace-store/schemas/type-guards";
+import { getActiveEnvironment, getSelectedServer, getServers } from "@scalar/workspace-store/request-example";
 import { ScalarButton } from "@scalar/components/button";
 import { ScalarIconArrowRight } from "@scalar/icons";
 //#region src/views/Chat/Messages/AskForAuthentication.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { class: "toggleButton" };
-var _hoisted_2 = { class: "authContent" };
-var _hoisted_3 = { class: "authContentInner" };
+var _hoisted_1 = {
+	key: 0,
+	class: "text-c-2 py-3",
+	role: "status"
+};
+var _hoisted_2 = { class: "toggleButton" };
+var _hoisted_3 = { class: "authContent" };
+var _hoisted_4 = { class: "authContentInner" };
 var AskForAuthentication_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "AskForAuthentication",
 	props: { messagePart: {} },
@@ -42,36 +47,40 @@ var AskForAuthentication_vue_vue_type_script_setup_true_lang_default = /*@__PURE
 			});
 		}
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", { class: normalizeClass(["askForAuthentication", { open: isAuthenticationExpanded.value }]) }, [createElementVNode("div", _hoisted_1, [
-				__props.messagePart.value.state === "output-available" ? (openBlock(), createBlock(AuthenticationProvided_default, { key: 0 })) : createCommentVNode("", true),
-				__props.messagePart.value.state === "input-available" ? (openBlock(), createBlock(AuthenticationRequired_default, { key: 1 })) : createCommentVNode("", true),
-				__props.messagePart.value.state === "input-available" ? (openBlock(), createBlock(unref(ScalarButton), {
-					key: 2,
-					class: "authorizeButton",
-					size: "xs",
-					onClick: authorizeClicked
-				}, {
-					default: withCtx(() => [_cache[0] || (_cache[0] = createTextVNode(" Authorize ", -1)), createVNode(unref(ScalarIconArrowRight), { weight: "bold" })]),
-					_: 1
-				})) : createCommentVNode("", true)
-			]), createElementVNode("div", _hoisted_2, [createElementVNode("div", _hoisted_3, [documentName.value && document.value && environment.value && selectedServer.value ? (openBlock(), createBlock(Auth_default, {
-				key: 0,
-				authStore: unref(workspaceStore).auth,
-				document: document.value,
-				environment: environment.value,
-				eventBus: unref(eventBus),
-				name: documentName.value,
-				options: unref(config),
-				selectedServer: selectedServer.value
-			}, null, 8, [
-				"authStore",
-				"document",
-				"environment",
-				"eventBus",
-				"name",
-				"options",
-				"selectedServer"
-			])) : createCommentVNode("", true)])])], 2);
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["askForAuthentication", { open: isAuthenticationExpanded.value }]) }, [
+				__props.messagePart.value.state === "output-error" ? (openBlock(), createElementBlock("p", _hoisted_1, toDisplayString(__props.messagePart.value.errorText), 1)) : createCommentVNode("", true),
+				createElementVNode("div", _hoisted_2, [
+					__props.messagePart.value.state === "output-available" ? (openBlock(), createBlock(AuthenticationProvided_default, { key: 0 })) : createCommentVNode("", true),
+					__props.messagePart.value.state === "input-available" ? (openBlock(), createBlock(AuthenticationRequired_default, { key: 1 })) : createCommentVNode("", true),
+					__props.messagePart.value.state === "input-available" ? (openBlock(), createBlock(unref(ScalarButton), {
+						key: 2,
+						class: "authorizeButton",
+						size: "xs",
+						onClick: authorizeClicked
+					}, {
+						default: withCtx(() => [_cache[0] || (_cache[0] = createTextVNode(" Authorize ", -1)), createVNode(unref(ScalarIconArrowRight), { weight: "bold" })]),
+						_: 1
+					})) : createCommentVNode("", true)
+				]),
+				createElementVNode("div", _hoisted_3, [createElementVNode("div", _hoisted_4, [documentName.value && document.value && environment.value && selectedServer.value ? (openBlock(), createBlock(Auth_default, {
+					key: 0,
+					authStore: unref(workspaceStore).auth,
+					document: document.value,
+					environment: environment.value,
+					eventBus: unref(eventBus),
+					name: documentName.value,
+					options: unref(config),
+					selectedServer: selectedServer.value
+				}, null, 8, [
+					"authStore",
+					"document",
+					"environment",
+					"eventBus",
+					"name",
+					"options",
+					"selectedServer"
+				])) : createCommentVNode("", true)])])
+			], 2);
 		};
 	}
 });