Skip to content

feat(theme): support overflow-based frozen column shadows - #5315

Closed
kitee0325 wants to merge 1 commit into
VisActor:developfrom
kitee0325:feat/frozen-shadow-overflow
Closed

kitee0325 wants to merge 1 commit into
VisActor:developfrom
kitee0325:feat/frozen-shadow-overflow

Conversation

@kitee0325

Copy link
Copy Markdown
Contributor

🤔 This is a ...

  • New feature
  • TypeScript definition update
  • Test Case
  • Site / documentation update
  • Demo update

🔗 Related issue link

No existing issue. Related example: https://visactor.io/vtable/demo/basic-functionality/frozen-col

💡 Background and solution

Frozen-column shadows can currently stay visible (always) or follow the scrolling UI (scrolling). Neither mode indicates whether body content is hidden beyond a frozen boundary. A left frozen column can retain a shadow at scrollLeft = 0, while a scrolling shadow disappears after the scrollbar's hide timer even though content is still covered.

Add the opt-in theme.frozenColumnLine.shadow.visible: 'overflow' mode:

  • No frozen columns or no horizontal body overflow: no shadows.
  • Left frozen boundary: show after leaving the horizontal start.
  • Right frozen boundary: show while body content remains to the right; hide at the end.
  • Keep visibility after scrolling stops; update immediately when returning to an edge.
theme: VTable.themes.DEFAULT.extends({
  frozenColumnLine: {
    shadow: {
      width: 8,
      startColor: 'rgba(0, 0, 0, 0.12)',
      endColor: 'rgba(0, 0, 0, 0)',
      visible: 'overflow'
    }
  }
})

Visibility follows the existing body scroll range, including separately scrollable frozen viewports and fractional-width tolerance. Updates run after accepted scroll-position changes and layout updates. Existing gradient rectangles are reused, with no new event subscriptions or timers. The built-in default theme and the behavior of always / scrolling are unchanged.

English and Chinese option docs and frozen-column demos are updated. The documented default is corrected from scrolling to the existing always.

Validation

  • 5 Jest Electron suites, 30 tests passed, including 11 new shadow cases.
  • Covered programmatic/scrollbar movement, no-frozen/no-overflow states, dynamic freezing, resize, theme/updateOption, cancelled scrolling, fractional widths, independently scrollable frozen columns, and PivotTable boundaries.
  • TypeScript compile, ESLint (0 errors; existing warnings), Prettier, Git commit hooks, and rush change --verify --target-branch origin/develop --no-fetch passed.
  • Chromium rendering checked at the start, middle and end, with and without frozen columns.

📝 Changelog

Language Changelog
🇺🇸 English Add opt-in overflow-based frozen column shadow visibility; existing modes and default theme remain unchanged.
🇨🇳 Chinese 新增按内容溢出状态显示冻结列阴影的可选模式,保留现有模式和默认主题行为。

☑️ Self-Check before Merge

  • Doc is updated/provided or not needed
  • Demo is updated/provided or not needed
  • TypeScript definition is updated/provided or not needed
  • Changelog is provided or not needed

🚀 Summary

copilot:summary

🔍 Walkthrough

copilot:walkthrough

Rendering comparison

vtable-frozen-shadow-overflow

@kitee0325

Copy link
Copy Markdown
Contributor Author

@fangsmile 大佬看下是否满足合入条件

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants