feat(tables): add remark plugin to tag wide table columns

[jp-ayyappan]

Summary

• Add a remark plugin (remark-table-wide-cells) that detects markdown table columns where any cell exceeds 100 characters and tags all cells in those columns with a wide-cell CSS class
• Tagged columns get white-space: normal; word-break: break-word so long text wraps, while short columns stay compact with nowrap
• Base table styling uses overflow-x: auto so genuinely wide tables still scroll horizontally
• OpenAPI-generated tables are unaffected (rendered at the theme layer, not by remark)

Test plan

• Run npm start and confirm the build succeeds
• Navigate to markdown pages with tables — short columns should stay compact, long columns should wrap
• Confirm a horizontal scrollbar appears if a table is still wider than the viewport
• Verify OpenAPI spec pages are unaffected
• Test in both light and dark themes

🤖 Generated with Claude Code

[gemini-code-assist]

Summary of Changes

Hello, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request enhances the display of markdown tables within Docusaurus documentation by intelligently handling long cell content. It introduces a mechanism to identify and style wide table columns, ensuring text wraps appropriately without affecting the compactness of other columns, while maintaining overall table responsiveness through horizontal scrolling. This improves readability and user experience for tables containing extensive data.

Highlights

• New Remark Plugin: A new remark-table-wide-cells plugin has been added to automatically detect markdown table columns where any cell's content exceeds 100 characters and apply a wide-cell CSS class to all cells in those columns.
• Targeted Word Wrapping: CSS rules have been introduced to apply white-space: normal; word-break: break-word specifically to cells tagged with wide-cell, allowing long text to wrap while keeping shorter columns compact with nowrap.
• Table Responsiveness: Base table styling now includes overflow-x: auto to ensure that genuinely wide tables remain horizontally scrollable, preventing layout issues.
• Configuration Update: The Docusaurus configuration has been updated to integrate the new remark-table-wide-cells plugin into the docs plugin's remark processing pipeline.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Changelog

• docusaurus.config.ts
  • Configured the Docusaurus docs plugin to use the new remark-table-wide-cells plugin with a default threshold of 100 characters.
• plugins/remark-table-wide-cells.js
  • Created a new Remark plugin that identifies table columns where any cell's text content exceeds a specified character threshold (defaulting to 100).
  • Implemented logic to apply the wide-cell CSS class to all cells within identified wide columns.
  • Included a helper function extractText to recursively get plain text from MDAST nodes.
• src/css/custom.css
  • Added new CSS rules for .markdown table to ensure horizontal scrolling (overflow-x: auto) and prevent default wrapping (white-space: nowrap).
  • Defined styles for .markdown table td.wide-cell and .markdown table th.wide-cell to enable word-wrapping (white-space: normal; word-break: break-word) and set a min-width for tagged wide cells.

Activity

• No human activity has occurred on this pull request yet.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request introduces a new Remark plugin, remark-table-wide-cells, to improve the readability of markdown tables with long content. The plugin identifies columns containing cells that exceed a character threshold and applies a wide-cell CSS class to them. Accompanying CSS changes then enable word wrapping for these specific columns, while keeping other columns compact. The implementation is solid. I've added a couple of suggestions to the plugin to improve performance and robustness.

[github-actions]

📄 Preview deployed to https://opentdf-docs-pr-238.surge.sh