@tfdesign/b-end 1.0.18 → 1.0.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tfdesign/b-end",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "private": false,
   "type": "module",
   "description": "TFDS B-end React components + Tailwind v4 theme.css; self-contained npm install (no monorepo clone required).",

package/skills/tfds/components.index.json

@@ -1,7 +1,7 @@
 {
   "system": "b-end",
   "skill": "tfds",
-  "generatedAt": "2026-05-14T12:28:55.593Z",
+  "generatedAt": "2026-05-14T13:46:15.358Z",
   "summary": "B 端 COMPONENTS 37 条 + 列表页模板 4 + PATTERNS 6；import 一律来自 @tfdesign/b-end。",
   "components": [
     {
@@ -5205,6 +5205,11 @@
         "【基础组件复用】凡是平台已有基础组件可承载的类型，Table 内必须直接复用：switch→Switch、checkbox→Checkbox、avatar/avatarText→Avatar、tag→Tag、link/textButton/actions/dragHandle/分页按钮→Button、所有图标→Icon、页容量选择器→Select",
         "【尺寸】cellSize 支持 default / middle / small，按设计稿映射为 12px / 8px / 4px 内边距与对应单元高度",
         "【标题与操作】link、actions 使用 Button 的 text-brand 变体；textButton 使用 Button 的 iconOnly 组合；linkDescription 保留标题+描述双行信息密度",
+        "【标准表格 actions 尾栏定位】只要标准表格使用 type=\"actions\"，该列就是行级决策区，视觉位置必须默认在 table 最右侧尾栏。即使 columns 传入顺序不是最后，Table 渲染时也会把 actions 列归位到尾栏；AI 生成 columns 时应主动把 actions 写在最后，避免读代码时产生误判。",
+        "【标准表格 actions 自适应宽度】actions 尾栏宽度必须由当前页真实操作按钮内容统一计算，只包住“编辑 / 查看 / 更多图标”等可见操作及必要单元格内边距；表头与表体必须共用同一列宽，不能让表头按“操作”两个字单独收窄而和表体错位。actions 不参与普通数据列的 fr 比例分配，禁止留大段空白尾距，也不要用固定大宽度制造对齐假象。",
+        "【标准表格 actions 首屏可见】当页面容器宽度不足、表格发生横向滚动时，actions 尾栏必须自动 sticky 吸附在右侧可视边界，保证“编辑 / 查看 / 更多图标”等行操作在第一屏始终可见。不要要求用户先横向滚到最右才能操作；也不要把操作按钮复制到首列或悬浮到表格外。",
+        "【标准表格 actions 固定列关系】actions 自动吸附是组件默认交互，不依赖 fixedColumnsMode。fixedColumnsMode 只用于额外固定首列或非 actions 尾列；当 actions 与 fixedColumnsMode=\"first\"/\"both\" 同时存在时，首列可固定在左侧，actions 仍固定在右侧，形成左右锚点，服务宽表的扫读与快速决策。",
+        "【标准表格 actions 省略】actions 类型必须直接传完整操作数组，Table 默认只露出前 2 个文字 Button；当存在第 3 个及后续操作时，第 3 个位置自动渲染 Button iconOnly + Icon(dots-horizontal-stroked) 作为更多按钮，禁止把“…”当文字文案渲染。hover/focus 更多按钮会展示所有被省略操作（从原第 3 项开始），省略浮层内的每个选项也必须复用基础 Button，禁止用原生 button、span 或 div 手写操作入口。",
         "【复合内容】avatar、avatarText、image、progress 等类型优先保证内容完整显示，再参与列宽比例伸缩；avatar/avatarText 单元格未传 avatarSrc 时默认按 name/description seed 取本地成员头像，禁止为表格负责人列生成随机外链头像",
         "【分页】pagination 为对象配置，支持 current/pageSize/total/pageSizeOptions/summaryText/displayPages/pageSizeLabel。分页区包含统计文案、页码、翻页箭头和每页条数选择器；页码选中态固定为 bg-brand-50 + text-brand-600 + semibold，数字颜色必须是 Brand 600。",
         "【分页真实数量】预览和模板内不得写死虚假 total。若 dataSource 是完整本地数据，pagination.total 必须等于 dataSource.length，Table 会按 current/pageSize 对 dataSource 自动切片，左侧“10条/20条”、实际展示行数、底部统计范围、总条数和页码数量必须保持一致。若业务使用服务端分页且 total 大于当前页 dataSource.length，需显式传入后端 total，并只传当前页数据。"
@@ -6292,6 +6297,16 @@
           "type": "array",
           "default": []
         },
+        {
+          "name": "multiple",
+          "type": "boolean",
+          "default": true
+        },
+        {
+          "name": "allValue",
+          "type": "string|number",
+          "default": "all"
+        },
         {
           "name": "selectedValues",
           "type": "array"
@@ -6344,8 +6359,9 @@
         "【选型·vs Button】Filter 只用于筛选条件选择/收起/清除；普通动作（提交、取消、导出、新建）仍使用 Button。",
         "【尺寸】固定高度 36px（--size-control-md），左右内距 12px（--spacing-3，对齐 Select md），内容 gap 8px（--spacing-2）；不要随意压缩为 24px 或 32px，以保证和 B 端 Input/Select 默认高度对齐。",
         "【文字】label 使用 semibold 600，value 使用 normal 400；文案建议 label 2-6 字、value 1-8 字，过长值应在业务层截断或改用 Tooltip。",
+        "【全部基准态】options 中 `value` 等于 `allValue`（默认 \"all\"）的选项视为未筛选基准态，兼容旧写法中 label 以“全部”开头的选项；默认推荐文案只写“全部”，触发器呈现为“筛选项 全部”这一类标题+值组合，保持白底常规样式、不显示清除入口；只有选中非“全部”值或显式 selected=true 时才变为品牌绿色筛选态。",
         "【下拉单/多选】传入 options 后点击胶囊展开下拉面板；通过 `multiple` 切换：默认 `multiple={true}` 多选（行尾 checkbox 方框，可同时勾多项）；`multiple={false}` 单选（行尾 ✓，点击即提交并自动关闭面板，再次点击已选项可反选清空）。两种模式都支持 selectedValues 受控、defaultValue 非受控、onChange 回调；点击外部或 Escape 关闭。",
-        "【受控/回调签名】多选：selectedValues 传数组，onChange 返回数组；单选：selectedValues 可传单值或单元素数组，onChange 返回单值（清空时返回 null）。defaultValue 同样支持单值/数组两种形态。",
+        "【受控/回调签名】多选：selectedValues 传数组，onChange 返回数组；单选：selectedValues 可传单值或单元素数组，onChange 返回单值（无“全部”基准值时清空返回 null）。defaultValue 同样支持单值/数组两种形态。",
         "【值展示】未显式传 value 时，单选/多选选中 1 项都展示该项 label，多选选中 ≥2 项展示“已选 N 项”，单选始终最多 1 项 label；显式 value 优先用于自定义展示。",
         "【状态】selected=true 使用品牌浅底 + 品牌描边 + 品牌文字；filled=true 使用中性填充底；disabled=true 使用禁用文字与禁用底，且不可点击。",
         "【图标】无选中值时显示 12px 下拉箭头；closable=true 或已选中且未禁用时显示 16px 清除按钮（视觉与 Select 清除入口一致），点击清空多选值、关闭下拉并触发 onClear，不触发展开。",
@@ -6358,9 +6374,13 @@
           "label": "基础筛选项",
           "code": "<Filter label=\"筛选项\" />"
         },
+        {
+          "label": "全部默认态",
+          "code": "<Filter label=\"筛选项\" options={[{ label: \"全部\", value: \"all\" }, { label: \"平台申请\", value: \"platform\" }, { label: \"外部导入\", value: \"external\" }]} defaultValue=\"all\" />"
+        },
         {
           "label": "多选下拉（默认）",
-          "code": "<Filter label=\"筛选项\" options={[{ label: \"选项一\", value: \"1\" }, { label: \"选项二\", value: \"2\" }]} />"
+          "code": "<Filter label=\"筛选项\" options={[{ label: \"全部\", value: \"all\" }, { label: \"选项一\", value: \"1\" }, { label: \"选项二\", value: \"2\" }]} />"
         },
         {
           "label": "单选下拉",

package/skills/tfds/components.summary.json

@@ -1,7 +1,7 @@
 {
   "system": "b-end",
   "skill": "tfds",
-  "generatedAt": "2026-05-14T12:28:55.593Z",
+  "generatedAt": "2026-05-14T13:46:15.358Z",
   "purpose": "轻量组件与页面模板目录。AI 先读本文件做选型；确定命中组件后，再到 components.index.json 按 id 读取 props / rules / examples。",
   "counts": {
     "total": 47,
@@ -1052,7 +1052,7 @@
         "avatar",
         "avatarText"
       ],
-      "ruleCount": 25,
+      "ruleCount": 30,
       "exampleCount": 12,
       "hasCode": false,
       "detailRef": "components.index.json#table"
@@ -1318,8 +1318,8 @@
         "multiple={false}",
         "selected filter"
       ],
-      "ruleCount": 14,
-      "exampleCount": 15,
+      "ruleCount": 15,
+      "exampleCount": 16,
       "hasCode": false,
       "detailRef": "components.index.json#filter"
     },

package/src/_b_end_runtime/components/Filter.jsx

@@ -7,6 +7,7 @@
  * @prop {string|number|null} [value=null] — 已选值，存在时显示在 label 后
  * @prop {Array<{label:string,value:string|number,disabled?:boolean}>} [options=[]] — 下拉选项
  * @prop {boolean} [multiple=true] — 是否多选；`false` 进入单选模式（点击即提交并关闭面板，行尾用 ✓ 而非 checkbox 方框，触发器仅显示 1 项 label，aria-multiselectable=false）
+ * @prop {string|number} [allValue='all'] — “全部”基准选项 value；该选项视为未筛选态，触发器保持白底常规样式
  * @prop {Array<string|number>|string|number} [selectedValues] — 受控值；多选传数组、单选传单值（也兼容单元素数组）
  * @prop {Array<string|number>|string|number} [defaultValue=[]] — 非受控初始值
  * @prop {function|null} [onChange=null] — 变更回调；多选返回数组，单选返回单值（或 null 已清空）
@@ -37,7 +38,7 @@ const BASE = [
   'inline-flex h-[var(--size-control-md)] shrink-0 items-center justify-center gap-[var(--spacing-2)]',
   'rounded-[var(--radius-full)] border border-solid',
   'px-[var(--spacing-3)]',
-  'text-[var(--text-sm)] leading-[var(--leading-5)] tracking-[var(--tracking-normal)]',
+  '[font-size:var(--text-sm)] leading-[var(--leading-5)] tracking-[var(--tracking-normal)]',
   '[font-family:inherit]',
   'select-none whitespace-nowrap outline-none',
   'transition-all duration-150',
@@ -90,7 +91,7 @@ const PANEL_CLASS = [
 ].join(' ');
 const OPTION_CLASS = [
   'flex min-h-[var(--size-control-md)] cursor-pointer items-center gap-[var(--spacing-2)] px-[var(--spacing-3)] py-[var(--spacing-2)]',
-  'text-[var(--text-sm)] leading-[var(--leading-5)] text-foreground',
+  '[font-size:var(--text-sm)] leading-[var(--leading-5)] text-foreground',
   'transition-colors duration-100',
   'hover:bg-fill',
 ].join(' ');
@@ -131,6 +132,12 @@ function getValueKey(item) {
   return String(item);
 }
 
+function isAllOption(option, allValue) {
+  if (!option) return false;
+  if (getValueKey(option.value) === getValueKey(allValue)) return true;
+  return String(option.label || '').trim().startsWith('全部');
+}
+
 function normalizeOptions(options) {
   const source = Array.isArray(options) && options.length > 0 ? options : [];
   return source
@@ -177,6 +184,7 @@ export default function Filter({
   value = null,
   options = [],
   multiple = true,
+  allValue = 'all',
   selectedValues,
   defaultValue,
   onChange = null,
@@ -195,11 +203,18 @@ export default function Filter({
   const panelRef = useRef(null);
   const normalizedOptions = useMemo(() => normalizeOptions(options), [options]);
   const hasDropdown = normalizedOptions.length > 0;
+  const allOption = useMemo(
+    () => normalizedOptions.find((item) => isAllOption(item, allValue)) || null,
+    [allValue, normalizedOptions],
+  );
+  const fallbackValues = useMemo(
+    () => (allOption ? [allOption.value] : []),
+    [allOption],
+  );
   const isControlled = selectedValues !== undefined;
   const initialValues = useMemo(
-    () => normalizeValueList(defaultValue !== undefined ? defaultValue : []),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [],
+    () => normalizeValueList(defaultValue !== undefined ? defaultValue : fallbackValues),
+    [defaultValue, fallbackValues],
   );
   const [innerValues, setInnerValues] = useState(() => (multiple ? initialValues : initialValues.slice(0, 1)));
   const [open, setOpen] = useState(false);
@@ -209,6 +224,10 @@ export default function Filter({
     width: 180,
     maxHeight: PANEL_MAX_HEIGHT,
   });
+  const isFallbackValue = useCallback(
+    (item) => fallbackValues.some((fallback) => getValueKey(fallback) === getValueKey(item)),
+    [fallbackValues],
+  );
   const currentValues = isControlled
     ? (multiple ? normalizeValueList(selectedValues) : normalizeValueList(selectedValues).slice(0, 1))
     : innerValues;
@@ -220,19 +239,25 @@ export default function Filter({
     () => normalizedOptions.filter((item) => selectedKeySet.has(getValueKey(item.value))),
     [normalizedOptions, selectedKeySet],
   );
+  const effectiveSelectedOptions = useMemo(
+    () => selectedOptions.filter((item) => !isAllOption(item, allValue)),
+    [allValue, selectedOptions],
+  );
+  const hasExplicitValue = value !== null && value !== undefined && value !== '';
   const derivedValue = useMemo(() => {
-    if (value !== null && value !== undefined && value !== '') return value;
+    if (hasExplicitValue) return value;
     if (selectedOptions.length === 1) return selectedOptions[0].label;
     if (!multiple) return null;
     if (selectedOptions.length > 1) return `已选 ${selectedOptions.length} 项`;
     return null;
-  }, [multiple, selectedOptions, value]);
+  }, [hasExplicitValue, multiple, selectedOptions, value]);
   const hasValue = derivedValue !== null && derivedValue !== undefined && derivedValue !== '';
-  const isSelected = selected || selectedOptions.length > 0;
+  const hasEffectiveFilter = effectiveSelectedOptions.length > 0;
+  const isSelected = selected || hasEffectiveFilter;
   const tone = disabled
     ? (isSelected ? 'selectedDisabled' : 'disabled')
     : (isSelected ? 'selected' : (filled ? 'fill' : 'outline'));
-  const showClear = (closable || selectedOptions.length > 0) && !disabled && hasValue;
+  const showClear = !disabled && hasValue && (hasEffectiveFilter || (closable && hasExplicitValue));
 
   const updatePosition = useCallback(() => {
     if (!triggerRef.current) return;
@@ -254,19 +279,30 @@ export default function Filter({
     if (option.disabled) return;
     const optionKey = getValueKey(option.value);
     const exists = selectedKeySet.has(optionKey);
+    if (isAllOption(option, allValue)) {
+      commitValues([option.value], event);
+      if (!multiple) {
+        setOpen(false);
+        triggerRef.current?.focus();
+      }
+      return;
+    }
     if (multiple) {
       const nextValues = exists
-        ? currentValues.filter((item) => getValueKey(item) !== optionKey)
-        : [...currentValues, option.value];
-      commitValues(nextValues, event);
+        ? currentValues.filter((item) => getValueKey(item) !== optionKey && !isFallbackValue(item))
+        : [
+          ...currentValues.filter((item) => !isFallbackValue(item)),
+          option.value,
+        ];
+      commitValues(nextValues.length > 0 ? nextValues : fallbackValues, event);
       return;
     }
-    // 单选：再次点击已选项视为反选；否则替换为该值并关闭面板
-    const nextValues = exists ? [] : [option.value];
+    // 单选：再次点击已选项视为反选回“全部”；否则替换为该值并关闭面板
+    const nextValues = exists ? fallbackValues : [option.value];
     commitValues(nextValues, event);
     setOpen(false);
     triggerRef.current?.focus();
-  }, [commitValues, currentValues, multiple, selectedKeySet]);
+  }, [allValue, commitValues, currentValues, fallbackValues, isFallbackValue, multiple, selectedKeySet]);
 
   const toggleOpen = useCallback(() => {
     if (disabled || !hasDropdown) return;
@@ -283,7 +319,7 @@ export default function Filter({
     event.stopPropagation();
     if (disabled) return;
     if (hasDropdown) {
-      commitValues([], event);
+      commitValues(fallbackValues, event);
       setOpen(false);
     }
     onClear?.(event);
@@ -301,6 +337,13 @@ export default function Filter({
     }
   };
 
+  useEffect(() => {
+    if (isControlled || defaultValue !== undefined || innerValues.length > 0 || fallbackValues.length === 0) {
+      return;
+    }
+    setInnerValues(multiple ? fallbackValues : fallbackValues.slice(0, 1));
+  }, [defaultValue, fallbackValues, innerValues.length, isControlled, multiple]);
+
   useEffect(() => {
     if (!open) return undefined;
     const handlePointerDown = (event) => {

package/src/_b_end_runtime/components/Table.jsx

@@ -1,4 +1,5 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
 import Avatar from './Avatar';
 import Button from './Button';
 import { Checkbox } from './Checkbox';
@@ -17,6 +18,7 @@ import { getTeamAvatarBySeed, getTeamMemberByIndex } from '../teamMembers';
  * avatar / avatarText 单元格未传 avatarSrc 时，会按 name/description 从本地成员头像素材中取默认图片。
  *
  * @prop {Array<object>} [columns=[]] — 列配置，支持 title / key / dataIndex / width / minWidth / align / type / render
+ *   type="actions" 会被自动归位到表格尾栏，并在横向空间不足时 sticky 固定在右侧可视区
  * @prop {Array<object>} [dataSource=[]] — 行数据
  * @prop {'table'|'card-form'} [variant='table'] — 展示类型：table 为标准表格；card-form 为卡片型表单
  * @prop {string|((record: object, index: number) => string|number)} [rowKey='id'] — 行 key
@@ -57,7 +59,7 @@ const DEFAULT_COLUMN_WIDTH = {
   image: 132,
   progress: 164,
   datetime: 180,
-  actions: 152,
+  actions: 104,
   dragHandle: 68,
 };
 
@@ -76,7 +78,7 @@ const MIN_COLUMN_WIDTH = {
   image: 112,
   progress: 132,
   datetime: 156,
-  actions: 132,
+  actions: 96,
   dragHandle: 52,
 };
 
@@ -187,10 +189,18 @@ const CREATOR_NAME = 'flex-1 min-w-0 truncate text-left text-sm font-normal lead
 const AVATAR_TEXT_WRAP = 'flex min-w-0 flex-1 flex-col items-start justify-center gap-1 text-left';
 
 /* ── 操作区 ── */
-const ACTION_WRAP = 'flex w-full min-w-0 items-center justify-start gap-2 pr-3 text-left';
-const MORE_ACTION_BUTTON_CLASS = [
-  // 44x44 hit target per design directive, keep icon at 16px
-  '!size-11 shrink-0 !rounded-md',
+const ACTION_WRAP = 'inline-flex w-max min-w-max items-center justify-start gap-2 text-left';
+const ACTION_OVERFLOW_TRIGGER_CLASS = [
+  ACTION_TEXT_BUTTON_CLASS,
+  '!w-6 !justify-center',
+].join(' ');
+const ACTION_OVERFLOW_PANEL = [
+  'tfds-table-action-overflow',
+  'flex min-w-[112px] flex-col gap-1 rounded-md border border-border-default bg-surface p-1 shadow-lg',
+].join(' ');
+const ACTION_OVERFLOW_BUTTON_CLASS = [
+  '!h-8 !w-full !justify-start !rounded-sm !px-2',
+  '!text-left !text-sm !leading-5',
 ].join(' ');
 const TEXT_BUTTON_ICON_CLASS = [
   '!size-6 shrink-0 !rounded-md !border-transparent !p-0 !text-foreground',
@@ -290,6 +300,21 @@ function normalizeCellSize(cellSize) {
   return 'default';
 }
 
+function isActionsColumn(column) {
+  return normalizeColumnType(column?.type) === 'actions';
+}
+
+function normalizeTableColumns(columns) {
+  if (!Array.isArray(columns) || columns.length === 0) return [];
+  const regularColumns = [];
+  const actionColumns = [];
+  columns.forEach((column) => {
+    if (isActionsColumn(column)) actionColumns.push(column);
+    else regularColumns.push(column);
+  });
+  return [...regularColumns, ...actionColumns];
+}
+
 function getTypeMinHeight(type, sizeKey) {
   return TYPE_MIN_HEIGHT[type]?.[sizeKey] ?? TYPE_MIN_HEIGHT.text[sizeKey];
 }
@@ -304,14 +329,50 @@ function resolveColumnMetrics(column) {
   };
 }
 
-function resolveColumnTrack(column) {
+function getTextVisualWidth(text) {
+  return String(text || '').split('').reduce((sum, char) => (
+    sum + (char.charCodeAt(0) > 255 ? 14 : 7)
+  ), 0);
+}
+
+function getActionColumnWidth(column, rows = []) {
+  const type = normalizeColumnType(column?.type);
+  if (type !== 'actions') return null;
+  const configuredWidth = Number(column.width);
+  if (Number.isFinite(configuredWidth) && configuredWidth > 0) {
+    return configuredWidth;
+  }
+
+  const cellSize = normalizeCellSize(column.cellSize);
+  const horizontalPadding = cellSize === 'small' ? 16 : 24;
+  const gap = 8;
+  const overflowButtonWidth = 24;
+  const labels = rows.flatMap((record) => {
+    const rawValue = column.dataIndex ? record?.[column.dataIndex] : record?.[column.key];
+    const actions = Array.isArray(rawValue) ? rawValue : [];
+    const visibleActions = actions.length > 2 ? actions.slice(0, 2) : actions;
+    const textWidth = visibleActions.reduce((sum, action) => sum + getTextVisualWidth(getActionLabel(action)), 0);
+    const visibleCount = visibleActions.length + (actions.length > 2 ? 1 : 0);
+    const gapWidth = Math.max(0, visibleCount - 1) * gap;
+    const overflowWidth = actions.length > 2 ? overflowButtonWidth : 0;
+    return [horizontalPadding + textWidth + gapWidth + overflowWidth];
+  });
+  const contentWidth = Math.max(0, ...labels);
+  const minWidth = Number(column.minWidth ?? MIN_COLUMN_WIDTH.actions);
+  return Math.ceil(Math.max(minWidth, contentWidth));
+}
+
+function resolveColumnTrack(column, rows) {
+  if (isActionsColumn(column)) {
+    return `${getActionColumnWidth(column, rows)}px`;
+  }
   const { baseWidth, minWidth } = resolveColumnMetrics(column);
   return `minmax(${minWidth}px, ${baseWidth}fr)`;
 }
 
-function buildColumnGridTemplate(columns) {
+function buildColumnGridTemplate(columns, rows) {
   if (!columns.length) return 'minmax(0, 1fr)';
-  return columns.map((column) => resolveColumnTrack(column)).join(' ');
+  return columns.map((column) => resolveColumnTrack(column, rows)).join(' ');
 }
 
 function getColumnTemplateMinWidth(columns) {
@@ -319,10 +380,11 @@ function getColumnTemplateMinWidth(columns) {
   return columns.reduce((sum, column) => sum + resolveColumnMetrics(column).minWidth, 0);
 }
 
-function getPinnedColumnStates(columns, fixedColumnsMode) {
+function getPinnedColumnStates(columns, fixedColumnsMode, rows = []) {
   const states = columns.map(() => null);
+  const hasActionsTail = columns.length > 0 && isActionsColumn(columns[columns.length - 1]);
 
-  if (!columns.length || fixedColumnsMode === 'none') {
+  if (!columns.length || (fixedColumnsMode === 'none' && !hasActionsTail)) {
     return states;
   }
 
@@ -336,12 +398,25 @@ function getPinnedColumnStates(columns, fixedColumnsMode) {
     };
   }
 
-  if (isLastColumnFixed(fixedColumnsMode) && lastColumnIndex > 0) {
-    states[lastColumnIndex] = {
-      side: 'right',
-      offset: 0,
-      edge: 'left',
-    };
+  if ((isLastColumnFixed(fixedColumnsMode) || hasActionsTail) && lastColumnIndex > 0) {
+    let rightPinnedStart = lastColumnIndex;
+    if (hasActionsTail) {
+      while (rightPinnedStart > 0 && isActionsColumn(columns[rightPinnedStart - 1])) {
+        rightPinnedStart -= 1;
+      }
+    }
+
+    let offset = 0;
+    for (let index = lastColumnIndex; index >= rightPinnedStart; index -= 1) {
+      states[index] = {
+        side: 'right',
+        offset,
+        edge: index === rightPinnedStart ? 'left' : null,
+      };
+      offset += isActionsColumn(columns[index])
+        ? getActionColumnWidth(columns[index], rows)
+        : resolveColumnMetrics(columns[index]).minWidth;
+    }
   }
 
   return states;
@@ -729,6 +804,184 @@ function renderProgressValue(value) {
   );
 }
 
+function getActionLabel(action) {
+  return resolveTextValue(action?.label || action?.ariaLabel || action?.tooltip || '更多操作');
+}
+
+function measureActionOverflowPosition(trigger) {
+  if (typeof window === 'undefined') {
+    return { top: 0, left: 0 };
+  }
+  const rect = trigger.getBoundingClientRect();
+  const panelWidth = 112;
+  const top = rect.bottom + 6;
+  const left = Math.min(
+    Math.max(4, rect.left),
+    Math.max(4, window.innerWidth - panelWidth - 4),
+  );
+  return { top, left };
+}
+
+function renderActionButton(action, key, { className = ACTION_TEXT_BUTTON_CLASS, onDone } = {}) {
+  const safeAction = action || {};
+  const label = getActionLabel(safeAction);
+  const handleClick = (event) => {
+    safeAction.onClick?.(event);
+    onDone?.();
+  };
+
+  if (safeAction.href) {
+    return (
+      <Button
+        key={key}
+        as="a"
+        href={safeAction.href}
+        variant="text-brand"
+        size="sm"
+        className={className}
+        onClick={safeAction.onClick}
+        role={onDone ? 'menuitem' : undefined}
+      >
+        <span className={ACTION_FULL_TEXT}>{label}</span>
+      </Button>
+    );
+  }
+
+  return (
+    <Button
+      key={key}
+      type="button"
+      variant="text-brand"
+      size="sm"
+      className={className}
+      disabled={safeAction.disabled}
+      onClick={handleClick}
+      role={onDone ? 'menuitem' : undefined}
+    >
+      <span className={ACTION_FULL_TEXT}>{label}</span>
+    </Button>
+  );
+}
+
+function ActionOverflowMenu({ actions = [] }) {
+  const triggerRef = useRef(null);
+  const panelRef = useRef(null);
+  const closeTimer = useRef(null);
+  const [open, setOpen] = useState(false);
+  const [style, setStyle] = useState({ top: 0, left: 0 });
+
+  const updatePosition = useCallback(() => {
+    if (!triggerRef.current) return;
+    setStyle(measureActionOverflowPosition(triggerRef.current));
+  }, []);
+
+  const clearCloseTimer = useCallback(() => {
+    if (closeTimer.current) {
+      clearTimeout(closeTimer.current);
+      closeTimer.current = null;
+    }
+  }, []);
+
+  const openPanel = useCallback(() => {
+    clearCloseTimer();
+    updatePosition();
+    setOpen(true);
+    requestAnimationFrame(updatePosition);
+  }, [clearCloseTimer, updatePosition]);
+
+  const closePanel = useCallback(() => {
+    clearCloseTimer();
+    closeTimer.current = setTimeout(() => setOpen(false), 120);
+  }, [clearCloseTimer]);
+
+  const closeImmediately = useCallback(() => {
+    clearCloseTimer();
+    setOpen(false);
+  }, [clearCloseTimer]);
+
+  useEffect(() => () => clearCloseTimer(), [clearCloseTimer]);
+
+  useEffect(() => {
+    if (!open) return undefined;
+    const handleScrollOrResize = () => updatePosition();
+    window.addEventListener('scroll', handleScrollOrResize, true);
+    window.addEventListener('resize', handleScrollOrResize);
+    return () => {
+      window.removeEventListener('scroll', handleScrollOrResize, true);
+      window.removeEventListener('resize', handleScrollOrResize);
+    };
+  }, [open, updatePosition]);
+
+  const handleKeyDown = (event) => {
+    if (event.key === 'Enter' || event.key === ' ') {
+      event.preventDefault();
+      if (open) closeImmediately();
+      else openPanel();
+    }
+    if (event.key === 'Escape') {
+      closeImmediately();
+      triggerRef.current?.focus();
+    }
+  };
+
+  const panel = open && typeof document !== 'undefined' ? createPortal(
+    <div
+      ref={panelRef}
+      role="menu"
+      className={ACTION_OVERFLOW_PANEL}
+      data-tfds-component="Table.ActionOverflow"
+      style={{
+        position: 'fixed',
+        top: style.top,
+        left: style.left,
+        zIndex: 9999,
+      }}
+      onMouseEnter={openPanel}
+      onMouseLeave={closePanel}
+    >
+      {actions.map((action, index) => renderActionButton(
+        action,
+        action?.key || `${getActionLabel(action)}-${index}`,
+        { className: ACTION_OVERFLOW_BUTTON_CLASS, onDone: closeImmediately },
+      ))}
+    </div>,
+    document.body,
+  ) : null;
+
+  return (
+    <>
+      <span
+        ref={triggerRef}
+        className="inline-flex"
+        onMouseEnter={openPanel}
+        onMouseLeave={closePanel}
+        onFocus={openPanel}
+        onBlur={closePanel}
+      >
+        <Button
+          type="button"
+          variant="text-brand"
+          size="sm"
+          iconOnly
+          icon={<Icon name="dots-horizontal-stroked" size="sm" />}
+          className={ACTION_OVERFLOW_TRIGGER_CLASS}
+          tooltip={open ? null : '更多操作'}
+          aria-label="更多操作"
+          aria-haspopup="menu"
+          aria-expanded={open || undefined}
+          onClick={(event) => {
+            event.stopPropagation();
+            if (open) closeImmediately();
+            else openPanel();
+          }}
+          onKeyDown={handleKeyDown}
+        />
+      </span>
+      {panel}
+    </>
+  );
+}
+
 function renderActionsValue(value) {
   const items = Array.isArray(value) ? value : [];
 
@@ -736,44 +989,16 @@ function renderActionsValue(value) {
     return null;
   }
 
+  const visibleItems = items.length > 2 ? items.slice(0, 2) : items;
+  const overflowItems = items.length > 2 ? items.slice(2) : [];
+
   return (
     <div className={ACTION_WRAP}>
-      {items.map((action, index) => {
-        const key = action.key || `${action.label || action.iconName || 'action'}-${index}`;
-
-        if (action.kind === 'more') {
-          return (
-            <Button
-              key={key}
-              type="button"
-              variant="text-brand"
-              size="sm"
-              iconOnly
-              icon={<Icon name={action.iconName || 'dots-horizontal-stroked'} size="sm" />}
-              className={[ICON_ONLY_BUTTON_RESET, MORE_ACTION_BUTTON_CLASS].join(' ')}
-              onClick={action.onClick}
-              tooltip={action.tooltip || action.ariaLabel || action.label || '更多操作'}
-              aria-label={action.ariaLabel || action.label || '更多操作'}
-            />
-          );
-        }
-
-        if (action.href) {
-          const label = resolveTextValue(action.label);
-          return (
-            <Button key={key} as="a" href={action.href} variant="text-brand" size="sm" className={ACTION_TEXT_BUTTON_CLASS}>
-              <span className={ACTION_FULL_TEXT}>{label}</span>
-            </Button>
-          );
-        }
-
-        const label = resolveTextValue(action.label);
-        return (
-          <Button key={key} type="button" variant="text-brand" size="sm" className={ACTION_TEXT_BUTTON_CLASS} onClick={action.onClick}>
-            <span className={ACTION_FULL_TEXT}>{label}</span>
-          </Button>
-        );
-      })}
+      {visibleItems.map((action, index) => renderActionButton(
+        action,
+        action?.key || `${getActionLabel(action)}-${index}`,
+      ))}
+      {overflowItems.length > 0 ? <ActionOverflowMenu actions={overflowItems} /> : null}
     </div>
   );
 }
@@ -1136,11 +1361,15 @@ export default function Table({
   const pageSizeOptions = pagination?.pageSizeOptions?.length
     ? pagination.pageSizeOptions
     : [pageSize];
-  const columnTemplate = useMemo(() => buildColumnGridTemplate(columns), [columns]);
-  const columnTemplateMinWidth = useMemo(() => getColumnTemplateMinWidth(columns), [columns]);
+  const displayColumns = useMemo(() => normalizeTableColumns(columns), [columns]);
+  const columnTemplate = useMemo(
+    () => buildColumnGridTemplate(displayColumns, visibleDataSource),
+    [displayColumns, visibleDataSource],
+  );
+  const columnTemplateMinWidth = useMemo(() => getColumnTemplateMinWidth(displayColumns), [displayColumns]);
   const pinnedColumnStates = useMemo(
-    () => getPinnedColumnStates(columns, fixedColumnsMode),
-    [columns, fixedColumnsMode],
+    () => getPinnedColumnStates(displayColumns, fixedColumnsMode, visibleDataSource),
+    [displayColumns, fixedColumnsMode, visibleDataSource],
   );
   const selectValue = Number.isNaN(Number(pageSize)) ? pageSize : Number(pageSize);
   const selectOptions = useMemo(() => {
@@ -1301,9 +1530,9 @@ export default function Table({
       <div className={TABLE_SHELL}>
         <div className={TABLE_VIEWPORT}>
           <div className={TABLE_CONTENT} style={{ minWidth: `${columnTemplateMinWidth}px` }}>
-            <div className={TABLE} role="grid" aria-rowcount={visibleDataSource.length + 1} aria-colcount={columns.length}>
+            <div className={TABLE} role="grid" aria-rowcount={visibleDataSource.length + 1} aria-colcount={displayColumns.length}>
               <div className={HEADER_ROW} role="row" style={{ gridTemplateColumns: columnTemplate }}>
-                {columns.map((column, columnIndex) => (
+                {displayColumns.map((column, columnIndex) => (
                   <div
                     key={column.key || column.dataIndex || column.title}
                     className={[
@@ -1341,7 +1570,7 @@ export default function Table({
                         style={{ gridTemplateColumns: columnTemplate }}
                         data-tfds-component="Table.Row"
                       >
-                        {columns.map((column, columnIndex) => (
+                        {displayColumns.map((column, columnIndex) => (
                           <div
                             key={column.key || column.dataIndex || column.title}
                             className={buildCellClass(

package/src/_b_end_runtime/components/TablePreview.jsx

@@ -50,7 +50,7 @@ const TYPE_WIDTH_MAP = {
   image: 132,
   progress: 164,
   datetime: 180,
-  actions: 152,
+  actions: 104,
   dragHandle: 68,
 };
 
@@ -291,9 +291,11 @@ function buildCellValue(type, index) {
       return pickMockValue(DATETIME_VALUES, index);
     case 'actions':
       return [
-        { key: 'edit', label: index % 2 === 0 ? '编辑配置' : '同步门店信息', onClick: () => {} },
-        { key: 'view', label: index % 2 === 0 ? '查看详情' : '查看完整方案', onClick: () => {} },
-        { key: 'more', kind: 'more', onClick: () => {} },
+        { key: 'edit', label: '编辑', onClick: () => {} },
+        { key: 'view', label: '查看', onClick: () => {} },
+        { key: 'copy', label: '复制', onClick: () => {} },
+        { key: 'offline', label: '下线', onClick: () => {} },
+        { key: 'delete', label: '删除', onClick: () => {} },
       ];
     case 'dragHandle':
       return null;
@@ -362,9 +364,19 @@ function enhanceCellValue(type, value, { rowIndex, column, setRecords, setIntera
           onClick: () => setInteractionMessage(buildActionMessage('查看', rowIndex, columnTitle)),
         },
         {
-          key: 'more',
-          kind: 'more',
-          onClick: () => setInteractionMessage(buildActionMessage('更多操作', rowIndex, columnTitle)),
+          key: 'copy',
+          label: '复制',
+          onClick: () => setInteractionMessage(buildActionMessage('复制', rowIndex, columnTitle)),
+        },
+        {
+          key: 'offline',
+          label: '下线',
+          onClick: () => setInteractionMessage(buildActionMessage('下线', rowIndex, columnTitle)),
+        },
+        {
+          key: 'delete',
+          label: '删除',
+          onClick: () => setInteractionMessage(buildActionMessage('删除', rowIndex, columnTitle)),
         },
       ];
     case 'dragHandle':
@@ -379,7 +391,7 @@ function enhanceCellValue(type, value, { rowIndex, column, setRecords, setIntera
 function buildColumns(controlValues) {
   const tableSize = controlValues.tableSize || 'default';
   const headerCount = Math.max(2, Math.min(6, Number(controlValues.headerCount || 6)));
-  return Array.from({ length: headerCount }, (_, index) => {
+  const columns = Array.from({ length: headerCount }, (_, index) => {
     const type = controlValues[`column${index + 1}Type`] || COLUMN_DEFAULT_TYPES[index] || 'text';
 
     return {
@@ -388,9 +400,12 @@ function buildColumns(controlValues) {
       type,
       cellSize: tableSize,
       dataIndex: `column${index + 1}`,
-      width: TYPE_WIDTH_MAP[type] || 160,
+      width: type === 'actions' ? undefined : TYPE_WIDTH_MAP[type] || 160,
     };
   });
+  const regularColumns = columns.filter((column) => column.type !== 'actions');
+  const actionColumns = columns.filter((column) => column.type === 'actions');
+  return [...regularColumns, ...actionColumns];
 }
 
 function buildRow(index, columns) {

package/src/_b_end_runtime/components.js

@@ -2812,6 +2812,11 @@ export const COMPONENTS = [
       '【基础组件复用】凡是平台已有基础组件可承载的类型，Table 内必须直接复用：switch→Switch、checkbox→Checkbox、avatar/avatarText→Avatar、tag→Tag、link/textButton/actions/dragHandle/分页按钮→Button、所有图标→Icon、页容量选择器→Select',
       '【尺寸】cellSize 支持 default / middle / small，按设计稿映射为 12px / 8px / 4px 内边距与对应单元高度',
       '【标题与操作】link、actions 使用 Button 的 text-brand 变体；textButton 使用 Button 的 iconOnly 组合；linkDescription 保留标题+描述双行信息密度',
+      '【标准表格 actions 尾栏定位】只要标准表格使用 type="actions"，该列就是行级决策区，视觉位置必须默认在 table 最右侧尾栏。即使 columns 传入顺序不是最后，Table 渲染时也会把 actions 列归位到尾栏；AI 生成 columns 时应主动把 actions 写在最后，避免读代码时产生误判。',
+      '【标准表格 actions 自适应宽度】actions 尾栏宽度必须由当前页真实操作按钮内容统一计算，只包住“编辑 / 查看 / 更多图标”等可见操作及必要单元格内边距；表头与表体必须共用同一列宽，不能让表头按“操作”两个字单独收窄而和表体错位。actions 不参与普通数据列的 fr 比例分配，禁止留大段空白尾距，也不要用固定大宽度制造对齐假象。',
+      '【标准表格 actions 首屏可见】当页面容器宽度不足、表格发生横向滚动时，actions 尾栏必须自动 sticky 吸附在右侧可视边界，保证“编辑 / 查看 / 更多图标”等行操作在第一屏始终可见。不要要求用户先横向滚到最右才能操作；也不要把操作按钮复制到首列或悬浮到表格外。',
+      '【标准表格 actions 固定列关系】actions 自动吸附是组件默认交互，不依赖 fixedColumnsMode。fixedColumnsMode 只用于额外固定首列或非 actions 尾列；当 actions 与 fixedColumnsMode="first"/"both" 同时存在时，首列可固定在左侧，actions 仍固定在右侧，形成左右锚点，服务宽表的扫读与快速决策。',
+      '【标准表格 actions 省略】actions 类型必须直接传完整操作数组，Table 默认只露出前 2 个文字 Button；当存在第 3 个及后续操作时，第 3 个位置自动渲染 Button iconOnly + Icon(dots-horizontal-stroked) 作为更多按钮，禁止把“…”当文字文案渲染。hover/focus 更多按钮会展示所有被省略操作（从原第 3 项开始），省略浮层内的每个选项也必须复用基础 Button，禁止用原生 button、span 或 div 手写操作入口。',
       '【复合内容】avatar、avatarText、image、progress 等类型优先保证内容完整显示，再参与列宽比例伸缩；avatar/avatarText 单元格未传 avatarSrc 时默认按 name/description seed 取本地成员头像，禁止为表格负责人列生成随机外链头像',
       '【分页】pagination 为对象配置，支持 current/pageSize/total/pageSizeOptions/summaryText/displayPages/pageSizeLabel。分页区包含统计文案、页码、翻页箭头和每页条数选择器；页码选中态固定为 bg-brand-50 + text-brand-600 + semibold，数字颜色必须是 Brand 600。',
       '【分页真实数量】预览和模板内不得写死虚假 total。若 dataSource 是完整本地数据，pagination.total 必须等于 dataSource.length，Table 会按 current/pageSize 对 dataSource 自动切片，左侧“10条/20条”、实际展示行数、底部统计范围、总条数和页码数量必须保持一致。若业务使用服务端分页且 total 大于当前页 dataSource.length，需显式传入后端 total，并只传当前页数据。',
@@ -3274,6 +3279,8 @@ export const COMPONENTS = [
       { name: 'label', type: 'string', default: '筛选项' },
       { name: 'value', type: 'string|number|null', default: null },
       { name: 'options', type: 'array', default: [] },
+      { name: 'multiple', type: 'boolean', default: true },
+      { name: 'allValue', type: 'string|number', default: 'all' },
       { name: 'selectedValues', type: 'array', default: undefined },
       { name: 'defaultValue', type: 'array', default: [] },
       { name: 'onChange', type: 'function', default: null },
@@ -3298,8 +3305,9 @@ export const COMPONENTS = [
       '【选型·vs Button】Filter 只用于筛选条件选择/收起/清除；普通动作（提交、取消、导出、新建）仍使用 Button。',
       '【尺寸】固定高度 36px（--size-control-md），左右内距 12px（--spacing-3，对齐 Select md），内容 gap 8px（--spacing-2）；不要随意压缩为 24px 或 32px，以保证和 B 端 Input/Select 默认高度对齐。',
       '【文字】label 使用 semibold 600，value 使用 normal 400；文案建议 label 2-6 字、value 1-8 字，过长值应在业务层截断或改用 Tooltip。',
+      '【全部基准态】options 中 `value` 等于 `allValue`（默认 "all"）的选项视为未筛选基准态，兼容旧写法中 label 以“全部”开头的选项；默认推荐文案只写“全部”，触发器呈现为“筛选项 全部”这一类标题+值组合，保持白底常规样式、不显示清除入口；只有选中非“全部”值或显式 selected=true 时才变为品牌绿色筛选态。',
       '【下拉单/多选】传入 options 后点击胶囊展开下拉面板；通过 `multiple` 切换：默认 `multiple={true}` 多选（行尾 checkbox 方框，可同时勾多项）；`multiple={false}` 单选（行尾 ✓，点击即提交并自动关闭面板，再次点击已选项可反选清空）。两种模式都支持 selectedValues 受控、defaultValue 非受控、onChange 回调；点击外部或 Escape 关闭。',
-      '【受控/回调签名】多选：selectedValues 传数组，onChange 返回数组；单选：selectedValues 可传单值或单元素数组，onChange 返回单值（清空时返回 null）。defaultValue 同样支持单值/数组两种形态。',
+      '【受控/回调签名】多选：selectedValues 传数组，onChange 返回数组；单选：selectedValues 可传单值或单元素数组，onChange 返回单值（无“全部”基准值时清空返回 null）。defaultValue 同样支持单值/数组两种形态。',
       '【值展示】未显式传 value 时，单选/多选选中 1 项都展示该项 label，多选选中 ≥2 项展示“已选 N 项”，单选始终最多 1 项 label；显式 value 优先用于自定义展示。',
       '【状态】selected=true 使用品牌浅底 + 品牌描边 + 品牌文字；filled=true 使用中性填充底；disabled=true 使用禁用文字与禁用底，且不可点击。',
       '【图标】无选中值时显示 12px 下拉箭头；closable=true 或已选中且未禁用时显示 16px 清除按钮（视觉与 Select 清除入口一致），点击清空多选值、关闭下拉并触发 onClear，不触发展开。',
@@ -3309,7 +3317,8 @@ export const COMPONENTS = [
     ],
     examples: [
       { label: '基础筛选项', code: '<Filter label="筛选项" />' },
-      { label: '多选下拉（默认）', code: '<Filter label="筛选项" options={[{ label: "选项一", value: "1" }, { label: "选项二", value: "2" }]} />' },
+      { label: '全部默认态', code: '<Filter label="筛选项" options={[{ label: "全部", value: "all" }, { label: "平台申请", value: "platform" }, { label: "外部导入", value: "external" }]} defaultValue="all" />' },
+      { label: '多选下拉（默认）', code: '<Filter label="筛选项" options={[{ label: "全部", value: "all" }, { label: "选项一", value: "1" }, { label: "选项二", value: "2" }]} />' },
       { label: '单选下拉', code: '<Filter label="状态" multiple={false} options={[{ label: "全部", value: "all" }, { label: "进行中", value: "running" }, { label: "已完成", value: "done" }]} />' },
       { label: '默认已选（多选）', code: '<Filter label="筛选项" options={options} defaultValue={["1"]} />' },
       { label: '默认已选（单选）', code: '<Filter label="状态" multiple={false} options={options} defaultValue="running" />' },

package/src/_b_end_runtime/preview-registry.jsx

@@ -140,6 +140,7 @@ function SwitchPreview({ variant = 'brand', defaultChecked, disabled }) {
 }
 
 const FILTER_SAMPLE_OPTIONS = [
+  { label: '全部', value: 'all' },
   { label: '选项一', value: 'option-1' },
   { label: '选项二', value: 'option-2' },
   { label: '选项三', value: 'option-3' },
@@ -150,11 +151,11 @@ function FilterPreview({
   disabled = false,
 }) {
   const [singleValues, setSingleValues] = useState(
-    initial === 'selected' ? ['option-1'] : [],
+    initial === 'selected' ? ['option-1'] : ['all'],
   );
 
   useEffect(() => {
-    setSingleValues(initial === 'selected' ? ['option-1'] : []);
+    setSingleValues(initial === 'selected' ? ['option-1'] : ['all']);
   }, [initial]);
 
   return (

package/src/index.d.ts

@@ -961,6 +961,10 @@ export interface FilterProps extends TfdsCommonProps {
   value?: unknown;
   /** array, default: [] */
   options?: unknown[];
+  /** boolean, default: true */
+  multiple?: boolean;
+  /** string|number, default: "all" */
+  allValue?: unknown;
   /** array, default: undefined */
   selectedValues?: unknown[];
   /** array, default: [] */