@yoka-ui/ui 1.0.10-test → 1.1.0

package/dist/lib/business/YkLoginModule/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/business/YkLoginModule/index.tsx"],
+  "sourcesContent": ["import { LoginForm } from '@ant-design/pro-form';\nimport { Flex, message, QRCode, Tabs } from 'antd';\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport SmsLoginForm, { type SmsLoginFormApi } from './SmsLoginForm';\nimport styles from './styles.module.less';\n\nexport type LoginType = 'qrcode' | 'sms';\n\nexport type LoginTabItem = {\n  key: LoginType;\n  label: React.ReactNode;\n};\n\nexport type QrcodeApi = {\n  getQrcode: () => Promise<{ qrcode: string; url: string }>;\n  scanLogin: (qrcode: string) => Promise<{\n    code: number;\n    data?: {\n      status?: number;\n      msg?: string;\n    };\n  }>;\n};\n\nexport type LoginModuleProps = {\n  title: React.ReactNode;\n  tabs: LoginTabItem[];\n  defaultLoginType: LoginType;\n  containerStyle?: React.CSSProperties;\n  actions?: React.ReactNode | ((loginType: LoginType) => React.ReactNode);\n  className?: string;\n  formClassName?: string;\n  tabsClassName?: string;\n  inputClassName?: string;\n  qrcodeClassName?: string;\n  qrcodeBoxClassName?: string;\n\n  onFinish: (values: Record<string, unknown>) => Promise<void>;\n\n  qrcode?: {\n    api: QrcodeApi;\n    icon: string;\n    iconSize?: number;\n    size?: number;\n    wrapStyle?: React.CSSProperties;\n    onSuccess: () => void | Promise<void>;\n  };\n\n  sms?: {\n    api: SmsLoginFormApi;\n    appKey: string;\n  };\n};\n\nconst DEFAULT_QRCODE_WRAP_STYLE: React.CSSProperties = {\n  padding: 10,\n  display: 'flex',\n  justifyContent: 'center',\n};\n\nconst LoginModule: React.FC<LoginModuleProps> = (props) => {\n  const {\n    title,\n    tabs,\n    defaultLoginType,\n    containerStyle,\n    actions,\n    onFinish,\n    qrcode,\n    className = styles.root,\n    formClassName = styles.form,\n    tabsClassName = styles.tabs,\n    inputClassName,\n    qrcodeClassName = styles.qrcode,\n    qrcodeBoxClassName = styles.qrcodeBox,\n    sms,\n  } = props;\n\n  const [loginType, setLoginType] = useState<LoginType>(defaultLoginType);\n\n  const [qrcodeStatus, setQrcodeStatus] = useState<'active' | 'expired' | 'loading'>('active');\n  const [qrcodeUrl, setQrcodeUrl] = useState<string>('-');\n  const [qrcodeValue, setQrcodeValue] = useState<string>('');\n  const pollIntervalRef = useRef<ReturnType<typeof setInterval> | null>(null);\n  const pollTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const shouldShowSubmitter = loginType !== 'qrcode';\n\n  const resolvedActions = useMemo(() => {\n    if (!actions) return undefined;\n    return typeof actions === 'function' ? actions(loginType) : actions;\n  }, [actions, loginType]);\n\n  const safeClearTimers = useCallback(() => {\n    if (pollIntervalRef.current) clearInterval(pollIntervalRef.current);\n    if (pollTimeoutRef.current) clearTimeout(pollTimeoutRef.current);\n    pollIntervalRef.current = null;\n    pollTimeoutRef.current = null;\n  }, []);\n\n  const handleQrcodeRefresh = useCallback(async () => {\n    if (!qrcode) return;\n    setQrcodeStatus('loading');\n    try {\n      const res = await qrcode.api.getQrcode();\n      setQrcodeUrl(res.url);\n      setQrcodeValue(res.qrcode);\n      setQrcodeStatus('active');\n    } catch {\n      setQrcodeStatus('expired');\n      message.error('获取二维码失败，请稍后重试');\n    }\n  }, [qrcode]);\n\n  const enabledTabKeys = useMemo(() => new Set(tabs.map((t) => t.key)), [tabs]);\n\n  useEffect(() => {\n    if (enabledTabKeys.has(defaultLoginType)) {\n      setLoginType(defaultLoginType);\n      return;\n    }\n    const fallback = tabs[0]?.key;\n    if (fallback) setLoginType(fallback);\n  }, [defaultLoginType, enabledTabKeys, tabs]);\n\n  useEffect(() => {\n    if (enabledTabKeys.has(loginType)) return;\n    const fallback = tabs[0]?.key;\n    if (fallback) setLoginType(fallback);\n  }, [enabledTabKeys, loginType, tabs]);\n\n  // 切到扫码登录时刷新二维码；离开扫码登录时停止轮询并标记过期\n  useEffect(() => {\n    safeClearTimers();\n    if (loginType !== 'qrcode') {\n      setQrcodeStatus('expired');\n      return;\n    }\n    if (!qrcode) {\n      setQrcodeStatus('expired');\n      return;\n    }\n    void handleQrcodeRefresh();\n    return safeClearTimers;\n  }, [handleQrcodeRefresh, loginType, qrcode, safeClearTimers]);\n\n  // 扫码轮询：仅在二维码“激活 + 有值 + 在扫码 Tab”时启动\n  useEffect(() => {\n    safeClearTimers();\n    if (!qrcode) return;\n    if (loginType !== 'qrcode') return;\n    if (qrcodeStatus !== 'active') return;\n    if (!qrcodeValue) return;\n\n    pollIntervalRef.current = setInterval(() => {\n      void qrcode.api\n        .scanLogin(qrcodeValue)\n        .then((res) => {\n          if (res.code !== 200) return;\n\n          const status = res.data?.status;\n          const msg = res.data?.msg ?? '扫码遇到问题，稍后重试';\n\n          if (status === -1) return;\n          if (status !== 1) {\n            safeClearTimers();\n            setQrcodeStatus('expired');\n            message.error(msg, 3);\n            return;\n          }\n          safeClearTimers();\n          void qrcode.onSuccess();\n        })\n        .catch(() => {\n          // 忽略轮询中的偶发网络错误，保持继续轮询直到超时/成功\n        });\n    }, 1000);\n\n    pollTimeoutRef.current = setTimeout(() => {\n      setQrcodeStatus('expired');\n      safeClearTimers();\n    }, 30000);\n\n    return safeClearTimers;\n  }, [loginType, qrcode, qrcodeStatus, qrcodeValue, safeClearTimers]);\n\n  const tabItems = useMemo(() => tabs.map((t) => ({ key: t.key, label: t.label })), [tabs]);\n\n  return (\n    <div className={className} style={{ maxWidth: '500px' }}>\n      <LoginForm\n        className={formClassName}\n        onFinish={async (values) => {\n          await onFinish(values);\n        }}\n        title={typeof title === 'string' ? <div className={styles.title}>{title}</div> : title}\n        containerStyle={containerStyle}\n        submitter={shouldShowSubmitter ? undefined : (false as const)}\n        actions={resolvedActions}\n      >\n        <Tabs\n          className={tabsClassName}\n          centered\n          activeKey={loginType}\n          onChange={(activeKey) => {\n            const next = activeKey as LoginType;\n            setLoginType(next);\n          }}\n          items={tabItems}\n        />\n\n        {enabledTabKeys.has('qrcode') && loginType === 'qrcode' && qrcode && (\n          <div style={qrcode.wrapStyle ?? DEFAULT_QRCODE_WRAP_STYLE}>\n            <div className={qrcodeBoxClassName}>\n              <Flex justify='center' align='center'>\n                <i className='iconfont icon-saoyisao' style={{ color: '#999999', marginRight: 10, fontSize: 14 }}></i>\n                请使用<span style={{ color: '#0A6BFD' }}>小闪扫码</span>登录\n              </Flex>\n              <QRCode\n                icon={qrcode.icon}\n                iconSize={qrcode.iconSize ?? 50}\n                className={qrcodeClassName}\n                size={qrcode.size ?? 240}\n                value={qrcodeUrl}\n                status={qrcodeStatus}\n                onRefresh={handleQrcodeRefresh}\n              />\n            </div>\n          </div>\n        )}\n\n        {enabledTabKeys.has('sms') && loginType === 'sms' && sms && (\n          <SmsLoginForm inputClassName={inputClassName ?? ''} api={sms.api} appKey={sms.appKey} />\n        )}\n      </LoginForm>\n    </div>\n  );\n};\n\nexport default LoginModule;\n"],
+  "mappings": "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",
+  "names": ["styles", "React", "SmsLoginForm"]
+}

package/dist/lib/business/YkLoginModule/styles.module.less

@@ -0,0 +1,169 @@
+.root {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+
+  :global {
+    @media (max-width: 768px) {
+      .ant-pro-form-login-container {
+        padding: 20px !important;
+        padding-inline: 0;
+        padding-block: 0;
+      }
+    }
+
+    .ant-pro-form-login-container {
+      border: 1px solid #ececec;
+      border-radius: 12px;
+      background: #ffffff;
+
+      .ant-pro-form-login-top {
+        margin-bottom: 54px;
+
+        .ant-pro-form-login-header {
+          justify-content: flex-start;
+          height: 33px;
+          line-height: 33px;
+        }
+      }
+
+      .ant-pro-form-login-main {
+        width: 100% !important;
+        max-width: 500px !important;
+      }
+
+      @media (max-width: 768px) {
+        .ant-pro-form-login-main {
+          width: 100% !important;
+        }
+
+        .ant-form-item-control-input {
+          .ant-input-affix-wrapper {
+            width: 100% !important;
+          }
+        }
+      }
+
+      .ant-pro-form-login-main-other {
+        margin-top: 0;
+      }
+    }
+  }
+}
+
+.title {
+  height: 33px;
+  color: #333333;
+  font-weight: 600;
+  font-size: 24px;
+  line-height: 33px;
+}
+
+.tabs {
+  :global {
+    .ant-tabs-nav {
+      margin: 0 0 30px 0;
+
+      .ant-tabs-nav-wrap {
+        justify-content: left;
+        border-bottom: 1px solid #eeeeee;
+
+        .ant-tabs-nav-list {
+          .ant-tabs-tab {
+            padding: 0 0 15px 0;
+
+            .ant-tabs-tab-btn {
+              color: #666666;
+              font-weight: 400;
+              font-size: 18px;
+              line-height: 25px;
+            }
+
+            &.ant-tabs-tab-active {
+              .ant-tabs-tab-btn {
+                color: #333333;
+                font-weight: 600;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+.form {
+  :global {
+    width: 100%;
+
+    .ant-form-item {
+      margin-bottom: 20px;
+
+      .ant-form-item-row {
+        .ant-form-item-explain-error {
+          font-size: 12px;
+        }
+
+        .ant-form-item-control-input {
+          .ant-input-affix-wrapper {
+            width: 100%;
+            height: 50px;
+            background: #fcfcfc;
+            border: 1px solid #ececec;
+            border-radius: 4px;
+
+            .ant-input-prefix {
+              margin-right: 15px;
+              color: #666;
+              font-size: 20px;
+            }
+
+            input {
+              background: #fcfcfc;
+            }
+          }
+        }
+      }
+    }
+
+    .ant-btn-primary {
+      width: 100%;
+      height: 50px;
+      margin-top: 37px;
+      margin-bottom: 46px;
+      padding: 0;
+      color: #ffffff;
+      font-weight: 600;
+      font-size: 18px;
+      line-height: 50px;
+      background: linear-gradient(131deg, #1d93ff 0%, #0a6bfd 100%);
+      border-radius: 4px;
+    }
+  }
+}
+
+.actions {
+  color: #666666;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 25px;
+}
+
+.qrcodeBox {
+  padding: 20px 24px;
+  border: 1px solid #ececec;
+  border-radius: 12px;
+}
+
+.qrcode {
+  :global {
+    border: none !important;
+  }
+}
+
+.captchaBtn {
+  padding: 0;
+  color: #0a6bfd;
+}
+

package/dist/lib/business/YkPorjectSelect/index.d.ts

@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { type FC } from 'react';
 /** 项目选项项 */
 type OptionItem = {
     /** 项目名称 */

package/dist/lib/business/YkPorjectSelect/index.js

@@ -32,12 +32,12 @@ __export(YkPorjectSelect_exports, {
   default: () => YkPorjectSelect_default
 });
 module.exports = __toCommonJS(YkPorjectSelect_exports);
-var import_TextWithToolTip = __toESM(require("../../components/TextWithToolTip"));
 var import_icons = require("@ant-design/icons");
 var import_antd = require("antd");
 var import_classnames = __toESM(require("classnames"));
 var import_react = __toESM(require("react"));
-var import_react_custom_scrollbars = require("react-custom-scrollbars");
+var import_react_custom_scrollbars_2 = require("react-custom-scrollbars-2");
+var import_TextWithToolTip = __toESM(require("../../components/TextWithToolTip"));
 var import_icon_product = __toESM(require("./icon-product.png"));
 var import_index_module = __toESM(require("./index.module.less"));
 var YkPorjectSelect = ({ value, options, onChange, followedCallback, slot, customShow }) => {
@@ -198,7 +198,7 @@ var YkPorjectSelect = ({ value, options, onChange, followedCallback, slot, custo
       items: tabs
     }
   ), localOptions.length === 0 ? /* @__PURE__ */ import_react.default.createElement(import_antd.Empty, { image: import_antd.Empty.PRESENTED_IMAGE_SIMPLE }) : /* @__PURE__ */ import_react.default.createElement("div", { className: import_index_module.default.ykPorjectSelectListSection }, /* @__PURE__ */ import_react.default.createElement("div", { className: import_index_module.default.contentHeader }, "全部项目"), /* @__PURE__ */ import_react.default.createElement(
-    import_react_custom_scrollbars.Scrollbars,
+    import_react_custom_scrollbars_2.Scrollbars,
     {
       className: import_index_module.default.ykPorjectSelectScrollBarsBox,
       autoHeight: true,

package/dist/lib/business/YkPorjectSelect/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/business/YkPorjectSelect/index.tsx"],
-  "sourcesContent": ["import TextWithTooltip from '@/components/TextWithToolTip';\nimport { SearchOutlined } from '@ant-design/icons';\nimport type { InputRef } from 'antd';\nimport { ConfigProvider, Empty, Flex, Input, Popover, Rate, Tabs, Tooltip } from 'antd';\nimport classNames from 'classnames';\nimport React, { FC, useEffect, useMemo, useRef, useState } from 'react';\nimport { Scrollbars } from 'react-custom-scrollbars';\nimport iconProductDefault from './icon-product.png';\nimport styles from './index.module.less';\n\n/** 项目选项项 */\ntype OptionItem = {\n  /** 项目名称 */\n  label: string;\n  /** 项目 ID */\n  value: string | number;\n  /** 项目图标 URL */\n  icon: string;\n  /** 是否已关注 */\n  followed?: boolean;\n  /** 关注排序索引 */\n  follow_index?: number;\n  /** 是否最近访问 */\n  recent_visit?: boolean;\n  /** 是否已关服 */\n  closed?: boolean;\n};\n\n/** 项目选择器 Props */\ntype PageTypes = {\n  /** 当前选中的项目 ID */\n  value: string | number;\n  /** 项目选项列表 */\n  options: OptionItem[];\n  /** 选中项目变化时的回调 */\n  onChange: (value: string | number) => void;\n  /** 关注/取消关注时的回调 */\n  followedCallback?: (item: OptionItem, bool: boolean) => void;\n  /** 弹层内自定义插槽，渲染在搜索框下方、关注项目上方 */\n  slot?: React.ReactNode;\n  /** 自定义触发元素，替代默认的「图标+名称+下拉箭头」展示 */\n  customShow?: React.ReactNode;\n};\n\n/**\n * 项目选择器\n *\n * 支持搜索、关注/取消关注（最多6个）、在营/关服切换。\n * 弹层展开时自动聚焦搜索框，使用 preventScroll 避免页面滚动。\n *\n * @example\n * ```tsx\n * <YkPorjectSelect\n *   value={projectId}\n *   options={options}\n *   onChange={setProjectId}\n *   followedCallback={(item, followed) => api.follow(item.value, followed)}\n * />\n * ```\n */\nconst YkPorjectSelect: FC<PageTypes> = ({ value, options, onChange, followedCallback, slot, customShow }) => {\n  const [open, setOpen] = useState(false);\n  const [status, setStatus] = useState<string>('1');\n  const [searchKey, setSearchKey] = useState('');\n  const [pageHeight, setPageHeight] = useState<number>(1000);\n  const [localOptions, setLocalOptions] = useState<OptionItem[]>(options);\n  const searchInputRef = useRef<InputRef>(null);\n\n  useEffect(() => {\n    setLocalOptions(options);\n  }, [options]);\n\n  /** 弹层展开时聚焦搜索框，使用 preventScroll 避免浏览器滚动到顶部；延迟等待 Popover 内容挂载 */\n  useEffect(() => {\n    let timer: ReturnType<typeof setTimeout> | undefined;\n    if (open) {\n      timer = setTimeout(() => {\n        searchInputRef.current?.input?.focus({ preventScroll: true });\n      }, 0);\n    }\n    return () => {\n      if (timer !== undefined) {\n        clearTimeout(timer);\n      }\n    };\n  }, [open]);\n\n  /** 在营/关服数量统计 */\n  const stateCount = useMemo(() => {\n    return localOptions.reduce(\n      (acc, item) => {\n        const statusClosed = item.closed ? 2 : 1;\n        if (!acc[statusClosed]) {\n          acc[statusClosed] = 0;\n        }\n        acc[statusClosed] += 1;\n        return acc;\n      },\n      {} as { [key: string]: number },\n    );\n  }, [localOptions]);\n\n  /** 在营/关服 Tab 配置 */\n  const tabs = [\n    { key: '1', label: `在营(${stateCount['1'] || 0})` },\n    { key: '2', label: `关服(${stateCount['2'] || 0})` },\n  ];\n\n  /** 当前选中的项目（用于展示图标与名称） */\n  const activeItem = useMemo(() => {\n    return localOptions.find((item) => item.value === value);\n  }, [localOptions, value]);\n\n  /** 已关注的项目列表（顶部展示、用于计算关注数限制） */\n  const followedOptions = useMemo(() => {\n    return localOptions.filter((item) => item.followed);\n  }, [localOptions]);\n\n  // 切换在营/关服\n  const handleTabChange = (tabKey: string) => {\n    setStatus(tabKey);\n  };\n\n  // 点击关注或取消关注\n  const handleStarChange = async (item: OptionItem, val: number) => {\n    void followedCallback?.(item, val === 1);\n    setLocalOptions((prev) =>\n      prev.map((p) => {\n        if (p.value === item.value) {\n          return { ...p, followed: val === 1 };\n        }\n        return p;\n      }),\n    );\n  };\n\n  const handleResize = () => {\n    const height = window.innerHeight;\n    setPageHeight(height);\n  };\n\n  useEffect(() => {\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n\n  /** 渲染单个项目行（名称、ID、关注星标） */\n  const renderItem = (item: OptionItem) => {\n    const isDisabled = !item.followed && followedOptions.length >= 6;\n    return (\n      <Flex justify='space-between' align='center'>\n        <span className={styles.contentItemSpan} onClick={() => onChange(item.value)}>\n          <img className={styles.contentItemSpanIcon} src={item?.icon ? item.icon : iconProductDefault} />\n          <div className={styles.contentItemSpanDev}>\n            <div className={styles.contentItemSpanProName}>\n              <TextWithTooltip\n                text={item.label}\n                width='100%'\n                maxWidth={175}\n                arrow={true}\n                color='#fff'\n                styles={{ body: { color: '#333' } }}\n              ></TextWithTooltip>\n              {item.recent_visit ? <span className={styles.recentVisit}>最近访问</span> : null}\n            </div>\n            <div className={styles.contentItemSpanProId}>ID: {item.value}</div>\n          </div>\n        </span>\n        <Tooltip\n          title={isDisabled ? '最多关注6个项目' : item.followed ? '取消关注' : '关注'}\n          color='#fff'\n          placement='right'\n          styles={{ body: { color: '#333' } }}\n        >\n          <label\n            className={classNames(styles.contentItemStar, isDisabled && styles.contentItemStarDisabled)}\n            onClick={() => {\n              if (isDisabled) {\n                return;\n              }\n              void handleStarChange(item, item.followed ? 0 : 1);\n            }}\n          >\n            <ConfigProvider\n              theme={{\n                components: {\n                  Rate: {\n                    starBg: '#dcdbdb',\n                  },\n                },\n              }}\n            >\n              <Rate\n                style={{\n                  fontSize: 14,\n                  color: isDisabled ? 'rgba(0, 0, 0, 0.06)' : '#FFB401',\n                  opacity: item.followed || followedOptions.length === 0 ? 1 : 0,\n                }}\n                value={item.followed ? 1 : 0}\n                count={1}\n              />\n            </ConfigProvider>\n          </label>\n        </Tooltip>\n      </Flex>\n    );\n  };\n\n  /** 弹层内容：搜索、slot、关注区、Tab、项目列表 */\n  const content = (\n    <div className={styles.ykPorjectSelectContent}>\n      <div className={styles.ykPorjectSelectHeader}>\n        <Input\n          ref={searchInputRef}\n          className={styles.ykPorjectSelectSearchInput}\n          prefix={<SearchOutlined style={{ color: '#999', marginRight: '10px' }} />}\n          value={searchKey}\n          onChange={(e) => setSearchKey(e.target.value)}\n          allowClear\n          placeholder='请输入项目ID/名称'\n        />\n      </div>\n      {slot && <div className={styles.ykPorjectSelectSoltContainer}>{slot}</div>}\n      <div className={styles.ykPorjectSelectFollowed}>\n        <div className={styles.contentHeader}>关注项目</div>\n        <div className={styles.ykPorjectSelectFollowedList}>\n          {followedOptions.map((item) => (\n            <Tooltip\n              key={item.value}\n              title={\n                <>\n                  <div style={{ fontSize: 14, color: '#555555' }}>{item.label}</div>\n                  <div style={{ fontSize: 12, color: '#999' }}>ID: {item.value}</div>\n                </>\n              }\n              color='#fff'\n              placement='bottomLeft'\n              styles={{ body: { color: '#333' } }}\n            >\n              <div key={item.value} className={styles.ykPorjectSelectFollowedItem}>\n                <img className={styles.ykPorjectSelectFollowedItemIcon} src={item.icon} alt={item.label} />\n                <div className={styles.closeIcon} onClick={() => void handleStarChange(item, 0)} />\n              </div>\n            </Tooltip>\n          ))}\n        </div>\n      </div>\n      <Tabs\n        className={styles.ykPorjectSelectProductPanelTabs}\n        centered\n        onChange={handleTabChange}\n        activeKey={status}\n        items={tabs}\n      ></Tabs>\n      {localOptions.length === 0 ? (\n        <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />\n      ) : (\n        <div className={styles.ykPorjectSelectListSection}>\n          <div className={styles.contentHeader}>全部项目</div>\n          <Scrollbars\n            className={styles.ykPorjectSelectScrollBarsBox}\n            autoHeight\n            autoHide\n            autoHeightMax={Math.min(450, pageHeight - 310)}\n            renderThumbVertical={({ style, ...props }) => (\n              <div {...props} style={{ ...style, background: '#EEEEEE', borderRadius: 3, width: 6 }} />\n            )}\n          >\n            {localOptions\n              .sort((a, b) => (b.recent_visit ? 1 : 0) - (a.recent_visit ? 1 : 0))\n              .map((item) => (\n                <div\n                  key={item.value}\n                  className={classNames(styles.contentItem, item.value === value ? styles.contentItemActive : '')}\n                >\n                  {renderItem(item)}\n                </div>\n              ))}\n          </Scrollbars>\n        </div>\n      )}\n    </div>\n  );\n\n  return (\n    <Popover\n      className={styles.ykPorjectSelect}\n      styles={{ body: { borderRadius: 4, padding: 0 } }}\n      content={content}\n      placement='bottom'\n      trigger='click'\n      open={open}\n      onOpenChange={setOpen}\n      getPopupContainer={(triggerNode: HTMLElement) => triggerNode.parentNode as HTMLElement}\n      autoAdjustOverflow={false}\n    >\n      {customShow ? (\n        customShow\n      ) : (\n        <div className={styles.ykPorjectSelectShow}>\n          <img className={styles.ykPorjectSelectShowIcon} src={activeItem?.icon} alt={activeItem?.label} />\n          <span className={styles.ykPorjectSelectShowText}>{activeItem?.label}</span>\n          <i className='iconfont icon-xiala' />\n        </div>\n      )}\n    </Popover>\n  );\n};\n\nexport default YkPorjectSelect;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { SearchOutlined } from '@ant-design/icons';\nimport type { InputRef } from 'antd';\nimport { ConfigProvider, Empty, Flex, Input, Popover, Rate, Tabs, Tooltip } from 'antd';\nimport classNames from 'classnames';\nimport React, { type FC, useEffect, useMemo, useRef, useState } from 'react';\nimport { Scrollbars } from 'react-custom-scrollbars-2';\nimport TextWithTooltip from '@/components/TextWithToolTip';\nimport iconProductDefault from './icon-product.png';\nimport styles from './index.module.less';\n\n/** 项目选项项 */\ntype OptionItem = {\n  /** 项目名称 */\n  label: string;\n  /** 项目 ID */\n  value: string | number;\n  /** 项目图标 URL */\n  icon: string;\n  /** 是否已关注 */\n  followed?: boolean;\n  /** 关注排序索引 */\n  follow_index?: number;\n  /** 是否最近访问 */\n  recent_visit?: boolean;\n  /** 是否已关服 */\n  closed?: boolean;\n};\n\n/** 项目选择器 Props */\ntype PageTypes = {\n  /** 当前选中的项目 ID */\n  value: string | number;\n  /** 项目选项列表 */\n  options: OptionItem[];\n  /** 选中项目变化时的回调 */\n  onChange: (value: string | number) => void;\n  /** 关注/取消关注时的回调 */\n  followedCallback?: (item: OptionItem, bool: boolean) => void;\n  /** 弹层内自定义插槽，渲染在搜索框下方、关注项目上方 */\n  slot?: React.ReactNode;\n  /** 自定义触发元素，替代默认的「图标+名称+下拉箭头」展示 */\n  customShow?: React.ReactNode;\n};\n\n/**\n * 项目选择器\n *\n * 支持搜索、关注/取消关注（最多6个）、在营/关服切换。\n * 弹层展开时自动聚焦搜索框，使用 preventScroll 避免页面滚动。\n *\n * @example\n * ```tsx\n * <YkPorjectSelect\n *   value={projectId}\n *   options={options}\n *   onChange={setProjectId}\n *   followedCallback={(item, followed) => api.follow(item.value, followed)}\n * />\n * ```\n */\nconst YkPorjectSelect: FC<PageTypes> = ({ value, options, onChange, followedCallback, slot, customShow }) => {\n  const [open, setOpen] = useState(false);\n  const [status, setStatus] = useState<string>('1');\n  const [searchKey, setSearchKey] = useState('');\n  const [pageHeight, setPageHeight] = useState<number>(1000);\n  const [localOptions, setLocalOptions] = useState<OptionItem[]>(options);\n  const searchInputRef = useRef<InputRef>(null);\n\n  useEffect(() => {\n    setLocalOptions(options);\n  }, [options]);\n\n  /** 弹层展开时聚焦搜索框，使用 preventScroll 避免浏览器滚动到顶部；延迟等待 Popover 内容挂载 */\n  useEffect(() => {\n    let timer: ReturnType<typeof setTimeout> | undefined;\n    if (open) {\n      timer = setTimeout(() => {\n        searchInputRef.current?.input?.focus({ preventScroll: true });\n      }, 0);\n    }\n    return () => {\n      if (timer !== undefined) {\n        clearTimeout(timer);\n      }\n    };\n  }, [open]);\n\n  /** 在营/关服数量统计 */\n  const stateCount = useMemo(() => {\n    return localOptions.reduce(\n      (acc, item) => {\n        const statusClosed = item.closed ? 2 : 1;\n        if (!acc[statusClosed]) {\n          acc[statusClosed] = 0;\n        }\n        acc[statusClosed] += 1;\n        return acc;\n      },\n      {} as { [key: string]: number },\n    );\n  }, [localOptions]);\n\n  /** 在营/关服 Tab 配置 */\n  const tabs = [\n    { key: '1', label: `在营(${stateCount['1'] || 0})` },\n    { key: '2', label: `关服(${stateCount['2'] || 0})` },\n  ];\n\n  /** 当前选中的项目（用于展示图标与名称） */\n  const activeItem = useMemo(() => {\n    return localOptions.find((item) => item.value === value);\n  }, [localOptions, value]);\n\n  /** 已关注的项目列表（顶部展示、用于计算关注数限制） */\n  const followedOptions = useMemo(() => {\n    return localOptions.filter((item) => item.followed);\n  }, [localOptions]);\n\n  // 切换在营/关服\n  const handleTabChange = (tabKey: string) => {\n    setStatus(tabKey);\n  };\n\n  // 点击关注或取消关注\n  const handleStarChange = async (item: OptionItem, val: number) => {\n    void followedCallback?.(item, val === 1);\n    setLocalOptions((prev) =>\n      prev.map((p) => {\n        if (p.value === item.value) {\n          return { ...p, followed: val === 1 };\n        }\n        return p;\n      }),\n    );\n  };\n\n  const handleResize = () => {\n    const height = window.innerHeight;\n    setPageHeight(height);\n  };\n\n  useEffect(() => {\n    window.addEventListener('resize', handleResize);\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n\n  /** 渲染单个项目行（名称、ID、关注星标） */\n  const renderItem = (item: OptionItem) => {\n    const isDisabled = !item.followed && followedOptions.length >= 6;\n    return (\n      <Flex justify='space-between' align='center'>\n        <span className={styles.contentItemSpan} onClick={() => onChange(item.value)}>\n          <img className={styles.contentItemSpanIcon} src={item?.icon ? item.icon : iconProductDefault} />\n          <div className={styles.contentItemSpanDev}>\n            <div className={styles.contentItemSpanProName}>\n              <TextWithTooltip\n                text={item.label}\n                width='100%'\n                maxWidth={175}\n                arrow={true}\n                color='#fff'\n                styles={{ body: { color: '#333' } }}\n              ></TextWithTooltip>\n              {item.recent_visit ? <span className={styles.recentVisit}>最近访问</span> : null}\n            </div>\n            <div className={styles.contentItemSpanProId}>ID: {item.value}</div>\n          </div>\n        </span>\n        <Tooltip\n          title={isDisabled ? '最多关注6个项目' : item.followed ? '取消关注' : '关注'}\n          color='#fff'\n          placement='right'\n          styles={{ body: { color: '#333' } }}\n        >\n          <label\n            className={classNames(styles.contentItemStar, isDisabled && styles.contentItemStarDisabled)}\n            onClick={() => {\n              if (isDisabled) {\n                return;\n              }\n              void handleStarChange(item, item.followed ? 0 : 1);\n            }}\n          >\n            <ConfigProvider\n              theme={{\n                components: {\n                  Rate: {\n                    starBg: '#dcdbdb',\n                  },\n                },\n              }}\n            >\n              <Rate\n                style={{\n                  fontSize: 14,\n                  color: isDisabled ? 'rgba(0, 0, 0, 0.06)' : '#FFB401',\n                  opacity: item.followed || followedOptions.length === 0 ? 1 : 0,\n                }}\n                value={item.followed ? 1 : 0}\n                count={1}\n              />\n            </ConfigProvider>\n          </label>\n        </Tooltip>\n      </Flex>\n    );\n  };\n\n  /** 弹层内容：搜索、slot、关注区、Tab、项目列表 */\n  const content = (\n    <div className={styles.ykPorjectSelectContent}>\n      <div className={styles.ykPorjectSelectHeader}>\n        <Input\n          ref={searchInputRef}\n          className={styles.ykPorjectSelectSearchInput}\n          prefix={<SearchOutlined style={{ color: '#999', marginRight: '10px' }} />}\n          value={searchKey}\n          onChange={(e) => setSearchKey(e.target.value)}\n          allowClear\n          placeholder='请输入项目ID/名称'\n        />\n      </div>\n      {slot && <div className={styles.ykPorjectSelectSoltContainer}>{slot}</div>}\n      <div className={styles.ykPorjectSelectFollowed}>\n        <div className={styles.contentHeader}>关注项目</div>\n        <div className={styles.ykPorjectSelectFollowedList}>\n          {followedOptions.map((item) => (\n            <Tooltip\n              key={item.value}\n              title={\n                <>\n                  <div style={{ fontSize: 14, color: '#555555' }}>{item.label}</div>\n                  <div style={{ fontSize: 12, color: '#999' }}>ID: {item.value}</div>\n                </>\n              }\n              color='#fff'\n              placement='bottomLeft'\n              styles={{ body: { color: '#333' } }}\n            >\n              <div key={item.value} className={styles.ykPorjectSelectFollowedItem}>\n                <img className={styles.ykPorjectSelectFollowedItemIcon} src={item.icon} alt={item.label} />\n                <div className={styles.closeIcon} onClick={() => void handleStarChange(item, 0)} />\n              </div>\n            </Tooltip>\n          ))}\n        </div>\n      </div>\n      <Tabs\n        className={styles.ykPorjectSelectProductPanelTabs}\n        centered\n        onChange={handleTabChange}\n        activeKey={status}\n        items={tabs}\n      ></Tabs>\n      {localOptions.length === 0 ? (\n        <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />\n      ) : (\n        <div className={styles.ykPorjectSelectListSection}>\n          <div className={styles.contentHeader}>全部项目</div>\n          <Scrollbars\n            className={styles.ykPorjectSelectScrollBarsBox}\n            autoHeight\n            autoHide\n            autoHeightMax={Math.min(450, pageHeight - 310)}\n            renderThumbVertical={({ style, ...props }) => (\n              <div {...props} style={{ ...style, background: '#EEEEEE', borderRadius: 3, width: 6 }} />\n            )}\n          >\n            {localOptions\n              .sort((a, b) => (b.recent_visit ? 1 : 0) - (a.recent_visit ? 1 : 0))\n              .map((item) => (\n                <div\n                  key={item.value}\n                  className={classNames(styles.contentItem, item.value === value ? styles.contentItemActive : '')}\n                >\n                  {renderItem(item)}\n                </div>\n              ))}\n          </Scrollbars>\n        </div>\n      )}\n    </div>\n  );\n\n  return (\n    <Popover\n      className={styles.ykPorjectSelect}\n      styles={{ body: { borderRadius: 4, padding: 0 } }}\n      content={content}\n      placement='bottom'\n      trigger='click'\n      open={open}\n      onOpenChange={setOpen}\n      getPopupContainer={(triggerNode: HTMLElement) => triggerNode.parentNode as HTMLElement}\n      autoAdjustOverflow={false}\n    >\n      {customShow ? (\n        customShow\n      ) : (\n        <div className={styles.ykPorjectSelectShow}>\n          <img className={styles.ykPorjectSelectShowIcon} src={activeItem?.icon} alt={activeItem?.label} />\n          <span className={styles.ykPorjectSelectShowText}>{activeItem?.label}</span>\n          <i className='iconfont icon-xiala' />\n        </div>\n      )}\n    </Popover>\n  );\n};\n\nexport default YkPorjectSelect;\n"],
+  "mappings": "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",
   "names": ["React", "styles", "iconProductDefault", "TextWithTooltip", "classNames"]
 }

package/dist/lib/business/YkSqlEdit/code-mirror-custom.module.less

@@ -0,0 +1,154 @@
+.codeMirrorCustom {
+  width: 100%;
+  height: 100%;
+  border: 0.5px solid #ecedf1;
+
+  &.disabled {
+    :global {
+      .cm-activeLine,
+      .cm-activeLineGutter {
+        background-color: transparent !important;
+      }
+    }
+  }
+
+  // CodeMirror 语法高亮样式覆盖
+  :global {
+    color: #888d9d;
+    // 关键字 - 蓝色
+    .ͼb {
+      color: #997bbf !important;
+      font-weight: 400;
+    }
+
+    // 类型名 - 紫色
+    .ͼi {
+      color: #997bbf !important;
+      font-weight: 400;
+    }
+
+    // 字符串 - 绿色
+    .ͼc,
+    .ͼf,
+    .ͼe {
+      color: #9dbd93 !important;
+    }
+
+    // 数字 - 橙色
+    .ͼd {
+      color: #e57271 !important;
+    }
+
+    // 注释 - 灰色
+    .ͼm {
+      color: #999999 !important;
+      font-style: italic;
+    }
+
+    // 变量名 - 黑色
+    .ͼg {
+      color: #000000 !important;
+    }
+
+    // 表名、列名 - 深绿色
+    .ͼh {
+      color: #006633 !important;
+    }
+
+    .cm-dynamic-param {
+      color: #4484d2 !important;
+
+      .ͼi,
+      .ͼb,
+      .ͼc,
+      .ͼd,
+      .ͼe,
+      .ͼf,
+      .ͼg,
+      .ͼh {
+        color: #4484d2 !important;
+      }
+    }
+  }
+}
+
+// 自定义关键词高亮样式
+:global {
+  .cm-custom-keyword {
+    color: #997bbf !important;
+  }
+
+  .cm-editor {
+    outline: none !important;
+  }
+
+  .cm-activeLine {
+    background-color: rgb(204 238 255 / 60%) !important;
+  }
+
+  // 确保自定义关键词在语法高亮之上
+  .cm-editor .cm-line .cm-custom-keyword {
+    position: relative;
+    z-index: 10;
+  }
+}
+
+:global {
+  .cm-scroller {
+    font-size: 12px;
+    background-color: #f9fbfc;
+  }
+
+  .cm-gutters {
+    background-color: #f6f6f9 !important;
+    border: none !important;
+  }
+
+  .cm-gutterElement {
+    color: #999 !important;
+
+    span[title='Fold line'] {
+      display: inline-block;
+      transform: translateY(-5px);
+    }
+  }
+
+  .cm-tooltip {
+    padding: 10px !important;
+    background-color: #fff !important;
+    border: none !important;
+    border-radius: 4px !important;
+    box-shadow: 0 0 10px 0 rgba(154, 153, 153, 0.2);
+
+    .cm-completionLabel {
+      color: #666 !important;
+    }
+
+    .cm-completionMatchedText {
+      color: #ff9600 !important;
+      text-decoration: none !important;
+    }
+  }
+
+  .cm-tooltip-autocomplete ul li {
+    display: flex !important;
+    margin-bottom: 5px !important;
+    line-height: 30px !important;
+    border-radius: 4px !important;
+
+    .cm-completionDetail {
+      margin-left: auto !important;
+      padding-right: 10px !important;
+      color: #999 !important;
+    }
+  }
+
+  .cm-tooltip.cm-tooltip-autocomplete > ul {
+    max-height: 220px !important;
+  }
+
+  .cm-tooltip-autocomplete ul li[aria-selected] {
+    background-color: #f1f8ff !important;
+  }
+}
+

package/dist/lib/business/YkSqlEdit/index.d.ts

@@ -0,0 +1,20 @@
+import { type ReactCodeMirrorRef } from '@uiw/react-codemirror';
+import React from 'react';
+import { type SqlDialectType } from './sql-language';
+export type YkSqlEditProps = {
+    value: string;
+    previewValue?: string;
+    preview?: boolean;
+    placeholder?: string;
+    height?: string;
+    width?: string;
+    onChange: (value: string) => void;
+    datasourceType?: SqlDialectType;
+    keywordOptions?: {
+        keywords: string[];
+        functions: string[];
+    };
+    dataTestId?: string;
+};
+declare const YkSqlEdit: React.ForwardRefExoticComponent<YkSqlEditProps & React.RefAttributes<ReactCodeMirrorRef>>;
+export default YkSqlEdit;