Skip to content

docs: Improve Widget Builder and UI Kit Builder documentation#228

Open
juhi-saha wants to merge 47 commits intomainfrom
docs/widget-builder-ui-kit-builder-improvement
Open

docs: Improve Widget Builder and UI Kit Builder documentation#228
juhi-saha wants to merge 47 commits intomainfrom
docs/widget-builder-ui-kit-builder-improvement

Conversation

@juhi-saha
Copy link
Contributor

@juhi-saha juhi-saha commented Feb 10, 2026

Summary

Comprehensive documentation improvements across UI Kit Builder (React, Next.js, React Router) and Widget Builder (HTML, WordPress, Shopify, Wix, Squarespace, Webflow) pages.


UI Kit Builder Changes

Overview Pages (chat-builder/*/overview.mdx)

  • Restructured all 3 platform overview pages (React, Next.js, React Router) with improved layout
  • Added Quick Reference blocks, CardGroup navigation, and cross-links

Integration Pages (chat-builder/*/integration.mdx)

  • Fixed malformed code block indentation causing MDX parsing failures on all 3 platforms
  • Added JavaScript/TypeScript tabs for code examples
  • Added security warnings and best practices
  • Removed malformed JSX comments causing rendering issues

Builder Settings (chat-builder/*/builder-settings.mdx)

  • React: Revamped table format using "Format D" — combined Label + Property into a single "Setting" column (e.g., Typing indicator (typingIndicator))
  • React: Replaced verbose ON/OFF descriptions with concise single-sentence descriptions
  • React: Added <Tip> explaining boolean pattern above Chat Features section
  • React: Renamed "Moderator Controls" section to "Moderation"
  • React: Moved "Blocked message feedback" (moderation) from Core Messaging to Moderation section with corrected label and description
  • React: Reordered Moderation settings: Blocked message feedback → Report Message → Kick Users → Ban Users → Promote/Demote Members
  • React: Renamed Style > "Color" to "Colors"
  • All 3 platforms: Added detailed "What It Does" descriptions for every setting (ON/OFF behavior)
  • All 3 platforms: Fixed malformed JSX comment causing MDX parsing failure

Builder Customisations (chat-builder/*/builder-customisations.mdx)

  • Added 2 new customization examples to all 3 platforms:
    1. Custom Conversation Subtitle — shows online status for users, member count for groups
    2. Custom Send Button — replaces default with branded icon + CSS styling
  • Next.js version includes "use client" directive
  • Examples link to relevant UI Kit component docs

Directory Structure (chat-builder/*/builder-dir-structure.mdx)

  • Improved layout and formatting across all 3 platforms

Sidebar Navigation (docs.json)

  • Updated navigation structure for UI Kit Builder and Widget Builder sections

Widget Builder Changes

Overview Pages (widget/*/overview.mdx)

  • Restructured all 7 platform overview pages to match UI Kit Builder overview format
  • Added "Why Choose CometChat Widget Builder?" section
  • Added Key Features table (identical to UI Kit Builder)
  • Added Supported Platforms list
  • Added "How It Works" section (Design → Copy → Paste for HTML; Design → Install → Configure for WordPress)
  • Added User Interface Preview, Try Live Demo, Get Started, Need Help sections
  • Updated all titles to naming convention: "CometChat Widget Builder For [Platform]"

Shared Widget Snippet (snippets/widget/overview.mdx)

  • Removed legacy "Legacy Widget" card from Next Steps CardGroup

HTML Integration (widget/html/integration.mdxwidget/html/advanced.mdx)

  • Fixed blank page rendering by removing unsupported lines highlight={...} syntax from code blocks

Other Widget Changes

  • widget/html/legacy/ — Reorganized legacy HTML docs
  • widget/wordpress/legacy/ — Reorganized legacy WordPress docs
  • widget/legacy/custom-build.mdx — Added legacy custom build page
  • widget/squarespace/integration.mdx — Updated integration page

Other Changes

  • index.mdx — Homepage improvements
  • ai-agents.mdx, ai-agents/agent-builder/overview.mdx — Minor updates
  • chat-call.mdx, notifications.mdx — Minor updates
  • fundamentals/webhooks-legacy-*.mdx — Split webhooks legacy into separate pages
  • moderation/legacy-extensions.mdx — Minor fix
  • Removed unused images: create-app.png, customize-no-code-widget.png, integrate-no-code.png, review-your-code.png, sign-up.png
  • Added new image: ui-kit-builder-review-export.png

Files Changed

51 files changed across UI Kit Builder, Widget Builder, navigation, and supporting pages.

- Add Quick Reference blocks to all 21 MDX files for AI agents and developers
- Add frontmatter descriptions where missing
- Replace bullet-list Next Steps with CardGroup navigation
- Add JavaScript tabs alongside TypeScript tabs in code examples
- Add security warnings for Auth Key usage on integration pages
- Fix placeholder values (empty strings → descriptive placeholders)
- Add cross-links between related documentation pages
- Standardize tab naming (filename-based → language names)

Files modified:
- Widget Builder: widget/overview.mdx, widget/html/*.mdx, widget/html/legacy/*.mdx
- UI Kit Builder React: chat-builder/react/*.mdx
- UI Kit Builder Next.js: chat-builder/nextjs/*.mdx
- UI Kit Builder React Router: chat-builder/react-router/*.mdx
- Shared snippet: snippets/widget/overview.mdx
- Updated workflow from 6 steps to 5 steps (combined Export and Review)
- Added Review Your Export section with feature toggle explanation
- Added screenshot for the export modal (Step 1 of 3)
- Applied to React, Next.js, and React Router integration pages
… simplified How It Works, and Get Started CTA
- Converted all tables to Format D: Label (propertyName) in Setting column
- Added concise What It Does descriptions matching React reference
- Added boolean pattern Tip above Chat Features section
- Renamed Moderator Controls to Moderation
- Reordered Moderation: Blocked message feedback, Report Message, Kick, Ban, Promote/Demote
- Renamed Color to Colors
- Updated Settings Overview JSON: correct defaults, removed noCode and agent objects
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

1 participant

Comments