feat(main-page): add MainPage compound component#1148
Merged
ByronDWall merged 14 commits intomainfrom Mar 17, 2026
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
🦋 Changeset detectedLatest commit: f8c44e1 The changes in this PR will be included in the next version bump. This PR includes changesets to release 4 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
ByronDWall
requested review from
a team,
ddouglasz,
jaikamat,
misama-ct,
stephsprinkle,
tylermorrisford and
valoriecarli
and removed request for
a team
ByronDWall
changed the base branch from
main
to
CRAFT-2161-create-page-content-component
ByronDWall
force-pushed
the
CRAFT-2161-create-page-content-component
branch
from
b3cc587 to
a5aaec6
Compare
tylermorrisford
approved these changes
Feb 27, 2026
Contributor
tylermorrisford
left a comment
tylermorrisford
left a comment
There was a problem hiding this comment.
looks really nice
ByronDWall
force-pushed
the
CRAFT-2167-create-main-page-component
branch
from
f74f977 to
8230526
Compare
Base automatically changed from
CRAFT-2161-create-page-content-component
to
main
February 27, 2026 17:14
valoriecarli
approved these changes
Mar 5, 2026
…pe and types Add OpenSpec proposal and core implementation files for PageContent: - Types with Root (variant, columns) and Column (sticky) props - Slot recipe with CSS grid centering and column layout variants - Slot components via createSlotRecipeContext - Root and Column sub-components - Recipe registration and barrel exports CRAFT-2161 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…actStyleProps PageContent does not use React Aria internally, so there is no need to hide `as`, `asChild`, and `css` props from consumers via OmitInternalProps. Slot components handle style props natively, so extractStyleProps splits are also unnecessary. CRAFT-2161 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Fix barrel imports to use modular @chakra-ui/react/styled-system - Remove duplicate sticky CSS from recipe (JS handles it in column component) - Update spec to reflect boolean sticky type with top style prop override - Add SmokeTest story with full variant × columns matrix - Add play function to CustomGap story - Fix overflowY="scroll" to "auto" in dev.mdx Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
… types Create MainPage compound component with Root, Header, Title, Actions, Content, and Footer sub-components. Content wraps PageContent.Root internally, forwarding variant and columns props. Uses CSS grid layout (auto 1fr auto) for the page skeleton with semantic HTML elements (header, h1, main, footer). CRAFT-2167 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Remove OmitInternalProps from MainPage types (no React Aria). Use asChild on Content slot to merge with PageContent.Root, reducing DOM nesting while preserving <main> semantics via as="main". Add Storybook stories covering info page, form page, tabular page, and multi-column content patterns with play functions. CRAFT-2167 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…olumn - MainPage.Title now uses Nimbus Heading (h1) with title and subtitle props, matching AppKit page title styling - Add MainPage.Column (re-export of PageContent.Column) to all docs - Add designer overview (main-page.mdx) with live examples - Add implementation docs (main-page.dev.mdx) with sub-component examples - Add guidelines docs (main-page.guidelines.mdx) with do/don't patterns - Add consumer test examples (main-page.docs.spec.tsx) - Update stories to test each sub-component explicitly Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Fix slots import path to @chakra-ui/react/styled-system - Add tags/parameters to stories meta, use accessible role queries - Add Accessibility section to designer docs (main-page.mdx) - Rename root props to MainPageRootProps with convenience alias - Add JSDoc to all ref properties in types - Update slot docs/templates to use key: pattern matching codebase Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Position title/subtitle in column 1 (left) and actions in column 2 (right) using gridColumn placement. Add custom elements documentation to dev.mdx, fix review issues (duplicate H1, relative link, Badge prop), and update skill templates to remove invalid recipe description field and add exportName to designer docs frontmatter. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
ByronDWall
force-pushed
the
CRAFT-2167-create-main-page-component
branch
from
8230526 to
5a86890
Compare
…ories Replace placeholder boxes with DataTable (fake product data) in InfoPage, and FormField+TextInput/MoneyInput in FormPage and WithFooter stories. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…ries Add Info, Form, and Tabular main page usage examples to dev docs. Update recipe spacing tokens and refactor TabularPage story to place Tabs.Root as outer wrapper with tab list in header. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…ented patterns in main-page.mdx
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
MainPagecompound component for top-level page layouts (replaces AppKit's InfoMainPage, FormMainPage, CustomFormMainPage, TabularMainPage)Test plan
pnpm test packages/nimbus/src/components/main-page/)🤖 Generated with Claude Code