Skip to content

Add Members demo route and styles#56

Draft
developit wants to merge 2 commits intomainfrom
codex/build-demo-ui-in-pui
Draft

Add Members demo route and styles#56
developit wants to merge 2 commits intomainfrom
codex/build-demo-ui-in-pui

Conversation

@developit
Copy link
Copy Markdown
Owner

Motivation

  • Provide a new Members management demo route that reproduces the target UI as a demo page in the app routing system.
  • Reuse existing PUI primitive components to keep runtime cost low and follow CSS-driven variants for styling.
  • Minimize custom JavaScript logic and rely on scoped CSS for layout and visual parity with the reference.

Description

  • Add demo/src/routes/members.tsx containing the Members demo markup using Avatar, Badge, Button, TabList, Tab, and Table from pui.
  • Wire the Members route into the router by lazy-loading it in demo/src/main.tsx and adding a /members Route.
  • Add a navigation entry under Demos in demo/src/nav.tsx linking to the new Members demo.
  • Add scoped demo styles to demo/src/style.css to implement the sidebar, card, tabs, table, and floating chat button visuals.

Testing

  • Started the demo dev server with pnpm --dir demo dev -- --host 0.0.0.0 --port 4173, and Vite reported ready (local server start succeeded).
  • Attempted an automated Playwright screenshot of http://localhost:5173/members, but the browser failed to launch / connect (Playwright errors and crashes), so no screenshot was produced.
  • No unit or CI tests were executed as part of this change.

Codex Task

@netlify
Copy link
Copy Markdown

netlify bot commented Jan 11, 2026

Deploy Preview for pui-demo ready!

Name Link
🔨 Latest commit 837503b
🔍 Latest deploy log https://app.netlify.com/projects/pui-demo/deploys/69924571d8fcb40008529cd4
😎 Deploy Preview https://deploy-preview-56--pui-demo.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Jan 11, 2026

Size Change: 0 B

Total Size: 11.3 kB

ℹ️ View Unchanged
Filename Size
dist/index.css 6.22 kB
dist/index.js 5.06 kB

compressed-size-action

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

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant