@deepseek-ai/dsh-client-ui-settings-account 0.2.1-rc.3 → 0.2.2-alpha.2

package/README.i18n.yaml

@@ -15,14 +15,14 @@
   en: c26f81e8adf0128b
   zh: e11ab371f51f66bc
 /deepseek-ai-dsh-client-ui-settings-account/use-this-package:
-  en: 45aa7b44d5424d9b
-  zh: 20c7d344c4e9bce0
+  en: 2e63a8b01d800894
+  zh: 42db1f28e2ddb2a3
 /deepseek-ai-dsh-client-ui-settings-account/use-this-package/desktop-onboarding:
-  en: c1c4db71fd09ca13
-  zh: a40c0a01e9951945
+  en: 7ae4e68f9491b068
+  zh: f7478269bf8d28b3
 /deepseek-ai-dsh-client-ui-settings-account/understand-the-implementation:
-  en: 149d25b949a24036
-  zh: a432400e245bf48b
+  en: 186b2046cfb5ef76
+  zh: 57b042a618fb612e
 /deepseek-ai-dsh-client-ui-settings-account/further-exploration:
   en: f5ca95916ef486dc
   zh: 1e238d8299e0d838

package/README.md

@@ -30,7 +30,7 @@ A new account-model sign-in-required event displays “Model unavailable. Please
 
 Desktop and plain Web clients both mount the sidebar account launcher, Account settings, the sign-in step of model onboarding, and the account-state subscription. Desktop main opens the authorization page in the system browser. A plain Web client, identified by the absent Desktop preload bridge, sends `login_source` web with its own origin as the callback origin, preopens a tab during the sign-in click, navigates it to the authorization URL with the same `theme` parameter once its attempt receives one, and closes it on failure, expiry, or cancellation; a blocked popup leaves the copy-link route. Embedded Platform pages, Desktop onboarding, and the native device reader stay Desktop-only, so Web Platform links open new tabs.
 
-The sidebar and Account settings display circular profile images with diameters of 24px and 32px respectively. Both observe one browser image load and show the account icon while no URL is available, loading is pending, or loading failed. A rendered image failure updates the shared result, so both surfaces return to the icon and remain eligible for retry; reports from a superseded picture attempt are ignored. Each Settings entry, or return from a Settings or quota-notice top-up page, retries a failed image once even when its URL is unchanged; pending and successful loads are reused, and success updates both surfaces. A changed picture URL starts a new load; account-state replacement, sign-out, and plugin unload discard the previous picture and its callbacks. The collapsed sidebar centers the avatar in a 36 × 36 px button. Before sign-in the sidebar launcher shows a More row instead, leading with the ellipsis glyph.
+The sidebar and Account settings display circular profile images with diameters of 24px and 32px respectively. Both observe one browser image load and show the account icon while no URL is available, loading is pending, or loading failed. A rendered image failure updates the shared result, so both surfaces return to the icon and remain eligible for retry; reports from a superseded picture attempt are ignored. Each Settings entry, or return from a Settings or quota-notice top-up page, retries a failed image once even when its URL is unchanged; pending and successful loads are reused, and success updates both surfaces. A changed picture URL starts a new load; account-state replacement, sign-out, and plugin unload discard the previous picture and its callbacks. The collapsed sidebar centers the avatar in a 36 × 36 px button. Before sign-in the sidebar launcher shows a compact More row instead, leading with the ellipsis glyph and aligning its content and inset hover fill with navigation rows. Expanded buttons use border-box sizing: the signed-in row is 44px high including its 6px padding, and the signed-out More row is 32px high. The signed-in launcher retains its 24px avatar and 8px label gap and owns a 2px inline margin on its root; this inset does not move the Settings shell's adjacent status indicator horizontally.
 
 The section registers through settings.section and uses the account Remote namespace. The stream survives carrier reconnects through the shared Remote supervisor. The page renders feature-owned English and Chinese copy and keeps API keys separate from account state.
 
@@ -63,12 +63,14 @@ The Desktop preload marker enables the introduction after account credentials ar
 
 The welcome page requires Get started. The credit page always appears. A positive balance confirmed at first entry selects Continue as the primary action and Add credits as the secondary action. This choice stays fixed until the onboarding controller is recreated and is never persisted; late balance results cannot change the buttons. Only a confirmed absence of positive credit adds a confirmation before continuing without recharge; pending or failed queries do not block continuing. Purpose descriptions remain unchanged when selected. Returning from the native top-up view keeps the credit page and re-reads profile and balance in the background after any read already running, whether loading or payment succeeded. That read does not recompute the funded-mode choice, so a completed recharge leaves the buttons as first entered while continuing still evaluates the refreshed balance. Next confirms only a known zero balance; Skip uses the credit warning on the credit page and the setup warning on the question pages. Office-only use completes with compact presentation; development or both purposes also ask for process detail. Back preserves selections, and explicit skip from any supported step applies standard process, compact performance/usage, and disabled Coding Tools. This flow creates no workspace or demonstration task.
 
+Access: the account stream, quota notice, settings launcher, account settings section, and models sign-in entry exist only while the current Peer may call `account/watch`; Desktop onboarding and the platform page are not gated. Losing that access discards the account reads that grant started, closes a pending authorization tab, and clears the account view, details, picture, and sign-in dialog state; a later grant shows the account section again once its first frame arrives. The owner always has access.
+
 <a id="understand-the-implementation"></a>
 ## Understand the implementation
 
 The Account section appears first in Settings only while signed in; it is hidden before account state loads and after sign-out. The plugin owns one Host snapshot stream shared through framework hooks by settings.section and settings.launcher. The launcher opens Settings and offers Sign out only while an account credential is stored. Platform failures leave the menu available for retry. It maintains no independent credential state.
 
-The desktop controller writes progress to `ui-settings-account` through Host settings. Completion first applies `ui-chat.transcriptView` and `ui-chat.performanceUsage` together, then calls the shared Coding Tools preference to persist `ui-settings.enabled`, and finally saves the done marker; a rejected write keeps the flow available for retry. Successful completion reveals the workspace through a 180ms fade; choices and ordinary navigation preview immediately while writes run in order. A failed final queued write restores saved progress and allows retry. Completion waits for queued choices and retains the page until preferences persist; reduced motion skips the fade. Onboarding choices compact, standard, and detailed apply directly to the corresponding Chat work-detail modes. API-key entry and explicit skip select standard; onboarding does not select verbose. Complete Figma illustration layers are bundled as transparent, lossless 3× WebP assets; welcome layers are merged with local sidebar blur; recharge uses a 70% opaque foreground window with local blur of the covered illustration, and headings use the bundled Montserrat brand font; English headings and descriptions use Light (300), except the DeepSeek Harness brand within headings uses Medium (500); card titles retain Regular (400) when selected. English footer navigation uses Light (300). Confirmed onboarding sets a 960px minimum window width and enlarges narrower windows; completion releases the minimum without restoring the previous size. Loading or already-completed onboarding does not resize the window. Empty footer navigation space passes pointer events through to the primary action. Cards exclude native window dragging and own the keyboard focus outline for their checkbox. The account package owns its onboarding overlay and control geometry. Each step and the confirmation dialog has a separate component; the flow coordinates navigation, transitions, and recharge. The overlay hides the workspace while initial account and progress state loads. Question headings and cards follow the Figma positions at 1440 × 920 and 960 × 600, independently of their action buttons. On macOS, content clears the body portal’s inherited no-drag region and a first-child drag band leaves an 8px native resize margin; interactive controls and later dialogs exclude their regions, and a native Platform page disables the underlying onboarding band. The upper workspace popup illustration has an opaque background in both languages and themes; the underlying sidebar omits its selected-row highlight. Welcome keeps its illustration at its original size, repositions and clips the artwork in narrow windows, and reveals the complete illustration on wide windows. The [historical onboarding decision](../../../.agents/notes/archived/feature/2026-09-16-desktop-onboarding.md) owns persistence and presentation trade-offs.
+The desktop controller writes progress to `ui-settings-account` through Host settings. Completion first applies `ui-chat.transcriptView` and `ui-chat.performanceUsage` together, then calls the shared Coding Tools preference to persist `ui-settings.enabled`, and finally saves the done marker; a rejected write keeps the flow available for retry. Successful completion reveals the workspace through a 180ms fade; choices and ordinary navigation preview immediately while writes run in order. A failed final queued write restores saved progress and allows retry. Completion waits for queued choices and retains the page until preferences persist; reduced motion skips the fade. Onboarding choices compact, standard, and detailed apply directly to the corresponding Chat work-detail modes. API-key entry and explicit skip select standard; onboarding does not select verbose. Complete Figma illustration layers ship as transparent, lossless 3× WebP [package assets](../AGENTS.md#dependency-declaration); welcome layers are merged with local sidebar blur; recharge uses a 70% opaque foreground window with local blur of the covered illustration, and headings use the bundled Montserrat brand font; English headings and descriptions use Light (300), except the DeepSeek Harness brand within headings uses Medium (500); card titles retain Regular (400) when selected. English footer navigation uses Light (300). Confirmed onboarding sets a 960px minimum window width and enlarges narrower windows; completion releases the minimum without restoring the previous size. Loading or already-completed onboarding does not resize the window. Empty footer navigation space passes pointer events through to the primary action. Cards exclude native window dragging and own the keyboard focus outline for their checkbox. The account package owns its onboarding overlay and control geometry. Each step and the confirmation dialog has a separate component; the flow coordinates navigation, transitions, and recharge. The overlay hides the workspace while initial account and progress state loads. Question headings and cards follow the Figma positions at 1440 × 920 and 960 × 600, independently of their action buttons. On macOS, content clears the body portal’s inherited no-drag region and a first-child drag band leaves an 8px native resize margin; interactive controls and later dialogs exclude their regions, and a native Platform page disables the underlying onboarding band. The upper workspace popup illustration has an opaque background in both languages and themes; the underlying sidebar omits its selected-row highlight. Welcome keeps its illustration at its original size, repositions and clips the artwork in narrow windows, and reveals the complete illustration on wide windows. The [historical onboarding decision](../../../.agents/notes/archived/feature/2026-09-16-desktop-onboarding.md) owns persistence and presentation trade-offs.
 
 <a id="further-exploration"></a>
 ## Further Exploration

package/README.zh.md

@@ -30,7 +30,7 @@ kind: "package-reference"
 
 Desktop 与普通 Web 客户端都挂载侧边栏账号菜单、账号设置、模型引导中的登录步骤，并订阅账号状态。Desktop 主进程在系统浏览器中打开授权页面。普通 Web 客户端（以缺少 Desktop preload 桥接识别）以 `login_source` web 发起登录，并以自身 origin 作为回调 origin；它在点击登录时预先打开一个标签页，本次尝试获得授权 URL 后带上相同的 `theme` 参数导航该标签页，并在失败、过期或取消时关闭它；弹窗被拦截时仍可使用复制链接。内嵌 Platform 页面、Desktop 引导和原生设备信息读取器仅在 Desktop 中提供，因此 Web 中的 Platform 链接在新标签页打开。
 
-侧边栏和账号设置以正圆图片显示账号头像，直径分别为 24px 和 32px。两处共享一次浏览器图片加载，URL 缺失、加载中或加载失败时使用账号图标兜底。渲染图片失败时更新共享结果，两处一起恢复为图标，并保留重试机会；已被替换的图片加载尝试上报的失败会被忽略。每次进入设置，或从设置及余额不足提示打开的充值页面返回时，都会重试一次失败的图片，即使 URL 未变化；加载中和已成功的图片会复用，成功后两处一起展示。头像 URL 变化时开始新加载；账号状态替换、退出登录和插件卸载会丢弃旧头像及其回调。折叠侧边栏将头像居中放置在 36 × 36 px 的按钮内。登录前侧边栏入口改为「更多」行，以三点图标开头。
+侧边栏和账号设置以正圆图片显示账号头像，直径分别为 24px 和 32px。两处共享一次浏览器图片加载，URL 缺失、加载中或加载失败时使用账号图标兜底。渲染图片失败时更新共享结果，两处一起恢复为图标，并保留重试机会；已被替换的图片加载尝试上报的失败会被忽略。每次进入设置，或从设置及余额不足提示打开的充值页面返回时，都会重试一次失败的图片，即使 URL 未变化；加载中和已成功的图片会复用，成功后两处一起展示。头像 URL 变化时开始新加载；账号状态替换、退出登录和插件卸载会丢弃旧头像及其回调。折叠侧边栏将头像居中放置在 36 × 36 px 的按钮内。登录前侧边栏入口改为紧凑的「更多」行，以三点图标开头，内容和内缩的悬停底色与导航行对齐。展开态按钮采用 border-box 尺寸：已登录行含 6px 内边距共高 44px，未登录的「更多」行高 32px。已登录入口保留 24px 头像及 8px 标签间距，并由自身根节点承担左右各 2px 外边距；该内缩不会水平移动设置外壳中相邻的状态指示器。
 
 该页面通过 settings.section 注册，并使用 account Remote 命名空间。共享 Remote 管理器负责连接恢复后的流重连。页面使用功能自有的中英文文案，将 API Key 与账号状态分开。
 
@@ -63,12 +63,14 @@ Desktop preload 标记在账号凭证已存储后启用引导。进度属于本
 
 欢迎页必须点击“开始设置”。额度页始终展示。首次进入时若已确认有正余额，则主操作为“继续”，次操作为“去充值”。该选择在引导控制器重建前保持固定且不持久化，后到的余额结果不会改变按钮。仅在确认不存在正余额时，继续而不充值才需确认；查询中或失败时不阻止继续。用途卡片选中后描述不变。从原生充值视图返回后保留额度页，并在等待任何已在进行的读取结束后于后台重读资料与余额，不受页面加载或支付结果影响。该读取不会重新计算该选择，因此充值成功后按钮仍保持首次进入时的状态，而继续前行仍按刷新后的余额判断。“下一步”仅在确认零余额时提示；额度页的“跳过”使用充值提示，答题页使用设置提示。仅选办公用途时以简洁展示完成；选择开发或两种用途时还会询问过程详情。上一步保留已有选择，任意可跳过步骤均采用标准工作过程、简洁性能与用量以及关闭代码工作工具的默认值。此流程不创建工作区或示例任务。
 
+访问控制：账号状态流、额度提醒、设置启动器、账号设置分区与模型登录入口只在当前 Peer 可以调用 `account/watch` 时存在；桌面引导与平台页面不受此控制。失去该权限时，这一轮发出的账号读取作废，待授权的浏览器标签页关闭，账号视图、详情、头像与登录对话框状态清空；之后再次授权时，账号分区等新流的第一帧到达后才重新出现。owner 始终有权限。
+
 <a id="understand-the-implementation"></a>
 ## 理解实现
 
 仅登录后在设置导航首位显示账号页；账号状态加载完成前以及退出登录后隐藏该页。 插件持有一条 Host 快照流，通过框架 hook 供 settings.section 和 settings.launcher 共享。入口菜单可打开设置，并仅在已存储账号凭证时提供退出登录。Platform 请求失败时保留菜单，以供重试。插件不维护独立凭证状态。
 
-桌面控制器通过 Host 设置将进度写入 `ui-settings-account`。完成时先一并应用 `ui-chat.transcriptView` 与 `ui-chat.performanceUsage`，再通过共享代码工作工具偏好保存 `ui-settings.enabled`，最后保存完成标记；写入被拒绝时保留引导以供重试。成功完成后通过 180ms 淡出显露工作区；选择和普通翻页立即预览，写入在后台按顺序执行。队列最后一次写入失败时恢复已保存进度，并允许重试。完成操作会等待选择队列及偏好保存成功，再关闭页面；减少动态效果偏好会跳过淡出。onboarding 选项 compact、standard、detailed 直接应用到对应的 Chat 工作过程模式。API Key 进入与显式跳过均采用 standard；onboarding 不选择 verbose。完整 Figma 示意图层以透明、无损编码的 3× WebP 资源打包；欢迎页图层合并并烘焙侧栏局部模糊；充值页前景窗口不透明度为 70%，仅烘焙其覆盖插图区域的模糊，标题使用已打包的 Montserrat 品牌字体，英文标题和描述使用 Light（300），标题中的 DeepSeek Harness 使用 Medium（500）；卡片标题选中前后均使用 Regular（400）。英文底部导航使用 Light（300）。确认进入引导后，窗口最小宽度设为 960px，较窄窗口自动放大；完成后解除宽度限制，但不恢复原尺寸。加载中或已完成引导的启动不改变窗口尺寸。底部导航空白区域透过鼠标事件，避免遮挡主操作。卡片区域不参与原生窗口拖动，复选框的键盘焦点仅在卡片外框展示。账号包负责引导覆盖层和控件尺寸样式。每个步骤和确认弹窗各有独立组件，流程组件协调导航、切换动画和充值。初始账号与进度加载期间，覆盖层隐藏工作区。答题标题和卡片独立于操作按钮，位置对齐 Figma 的 1440 × 920 和 960 × 600 断点。macOS 的内容层清除 body 浮层继承的 no-drag，位于内容之前的拖拽层保留 8px 原生缩放边缘；交互控件和后续弹窗排除自身区域；原生平台页面打开时禁用底层引导拖拽层。上方工作区弹窗插画在两种语言和主题下均使用不透明背景，下层侧边栏不绘制选中行高亮。欢迎页保持示意图的原始尺寸，在窄窗口内调整插图位置并裁切，在宽窗口内展示完整插图。[历史引导决策](../../../.agents/notes/archived/feature/2026-09-16-desktop-onboarding.md)记录持久化与展示方面的取舍。
+桌面控制器通过 Host 设置将进度写入 `ui-settings-account`。完成时先一并应用 `ui-chat.transcriptView` 与 `ui-chat.performanceUsage`，再通过共享代码工作工具偏好保存 `ui-settings.enabled`，最后保存完成标记；写入被拒绝时保留引导以供重试。成功完成后通过 180ms 淡出显露工作区；选择和普通翻页立即预览，写入在后台按顺序执行。队列最后一次写入失败时恢复已保存进度，并允许重试。完成操作会等待选择队列及偏好保存成功，再关闭页面；减少动态效果偏好会跳过淡出。onboarding 选项 compact、standard、detailed 直接应用到对应的 Chat 工作过程模式。API Key 进入与显式跳过均采用 standard；onboarding 不选择 verbose。完整 Figma 示意图层以透明、无损编码的 3× WebP [包资源](../AGENTS.md#dependency-declaration)形式提供；欢迎页图层合并并烘焙侧栏局部模糊；充值页前景窗口不透明度为 70%，仅烘焙其覆盖插图区域的模糊，标题使用已打包的 Montserrat 品牌字体，英文标题和描述使用 Light（300），标题中的 DeepSeek Harness 使用 Medium（500）；卡片标题选中前后均使用 Regular（400）。英文底部导航使用 Light（300）。确认进入引导后，窗口最小宽度设为 960px，较窄窗口自动放大；完成后解除宽度限制，但不恢复原尺寸。加载中或已完成引导的启动不改变窗口尺寸。底部导航空白区域透过鼠标事件，避免遮挡主操作。卡片区域不参与原生窗口拖动，复选框的键盘焦点仅在卡片外框展示。账号包负责引导覆盖层和控件尺寸样式。每个步骤和确认弹窗各有独立组件，流程组件协调导航、切换动画和充值。初始账号与进度加载期间，覆盖层隐藏工作区。答题标题和卡片独立于操作按钮，位置对齐 Figma 的 1440 × 920 和 960 × 600 断点。macOS 的内容层清除 body 浮层继承的 no-drag，位于内容之前的拖拽层保留 8px 原生缩放边缘；交互控件和后续弹窗排除自身区域；原生平台页面打开时禁用底层引导拖拽层。上方工作区弹窗插画在两种语言和主题下均使用不透明背景，下层侧边栏不绘制选中行高亮。欢迎页保持示意图的原始尺寸，在窄窗口内调整插图位置并裁切，在宽窗口内展示完整插图。[历史引导决策](../../../.agents/notes/archived/feature/2026-09-16-desktop-onboarding.md)记录持久化与展示方面的取舍。
 
 <a id="further-exploration"></a>
 ## 深入探索

package/lib/assets/onboarding-back-04427ce3e26c.svg

@@ -0,0 +1,3 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="20.2792" height="16.825" viewBox="0 0 20.2792 16.825" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector 5008" d="M1.01986 8.58958H20.2792M8.54303 0.407656L0.825554 8.58958L8.54303 16.4077" stroke="#81858C" stroke-width="1.18823"/>
+</svg>

package/lib/assets/onboarding-code-130f4f9f819c.svg

@@ -0,0 +1,7 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="LinkIcon--code 1">
+<path id="Vector" d="M10.625 12.5L3.75 20L10.625 27.5" stroke="#3B86FF" stroke-width="2"/>
+<path id="Vector_2" d="M29.375 12.5L36.25 20L29.375 27.5" stroke="#3B86FF" stroke-width="2"/>
+<path id="Vector_3" d="M23.125 11.25L16.875 28.75" stroke="#3B86FF" stroke-width="2"/>
+</g>
+</svg>

package/lib/assets/onboarding-compact-4d29ad212f3b.svg

@@ -0,0 +1,6 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="ExitFullscreenGlyph 1">
+<path id="Vector" d="M22.5 6.25V15C22.5 15.663 22.7634 16.2989 23.2322 16.7678C23.7011 17.2366 24.337 17.5 25 17.5H33.75" stroke="#8370F1" stroke-width="2"/>
+<path id="Vector_2" d="M17.5 33.75V25C17.5 24.337 17.2366 23.7011 16.7678 23.2322C16.2989 22.7634 15.663 22.5 15 22.5H6.25" stroke="#8370F1" stroke-width="2"/>
+</g>
+</svg>

package/lib/assets/onboarding-detailed-0e44397e280d.svg

@@ -0,0 +1,7 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="IconBrowseOutline16 1">
+<path id="Vector" d="M28.125 3.375H7.875C6.63236 3.375 5.625 4.38236 5.625 5.625V30.375C5.625 31.6176 6.63236 32.625 7.875 32.625H28.125C29.3676 32.625 30.375 31.6176 30.375 30.375V5.625C30.375 4.38236 29.3676 3.375 28.125 3.375Z" stroke="#00A4C9" stroke-width="2"/>
+<path id="Vector_2" d="M12.375 12.375H23.625" stroke="#00A4C9" stroke-width="2"/>
+<path id="Vector_3" d="M12.375 21.375H19.125" stroke="#00A4C9" stroke-width="2"/>
+</g>
+</svg>

package/lib/assets/onboarding-office-8ca45c77307a.svg

@@ -0,0 +1,8 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Frame 2117131378">
+<path id="Vector" d="M10.5156 33.7727H29.4816C30.7242 33.7727 31.7316 32.7654 31.7316 31.5227V15.716C31.7316 15.1089 31.4863 14.5277 31.0516 14.1042L23.623 6.86866C23.2029 6.45945 22.6395 6.23047 22.0532 6.23047H10.5156C9.273 6.23047 8.26562 7.23782 8.26562 8.48047V31.5227C8.26562 32.7654 9.27297 33.7727 10.5156 33.7727Z" stroke="#8370F1" stroke-width="2"/>
+<path id="Vector_2" d="M21.916 6.47656V13.3789C21.916 14.6216 22.9233 15.6289 24.166 15.6289H31.6317" stroke="#8370F1" stroke-width="2"/>
+<path id="Vector_3" d="M12.1953 21.6016H19.6427" stroke="#8370F1" stroke-width="2"/>
+<path id="Vector_4" d="M12.1953 27.1172H22.8924" stroke="#8370F1" stroke-width="2"/>
+</g>
+</svg>

package/lib/assets/onboarding-standard-13b8aa0232ab.svg

@@ -0,0 +1,8 @@
+<svg preserveAspectRatio="none" overflow="visible" style="display: block;" width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="IconChecklistOutline14 1">
+<path id="Vector" d="M8.4375 14.0625C10.6121 14.0625 12.375 12.2996 12.375 10.125C12.375 7.95038 10.6121 6.1875 8.4375 6.1875C6.26288 6.1875 4.5 7.95038 4.5 10.125C4.5 12.2996 6.26288 14.0625 8.4375 14.0625Z" stroke="#3B86FF" stroke-width="2"/>
+<path id="Vector_2" d="M16.875 10.125H30.375" stroke="#3B86FF" stroke-width="2"/>
+<path id="Vector_3" d="M8.4375 29.8125C10.6121 29.8125 12.375 28.0496 12.375 25.875C12.375 23.7004 10.6121 21.9375 8.4375 21.9375C6.26288 21.9375 4.5 23.7004 4.5 25.875C4.5 28.0496 6.26288 29.8125 8.4375 29.8125Z" stroke="#3B86FF" stroke-width="2"/>
+<path id="Vector_4" d="M16.875 25.875H30.375" stroke="#3B86FF" stroke-width="2"/>
+</g>
+</svg>