@huyooo/ai-chat-frontend-react 0.2.14 → 0.2.16

package/src/components/common/ConfirmDialog.css

@@ -1,136 +0,0 @@
-.confirm-dialog-overlay {
-  position: fixed;
-  inset: 0;
-  z-index: 1000;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: rgba(0, 0, 0, 0.5);
-  backdrop-filter: blur(2px);
-  animation: fadeIn 0.2s ease;
-}
-
-.confirm-dialog {
-  width: 100%;
-  max-width: 400px;
-  margin: 16px;
-  background: var(--chat-dropdown-bg, #252526);
-  border: 1px solid rgba(255, 255, 255, 0.1);
-  border-radius: 12px;
-  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
-  overflow: hidden;
-  animation: scaleIn 0.2s ease;
-}
-
-.confirm-dialog-header {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 12px 16px;
-  border-bottom: 1px solid var(--chat-border, #333);
-}
-
-.confirm-dialog-header .icon {
-  flex-shrink: 0;
-}
-
-.confirm-dialog-header .icon.warning {
-  color: #f59e0b;
-}
-
-.confirm-dialog-header .icon.danger {
-  color: #ef4444;
-}
-
-.confirm-dialog-header .icon.info {
-  color: #3b82f6;
-}
-
-.confirm-dialog-header .title {
-  font-size: 14px;
-  font-weight: 600;
-  color: var(--chat-text, #fff);
-}
-
-.confirm-dialog-content {
-  padding: 16px;
-  font-size: 13px;
-  line-height: 1.6;
-  color: var(--chat-text-muted, #999);
-}
-
-.confirm-dialog-footer {
-  display: flex;
-  justify-content: flex-end;
-  gap: 8px;
-  padding: 12px 16px;
-  border-top: 1px solid var(--chat-border, #333);
-}
-
-.confirm-dialog-footer .btn {
-  padding: 6px 12px;
-  font-size: 13px;
-  font-weight: 500;
-  border: none;
-  border-radius: 4px;
-  cursor: pointer;
-  transition: all 0.15s;
-}
-
-.confirm-dialog-footer .btn-cancel {
-  background: transparent;
-  color: var(--chat-text-muted, #999);
-  border: 1px solid var(--chat-border, #444);
-}
-
-.confirm-dialog-footer .btn-cancel:hover {
-  background: rgba(255, 255, 255, 0.05);
-  color: var(--chat-text, #fff);
-}
-
-.confirm-dialog-footer .btn-info {
-  background: #3b82f6;
-  color: #fff;
-}
-
-.confirm-dialog-footer .btn-info:hover {
-  background: #2563eb;
-}
-
-.confirm-dialog-footer .btn-warning {
-  background: #f59e0b;
-  color: #000;
-}
-
-.confirm-dialog-footer .btn-warning:hover {
-  background: #d97706;
-}
-
-.confirm-dialog-footer .btn-danger {
-  background: #ef4444;
-  color: #fff;
-}
-
-.confirm-dialog-footer .btn-danger:hover {
-  background: #dc2626;
-}
-
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes scaleIn {
-  from {
-    transform: scale(0.95);
-    opacity: 0;
-  }
-  to {
-    transform: scale(1);
-    opacity: 1;
-  }
-}

package/src/components/common/ConfirmDialog.tsx

@@ -1,91 +0,0 @@
-/**
- * ConfirmDialog Component
- * 自定义确认弹窗组件
- */
-
-import { type FC, useEffect } from 'react'
-import { createPortal } from 'react-dom'
-import { Icon } from '@iconify/react'
-import './ConfirmDialog.css'
-
-interface ConfirmDialogProps {
-  /** 是否显示 */
-  visible: boolean
-  /** 标题 */
-  title?: string
-  /** 消息内容 */
-  message: string
-  /** 类型：info | warning | danger */
-  type?: 'info' | 'warning' | 'danger'
-  /** 确认按钮文字 */
-  confirmText?: string
-  /** 取消按钮文字 */
-  cancelText?: string
-  /** 确认回调 */
-  onConfirm?: () => void
-  /** 取消回调 */
-  onCancel?: () => void
-}
-
-export const ConfirmDialog: FC<ConfirmDialogProps> = ({
-  visible,
-  title = '确认',
-  message,
-  type = 'warning',
-  confirmText = '确定',
-  cancelText = '取消',
-  onConfirm,
-  onCancel,
-}) => {
-  // ESC 键关闭
-  useEffect(() => {
-    const handleKeyDown = (e: KeyboardEvent) => {
-      if (e.key === 'Escape' && visible) {
-        onCancel?.()
-      }
-    }
-    document.addEventListener('keydown', handleKeyDown)
-    return () => document.removeEventListener('keydown', handleKeyDown)
-  }, [visible, onCancel])
-
-  // 阻止滚动
-  useEffect(() => {
-    if (visible) {
-      document.body.style.overflow = 'hidden'
-    } else {
-      document.body.style.overflow = ''
-    }
-    return () => {
-      document.body.style.overflow = ''
-    }
-  }, [visible])
-
-  if (!visible) return null
-
-  const iconMap = {
-    info: 'lucide:info',
-    warning: 'lucide:alert-triangle',
-    danger: 'lucide:alert-circle',
-  }
-
-  return createPortal(
-    <div className="confirm-dialog-overlay" onClick={onCancel}>
-      <div className="confirm-dialog" onClick={(e) => e.stopPropagation()}>
-        <div className="confirm-dialog-header">
-          <Icon icon={iconMap[type]} className={`icon ${type}`} width={18} />
-          <span className="title">{title}</span>
-        </div>
-        <div className="confirm-dialog-content">{message}</div>
-        <div className="confirm-dialog-footer">
-          <button className="btn btn-cancel" onClick={onCancel}>
-            {cancelText}
-          </button>
-          <button className={`btn btn-${type}`} onClick={onConfirm}>
-            {confirmText}
-          </button>
-        </div>
-      </div>
-    </div>,
-    document.body
-  )
-}

package/src/components/common/CopyButton.css

@@ -1,22 +0,0 @@
-.copy-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 4px;
-  background: transparent;
-  border: none;
-  color: var(--chat-text-muted, #888);
-  cursor: pointer;
-  border-radius: 4px;
-  transition: all 0.2s;
-}
-
-.copy-btn:hover {
-  background: rgba(255, 255, 255, 0.1);
-  color: var(--chat-text, #fff);
-}
-
-.copy-btn.copied {
-  color: var(--chat-success, #22c55e);
-}
-

package/src/components/common/CopyButton.tsx

@@ -1,46 +0,0 @@
-import { FC, useState, useCallback } from 'react'
-import { Icon } from '@iconify/react'
-import './CopyButton.css'
-
-interface CopyButtonProps {
-  /** 要复制的文本 */
-  text: string
-  /** 按钮标题 */
-  title?: string
-  /** 图标大小 */
-  size?: number
-  /** 复制成功回调 */
-  onCopy?: (text: string) => void
-}
-
-export const CopyButton: FC<CopyButtonProps> = ({
-  text,
-  title = '复制',
-  size = 14,
-  onCopy,
-}) => {
-  const [copied, setCopied] = useState(false)
-
-  const handleCopy = useCallback(async (e: React.MouseEvent) => {
-    e.stopPropagation()
-    try {
-      await navigator.clipboard.writeText(text)
-      setCopied(true)
-      onCopy?.(text)
-      setTimeout(() => setCopied(false), 2000)
-    } catch (err) {
-      console.error('复制失败:', err)
-    }
-  }, [text, onCopy])
-
-  return (
-    <button
-      className={`copy-btn ${copied ? 'copied' : ''}`}
-      title={copied ? '已复制' : title}
-      onClick={handleCopy}
-    >
-      <Icon icon={copied ? 'lucide:check' : 'lucide:copy'} width={size} />
-    </button>
-  )
-}
-

package/src/components/common/IndexingSettings.css

@@ -1,207 +0,0 @@
-.indexing-settings {
-  display: flex;
-  flex-direction: column;
-  gap: 0;
-}
-
-/* 索引部分 - 使用标准的 setting-item 样式 */
-.indexing-section {
-  align-items: flex-start;
-}
-
-
-.indexing-content {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  margin-top: 12px;
-  width: 100%;
-  min-width: 0;
-}
-
-/* 进度条 */
-.progress-container {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-
-.progress-bar {
-  width: 100%;
-  height: 4px;
-  background: var(--chat-border, #333);
-  border-radius: 2px;
-  overflow: hidden;
-}
-
-.progress-fill {
-  height: 100%;
-  background: var(--chat-accent, #3b82f6);
-  border-radius: 2px;
-  transition: width 0.3s ease;
-}
-
-.progress-text {
-  font-size: 13px;
-  color: var(--chat-text-muted, #888);
-}
-
-/* 统计信息 */
-.stats-info {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 12px;
-  padding: 8px 0;
-}
-
-.stat-item {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 12px;
-  color: var(--chat-text-muted, #888);
-}
-
-/* 当前文件 */
-.current-file {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 12px;
-  color: var(--chat-text-muted, #888);
-  padding: 6px 8px;
-  background: var(--chat-muted, #2a2a2a);
-  border-radius: 4px;
-  width: 100%;
-  min-width: 0;
-}
-
-.file-path {
-  flex: 1;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  min-width: 0;
-}
-
-/* 操作按钮 */
-.action-buttons {
-  display: flex;
-  gap: 8px;
-}
-
-.action-buttons .edit-btn {
-  margin: 0;
-}
-
-.action-buttons .edit-btn:disabled {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
-.action-buttons .delete-btn {
-  color: #ef4444;
-}
-
-.action-buttons .delete-btn:hover:not(:disabled) {
-  color: #ef4444;
-}
-
-.spinning {
-  animation: spin 1s linear infinite;
-}
-
-@keyframes spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-.spinning {
-  animation: spin 1s linear infinite;
-}
-
-@keyframes spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-/* 设置项 - 复用父组件的样式，但需要覆盖一些 */
-.indexing-settings .setting-item {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 16px 0;
-  border-bottom: 1px solid var(--chat-border, #333);
-}
-
-.indexing-settings .setting-item:last-child {
-  border-bottom: none;
-}
-
-.indexing-settings .setting-info {
-  flex: 1;
-  margin-right: 24px;
-  min-width: 0;
-}
-
-.indexing-settings .setting-label {
-  font-size: 14px;
-  font-weight: 500;
-  color: var(--chat-text, #fff);
-  margin-bottom: 4px;
-}
-
-.indexing-settings .setting-description {
-  font-size: 13px;
-  color: var(--chat-text-muted, #888);
-  line-height: 1.5;
-  margin-bottom: 0;
-}
-
-.link-btn {
-  display: inline;
-  padding: 0;
-  background: transparent;
-  border: none;
-  color: var(--chat-accent, #3b82f6);
-  cursor: pointer;
-  text-decoration: underline;
-  font-size: inherit;
-}
-
-.link-btn:hover {
-  color: var(--chat-accent-hover, #60a5fa);
-}
-
-.indexing-settings .setting-control {
-  flex-shrink: 0;
-}
-
-.edit-btn {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  padding: 6px 12px;
-  font-size: 13px;
-  font-weight: 500;
-  border: 1px solid var(--chat-border, #333);
-  border-radius: 6px;
-  background: transparent;
-  color: var(--chat-text, #fff);
-  cursor: pointer;
-  transition: all 0.15s;
-}
-
-.edit-btn:hover {
-  background: var(--chat-muted, #2a2a2a);
-  border-color: var(--chat-border, #444);
-}
-