You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
refactor: rename variant and enum values to shared names - #978
Rename variant values to the names other components use: Input, TextArea and Search take outline and text (were default and borderless), FilterChip takes outline (was default), and Chip takes solid (was filled).
Rename EmptyState variants after their layouts: empty1 is compact and empty2 is page.
Grid takes align and justify in place of alignItems and justifyContent, as Flex does. justify and alignContent take between, around and evenly in place of the space-* values. alignContent and justifyItems keep their names.
CalendarPreview names the half-year scale half-year (was halfYear) in scales, scale, defaultScale, onScaleChange, value objects and data-scale.
Update the internal users (Command, Editor link form, PromptInput, FilterChip), docs, playgrounds, Figma templates and tests, and add an Upgrading section with the old and new values.
Decisions
EmptyState names: compact is the centered layout with stacked actions for panels and lists. page is the full-page layout with left-aligned content, a larger icon and actions in a row. The docs already describe them this way, and the CSS calls the second one emptyStatePage.
CSS classes follow <prop>-<value>: FilterChip chip-default is variant-outline, and Chip's private --chip-filled-* variables are --chip-solid-*. Computed styles do not change.
The Search props table gets the variant row it was missing.
docs/V1-migration.md and docs/rfcs/005-calendar-preview.md keep the old names, because they describe earlier releases.
Flex direction (rowReverse, columnReverse) and wrap (noWrap, wrapReverse) values are camelCase, but the proposal does not list them, so they do not change here.
Checks
pnpm lint, pnpm exec tsc --noEmit in packages/react, pnpm test:apsara (3724 tests) and pnpm build:apsara pass.
Compared the docs pages against apsara.raystack.org: Input, TextArea, Search, FilterChip, Chip, EmptyState, Grid, CalendarPreview, Command, Editor and PromptInput in light, and TextArea, Search, FilterChip, Chip, EmptyState and Grid in dark. The computed styles of every demo match. The Chip, TextArea, FilterChip, EmptyState and Grid playgrounds render the new values with the same styles as the old ones. The Upgrading page renders.
No actionable comments were generated in the recent review.
Walkthrough
The change renames variants for Input, TextArea, Search, FilterChip, Chip, and EmptyState. It renames Grid alignment props and values, and changes the CalendarPreview half-year scale identifier to half-year. Component implementations, CSS selectors, Figma mappings, tests, demos, and documentation are updated to use the revised names. The upgrade guide documents the renamed values and notes the handling of unknown scale names and stored halfYear values.
Suggested reviewers:shreyag02
Merge Risk: Minimal · previous review 5499f
The renamed APIs require migration, but no material merge-blocking issue is known.
Pre-merge checks: 5
Check name
Status
Explanation
Title check
The title describes the main change: renaming component variant and enum values.
Description check
The description covers the renamed values, Grid props, documentation, and tests.
Docstring Coverage
Docstring coverage is inconclusive: files from earlier reviews still need to be rechecked within the check's analysis limits. Not blocking.
Linked Issues check
Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check
Check skipped because no linked issues were found for this pull request.
Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.
Included review availability: This review used your included allowance. Your plan provides up to 1 included review per hour; 0 remain after this review.
The reason will be displayed to describe this comment to others. Learn more.
suggestion: packages/react/CHANGELOG.md keeps an "Unreleased" list with a (BREAKING) entry for each breaking change (#919 added one next to its Upgrading section). Could we add one for these renames too, so the changelog stays complete for the release?
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
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
variantvalues to the names other components use:Input,TextAreaandSearchtakeoutlineandtext(weredefaultandborderless),FilterChiptakesoutline(wasdefault), andChiptakessolid(wasfilled).EmptyStatevariants after their layouts:empty1iscompactandempty2ispage.Gridtakesalignandjustifyin place ofalignItemsandjustifyContent, asFlexdoes.justifyandalignContenttakebetween,aroundandevenlyin place of thespace-*values.alignContentandjustifyItemskeep their names.CalendarPreviewnames the half-year scalehalf-year(washalfYear) inscales,scale,defaultScale,onScaleChange, value objects anddata-scale.Decisions
EmptyStatenames:compactis the centered layout with stacked actions for panels and lists.pageis the full-page layout with left-aligned content, a larger icon and actions in a row. The docs already describe them this way, and the CSS calls the second oneemptyStatePage.<prop>-<value>: FilterChipchip-defaultisvariant-outline, and Chip's private--chip-filled-*variables are--chip-solid-*. Computed styles do not change.variantrow it was missing.docs/V1-migration.mdanddocs/rfcs/005-calendar-preview.mdkeep the old names, because they describe earlier releases.direction(rowReverse,columnReverse) andwrap(noWrap,wrapReverse) values are camelCase, but the proposal does not list them, so they do not change here.Checks
pnpm lint,pnpm exec tsc --noEmitinpackages/react,pnpm test:apsara(3724 tests) andpnpm build:apsarapass.Compared the docs pages against apsara.raystack.org: Input, TextArea, Search, FilterChip, Chip, EmptyState, Grid, CalendarPreview, Command, Editor and PromptInput in light, and TextArea, Search, FilterChip, Chip, EmptyState and Grid in dark. The computed styles of every demo match. The Chip, TextArea, FilterChip, EmptyState and Grid playgrounds render the new values with the same styles as the old ones. The Upgrading page renders.
I have followed the pull request section of the contributing guide.