@vibe-forge/client 0.8.4 → 0.10.0

package/src/components/chat/sender/CompletionMenu.scss

@@ -1,70 +0,0 @@
-.completion-menu {
-  z-index: 1000;
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 100%;
-  margin-bottom: 8px;
-  background: white;
-  border: 1px solid #e5e7eb;
-  border-radius: 8px;
-  box-shadow:
-    0 10px 15px -3px rgba(0, 0, 0, .1),
-    0 4px 6px -2px rgba(0, 0, 0, .05);
-  overflow: hidden;
-
-  &-content {
-    max-height: 240px;
-    overflow-y: auto;
-    padding: 4px;
-  }
-
-  .completion-item {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    padding: 8px 12px;
-    border-radius: 6px;
-    cursor: pointer;
-    transition: background-color .1s;
-
-    &:hover, &.active {
-      background-color: #eff6ff;
-    }
-
-    &.active {
-      .label {
-        color: #2563eb;
-        font-weight: 500;
-      }
-    }
-
-    .icon {
-      font-size: 18px;
-      color: #6b7280;
-    }
-
-    .item-info {
-      display: flex;
-      flex-direction: column;
-      flex: 1;
-      min-width: 0;
-
-      .label {
-        font-size: 13px;
-        color: #111827;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-
-      .description {
-        font-size: 11px;
-        color: #6b7280;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-    }
-  }
-}

package/src/components/chat/sender/CompletionMenu.tsx

@@ -1,58 +0,0 @@
-import './CompletionMenu.scss'
-import React, { useEffect, useRef } from 'react'
-
-export interface CompletionItem {
-  label: string
-  value: string
-  description?: string
-  icon?: string
-}
-
-interface CompletionMenuProps {
-  items: CompletionItem[]
-  onSelect: (item: CompletionItem) => void
-  onClose: () => void
-  selectedIndex: number
-}
-
-export function CompletionMenu({
-  items,
-  onSelect,
-  selectedIndex
-}: CompletionMenuProps) {
-  const menuRef = useRef<HTMLDivElement>(null)
-
-  useEffect(() => {
-    const activeItem = menuRef.current?.querySelector('.active')
-    if (activeItem) {
-      activeItem.scrollIntoView({ block: 'nearest' })
-    }
-  }, [selectedIndex])
-
-  if (items.length === 0) return null
-
-  return (
-    <div
-      ref={menuRef}
-      className='completion-menu'
-    >
-      <div className='completion-menu-content'>
-        {items.map((item, index) => (
-          <div
-            key={item.value}
-            className={`completion-item ${index === selectedIndex ? 'active' : ''}`}
-            onClick={() => onSelect(item)}
-          >
-            {item.icon != null && item.icon !== '' &&
-              <span className='material-symbols-rounded icon'>{item.icon}</span>}
-            <div className='item-info'>
-              <span className='label'>{item.label}</span>
-              {item.description != null && item.description !== '' &&
-                <span className='description'>{item.description}</span>}
-            </div>
-          </div>
-        ))}
-      </div>
-    </div>
-  )
-}