@adminforth/agent 1.26.4 → 1.26.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/build.log +2 -2
  2. package/custom/conversation_area/ProcessingTimeline.vue +28 -6
  3. package/custom/conversation_area/ReasoningRenderer.vue +30 -28
  4. package/custom/conversation_area/ToolsGroup.vue +16 -14
  5. package/dist/custom/conversation_area/ProcessingTimeline.vue +28 -6
  6. package/dist/custom/conversation_area/ReasoningRenderer.vue +30 -28
  7. package/dist/custom/conversation_area/ToolsGroup.vue +16 -14
  8. package/package.json +1 -1
package/build.log CHANGED
@@ -38,5 +38,5 @@ custom/skills/fetch_data/SKILL.md
38
38
  custom/skills/mutate_data/
39
39
  custom/skills/mutate_data/SKILL.md
40
40
 
41
- sent 207,056 bytes received 546 bytes 415,204.00 bytes/sec
42
- total size is 204,758 speedup is 0.99
41
+ sent 207,895 bytes received 562 bytes 416,914.00 bytes/sec
42
+ total size is 205,615 speedup is 0.99
package/custom/conversation_area/ProcessingTimeline.vue CHANGED
@@ -14,19 +14,21 @@
14
14
  </div>
15
15
  <transition name="expand" class="max-h-96 overflow-y-auto mb-4 pt-1">
16
16
  <CustomAutoScrollContainer
17
+ ref="scrollContainerRef"
17
18
  :enabled="isResponseInProgress"
18
19
  behavior="smooth"
19
20
  v-if="ToolOrReasoningParts.length > 0"
20
21
  v-show="isExpanded"
22
+ :threshold="5"
21
23
  :wrapperStyle="{
22
24
  marginRight: '8rem',
23
25
  }"
24
26
  >
25
- <ol class="ml-8 relative border-l border-l-2 border-black border-default border-listTableHeadingText dark:border-darkListTableHeadingText">
26
- <li class="mb-6 ms-2 z-50" v-for="(part, index) in ToolOrReasoningParts" :key="index">
27
+ <ol class="ml-8 my-2 relative border-l border-l-2 border-black border-default border-listTableHeadingText dark:border-darkListTableHeadingText">
28
+ <template v-for="(part, index) in ToolOrReasoningParts" :key="index">
27
29
  <ReasoningRenderer v-if="part.type === 'reasoning'" :state="part.state" :text="part.text" />
28
- <ToolsGroup v-else :toolGroup="groupToolCallParts(message, part)" />
29
- </li>
30
+ <ToolsGroup v-else-if="part.type==='data-tool-call'" :toolGroup="groupToolCallParts(message, part)" />
31
+ </template>
30
32
  </ol>
31
33
  </CustomAutoScrollContainer>
32
34
  </transition>
@@ -37,7 +39,7 @@
37
39
 
38
40
  <script setup lang="ts">
39
41
  import type { IFormattedToolCallPart, IMessage, IPart, IToolGroup } from '../types';
40
- import { ref, computed, watch, defineAsyncComponent, onMounted } from 'vue';
42
+ import { ref, computed, watch, onUnmounted, onMounted } from 'vue';
41
43
  import ReasoningRenderer from './ReasoningRenderer.vue';
42
44
  import { IconAngleDownOutline } from '@iconify-prerendered/vue-flowbite';
43
45
  import ThreeDotsAnimation from './ThreeDotsAnimation.vue';
@@ -51,15 +53,35 @@
51
53
  isLastMessageInChat: boolean
52
54
  }>()
53
55
 
54
- // const AutoScrollContainer = defineAsyncComponent(() => import('@incremark/vue').then(module => module.AutoScrollContainer))
55
56
  const agentStore = useAgentStore();
56
57
  const thinkingStartTime = ref<number | null>(null);
57
58
  const thinkingDuration = ref(0);
59
+ const scrollContainerRef = ref<InstanceType<typeof CustomAutoScrollContainer> | null>(null);
60
+ const innerScrollContainerRef = ref<HTMLElement | null>(null);
58
61
 
59
62
  onMounted(() => {
60
63
  thinkingStartTime.value = Date.now();
61
64
  })
62
65
 
66
+ watch(scrollContainerRef, async () => {
67
+ if (innerScrollContainerRef.value) {
68
+ innerScrollContainerRef.value.removeEventListener('scroll', handleScroll);
69
+ }
70
+
71
+ if (scrollContainerRef.value) {
72
+ innerScrollContainerRef.value = scrollContainerRef.value.container.scrollEl;
73
+ innerScrollContainerRef.value.addEventListener('scroll', handleScroll);
74
+ }
75
+ })
76
+
77
+ onUnmounted(() => {
78
+ scrollContainerRef.value?.container.scrollEl?.removeEventListener('scroll', handleScroll);
79
+ })
80
+
81
+ function handleScroll() {
82
+ scrollContainerRef.value?.handleScroll();
83
+ }
84
+
63
85
  const ToolOrReasoningParts = computed(() => {
64
86
  return props.message.parts.filter((part: IPart) => part.type === 'data-tool-call' || part.type === 'reasoning');
65
87
  });
package/custom/conversation_area/ReasoningRenderer.vue CHANGED
@@ -1,33 +1,35 @@
1
1
  <template>
2
- <span class="bg-lightNavbar dark:bg-darkNavbar absolute flex items-center text-listTableHeadingText dark:text-darkListTableHeadingText justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
3
- <div class="w-5 h-5 rounded-full flex items-center justify-center">
4
- <IconBrainOutline class="w-4 h-4" />
5
- </div>
6
- </span>
7
- <h3
8
- class="flex items-center mb-1 text-sm my-2 ml-3 gap-1 cursor-pointer select-none hover:opacity-80 text-listTableHeadingText dark:text-darkListTableHeadingText"
9
- @click="isExpanded = !isExpanded"
10
- >
11
- <span class="font-semibold">{{ reasoningTitle }}</span>
12
- <ThreeDotsAnimation v-if="isStreaming"/>
13
- <IconAngleDownOutline
14
- :class="isExpanded ? 'rotate-180' : 'rotate-0'"
15
- class="transition-transform duration-200"
16
- />
17
- </h3>
18
- <transition name="expand">
19
- <CustomAutoScrollContainer
20
- v-if="isExpanded" v-show="isExpanded" class="mb-4 text-sm max-h-64 pl-4"
21
- :wrapperStyle="{
22
- marginRight: '8rem',
23
- }"
24
- :enabled="isStreaming"
2
+ <li class="mb-6 ms-2 z-50 overflow-hidden">
3
+ <span class="bg-lightNavbar dark:bg-darkNavbar absolute flex items-center text-listTableHeadingText dark:text-darkListTableHeadingText justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
4
+ <div class="w-5 h-5 rounded-full flex items-center justify-center">
5
+ <IconBrainOutline class="w-4 h-4" />
6
+ </div>
7
+ </span>
8
+ <h3
9
+ class=" flex items-center mb-1 text-sm ml-3 gap-1 cursor-pointer select-none hover:opacity-80 text-listTableHeadingText dark:text-darkListTableHeadingText"
10
+ @click="isExpanded = !isExpanded"
25
11
  >
26
- <IncremarkContent
27
- :content="reasoningText"
12
+ <span class="font-semibold">{{ reasoningTitle }}</span>
13
+ <ThreeDotsAnimation v-if="isStreaming"/>
14
+ <IconAngleDownOutline
15
+ :class="isExpanded ? 'rotate-180' : 'rotate-0'"
16
+ class="transition-transform duration-200"
28
17
  />
29
- </CustomAutoScrollContainer>
30
- </transition>
18
+ </h3>
19
+ <transition name="expand">
20
+ <CustomAutoScrollContainer
21
+ v-if="isExpanded" v-show="isExpanded" class="text-sm max-h-64 pl-4"
22
+ :wrapperStyle="{
23
+ marginRight: '8rem',
24
+ }"
25
+ :enabled="isStreaming"
26
+ >
27
+ <IncremarkContent
28
+ :content="reasoningText"
29
+ />
30
+ </CustomAutoScrollContainer>
31
+ </transition>
32
+ </li>
31
33
  </template>
32
34
 
33
35
 
@@ -67,7 +69,7 @@ watch(() => props.state, (newValue: IPart['state']) => {
67
69
  <style scoped>
68
70
  .expand-enter-active,
69
71
  .expand-leave-active {
70
- transition: all 0.3s ease;
72
+ transition: all 300ms ease;
71
73
  }
72
74
 
73
75
  .expand-enter-from,
package/custom/conversation_area/ToolsGroup.vue CHANGED
@@ -1,20 +1,22 @@
1
1
  <template >
2
2
  <template v-if="toolGroup.length > 0">
3
- <span class="text-listTableHeadingText dark:text-darkListTableHeadingText bg-lightNavbar dark:bg-darkNavbar absolute flex items-center justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
4
- <div class="w-5 h-5 rounded-full flex items-center justify-center">
5
- <IconWrenchSolid class="w-4 h-4" />
3
+ <li class="mb-6 ms-2 z-50">
4
+ <span class="text-listTableHeadingText dark:text-darkListTableHeadingText bg-lightNavbar dark:bg-darkNavbar absolute flex items-center justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
5
+ <div class="w-5 h-5 rounded-full flex items-center justify-center">
6
+ <IconWrenchSolid class="w-4 h-4" />
7
+ </div>
8
+ </span>
9
+ <h3
10
+ class="flex items-center mb-1 text-sm my-2 ml-3 gap-1 text-listTableHeadingText dark:text-darkListTableHeadingText"
11
+ >
12
+ <span class="font-semibold select-none ">Call tools</span>
13
+ </h3>
14
+ <div class="flex flex-wrap">
15
+ <template v-for="group in props.toolGroup" :key="group.title">
16
+ <ToolRenderer v-for="part in group.groupedTools" :key="part.toolInfo.toolCallId" :data="part"/>
17
+ </template>
6
18
  </div>
7
- </span>
8
- <h3
9
- class="flex items-center mb-1 text-sm my-2 ml-3 gap-1 text-listTableHeadingText dark:text-darkListTableHeadingText"
10
- >
11
- <span class="font-semibold select-none ">Call tools</span>
12
- </h3>
13
- <div class="flex flex-wrap">
14
- <template v-for="group in props.toolGroup" :key="group.title">
15
- <ToolRenderer v-for="part in group.groupedTools" :key="part.toolInfo.toolCallId" :data="part"/>
16
- </template>
17
- </div>
19
+ </li>
18
20
  </template>
19
21
  </template>
20
22
 
package/dist/custom/conversation_area/ProcessingTimeline.vue CHANGED
@@ -14,19 +14,21 @@
14
14
  </div>
15
15
  <transition name="expand" class="max-h-96 overflow-y-auto mb-4 pt-1">
16
16
  <CustomAutoScrollContainer
17
+ ref="scrollContainerRef"
17
18
  :enabled="isResponseInProgress"
18
19
  behavior="smooth"
19
20
  v-if="ToolOrReasoningParts.length > 0"
20
21
  v-show="isExpanded"
22
+ :threshold="5"
21
23
  :wrapperStyle="{
22
24
  marginRight: '8rem',
23
25
  }"
24
26
  >
25
- <ol class="ml-8 relative border-l border-l-2 border-black border-default border-listTableHeadingText dark:border-darkListTableHeadingText">
26
- <li class="mb-6 ms-2 z-50" v-for="(part, index) in ToolOrReasoningParts" :key="index">
27
+ <ol class="ml-8 my-2 relative border-l border-l-2 border-black border-default border-listTableHeadingText dark:border-darkListTableHeadingText">
28
+ <template v-for="(part, index) in ToolOrReasoningParts" :key="index">
27
29
  <ReasoningRenderer v-if="part.type === 'reasoning'" :state="part.state" :text="part.text" />
28
- <ToolsGroup v-else :toolGroup="groupToolCallParts(message, part)" />
29
- </li>
30
+ <ToolsGroup v-else-if="part.type==='data-tool-call'" :toolGroup="groupToolCallParts(message, part)" />
31
+ </template>
30
32
  </ol>
31
33
  </CustomAutoScrollContainer>
32
34
  </transition>
@@ -37,7 +39,7 @@
37
39
 
38
40
  <script setup lang="ts">
39
41
  import type { IFormattedToolCallPart, IMessage, IPart, IToolGroup } from '../types';
40
- import { ref, computed, watch, defineAsyncComponent, onMounted } from 'vue';
42
+ import { ref, computed, watch, onUnmounted, onMounted } from 'vue';
41
43
  import ReasoningRenderer from './ReasoningRenderer.vue';
42
44
  import { IconAngleDownOutline } from '@iconify-prerendered/vue-flowbite';
43
45
  import ThreeDotsAnimation from './ThreeDotsAnimation.vue';
@@ -51,15 +53,35 @@
51
53
  isLastMessageInChat: boolean
52
54
  }>()
53
55
 
54
- // const AutoScrollContainer = defineAsyncComponent(() => import('@incremark/vue').then(module => module.AutoScrollContainer))
55
56
  const agentStore = useAgentStore();
56
57
  const thinkingStartTime = ref<number | null>(null);
57
58
  const thinkingDuration = ref(0);
59
+ const scrollContainerRef = ref<InstanceType<typeof CustomAutoScrollContainer> | null>(null);
60
+ const innerScrollContainerRef = ref<HTMLElement | null>(null);
58
61
 
59
62
  onMounted(() => {
60
63
  thinkingStartTime.value = Date.now();
61
64
  })
62
65
 
66
+ watch(scrollContainerRef, async () => {
67
+ if (innerScrollContainerRef.value) {
68
+ innerScrollContainerRef.value.removeEventListener('scroll', handleScroll);
69
+ }
70
+
71
+ if (scrollContainerRef.value) {
72
+ innerScrollContainerRef.value = scrollContainerRef.value.container.scrollEl;
73
+ innerScrollContainerRef.value.addEventListener('scroll', handleScroll);
74
+ }
75
+ })
76
+
77
+ onUnmounted(() => {
78
+ scrollContainerRef.value?.container.scrollEl?.removeEventListener('scroll', handleScroll);
79
+ })
80
+
81
+ function handleScroll() {
82
+ scrollContainerRef.value?.handleScroll();
83
+ }
84
+
63
85
  const ToolOrReasoningParts = computed(() => {
64
86
  return props.message.parts.filter((part: IPart) => part.type === 'data-tool-call' || part.type === 'reasoning');
65
87
  });
package/dist/custom/conversation_area/ReasoningRenderer.vue CHANGED
@@ -1,33 +1,35 @@
1
1
  <template>
2
- <span class="bg-lightNavbar dark:bg-darkNavbar absolute flex items-center text-listTableHeadingText dark:text-darkListTableHeadingText justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
3
- <div class="w-5 h-5 rounded-full flex items-center justify-center">
4
- <IconBrainOutline class="w-4 h-4" />
5
- </div>
6
- </span>
7
- <h3
8
- class="flex items-center mb-1 text-sm my-2 ml-3 gap-1 cursor-pointer select-none hover:opacity-80 text-listTableHeadingText dark:text-darkListTableHeadingText"
9
- @click="isExpanded = !isExpanded"
10
- >
11
- <span class="font-semibold">{{ reasoningTitle }}</span>
12
- <ThreeDotsAnimation v-if="isStreaming"/>
13
- <IconAngleDownOutline
14
- :class="isExpanded ? 'rotate-180' : 'rotate-0'"
15
- class="transition-transform duration-200"
16
- />
17
- </h3>
18
- <transition name="expand">
19
- <CustomAutoScrollContainer
20
- v-if="isExpanded" v-show="isExpanded" class="mb-4 text-sm max-h-64 pl-4"
21
- :wrapperStyle="{
22
- marginRight: '8rem',
23
- }"
24
- :enabled="isStreaming"
2
+ <li class="mb-6 ms-2 z-50 overflow-hidden">
3
+ <span class="bg-lightNavbar dark:bg-darkNavbar absolute flex items-center text-listTableHeadingText dark:text-darkListTableHeadingText justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
4
+ <div class="w-5 h-5 rounded-full flex items-center justify-center">
5
+ <IconBrainOutline class="w-4 h-4" />
6
+ </div>
7
+ </span>
8
+ <h3
9
+ class=" flex items-center mb-1 text-sm ml-3 gap-1 cursor-pointer select-none hover:opacity-80 text-listTableHeadingText dark:text-darkListTableHeadingText"
10
+ @click="isExpanded = !isExpanded"
25
11
  >
26
- <IncremarkContent
27
- :content="reasoningText"
12
+ <span class="font-semibold">{{ reasoningTitle }}</span>
13
+ <ThreeDotsAnimation v-if="isStreaming"/>
14
+ <IconAngleDownOutline
15
+ :class="isExpanded ? 'rotate-180' : 'rotate-0'"
16
+ class="transition-transform duration-200"
28
17
  />
29
- </CustomAutoScrollContainer>
30
- </transition>
18
+ </h3>
19
+ <transition name="expand">
20
+ <CustomAutoScrollContainer
21
+ v-if="isExpanded" v-show="isExpanded" class="text-sm max-h-64 pl-4"
22
+ :wrapperStyle="{
23
+ marginRight: '8rem',
24
+ }"
25
+ :enabled="isStreaming"
26
+ >
27
+ <IncremarkContent
28
+ :content="reasoningText"
29
+ />
30
+ </CustomAutoScrollContainer>
31
+ </transition>
32
+ </li>
31
33
  </template>
32
34
 
33
35
 
@@ -67,7 +69,7 @@ watch(() => props.state, (newValue: IPart['state']) => {
67
69
  <style scoped>
68
70
  .expand-enter-active,
69
71
  .expand-leave-active {
70
- transition: all 0.3s ease;
72
+ transition: all 300ms ease;
71
73
  }
72
74
 
73
75
  .expand-enter-from,
package/dist/custom/conversation_area/ToolsGroup.vue CHANGED
@@ -1,20 +1,22 @@
1
1
  <template >
2
2
  <template v-if="toolGroup.length > 0">
3
- <span class="text-listTableHeadingText dark:text-darkListTableHeadingText bg-lightNavbar dark:bg-darkNavbar absolute flex items-center justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
4
- <div class="w-5 h-5 rounded-full flex items-center justify-center">
5
- <IconWrenchSolid class="w-4 h-4" />
3
+ <li class="mb-6 ms-2 z-50">
4
+ <span class="text-listTableHeadingText dark:text-darkListTableHeadingText bg-lightNavbar dark:bg-darkNavbar absolute flex items-center justify-center w-5 h-5 bg-brand-softer rounded-full -start-[0.68rem] ring-4 ring-lightNavbar dark:ring-darkNavbar ring-default">
5
+ <div class="w-5 h-5 rounded-full flex items-center justify-center">
6
+ <IconWrenchSolid class="w-4 h-4" />
7
+ </div>
8
+ </span>
9
+ <h3
10
+ class="flex items-center mb-1 text-sm my-2 ml-3 gap-1 text-listTableHeadingText dark:text-darkListTableHeadingText"
11
+ >
12
+ <span class="font-semibold select-none ">Call tools</span>
13
+ </h3>
14
+ <div class="flex flex-wrap">
15
+ <template v-for="group in props.toolGroup" :key="group.title">
16
+ <ToolRenderer v-for="part in group.groupedTools" :key="part.toolInfo.toolCallId" :data="part"/>
17
+ </template>
6
18
  </div>
7
- </span>
8
- <h3
9
- class="flex items-center mb-1 text-sm my-2 ml-3 gap-1 text-listTableHeadingText dark:text-darkListTableHeadingText"
10
- >
11
- <span class="font-semibold select-none ">Call tools</span>
12
- </h3>
13
- <div class="flex flex-wrap">
14
- <template v-for="group in props.toolGroup" :key="group.title">
15
- <ToolRenderer v-for="part in group.groupedTools" :key="part.toolInfo.toolCallId" :data="part"/>
16
- </template>
17
- </div>
19
+ </li>
18
20
  </template>
19
21
  </template>
20
22
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adminforth/agent",
3
- "version": "1.26.4",
3
+ "version": "1.26.6",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "type": "module",