-
Notifications
You must be signed in to change notification settings - Fork 0
feat(DataTable): add scrolling and sticky header #166
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
feat(DataTable): add scrolling and sticky header #166
Conversation
…aTable component - Introduced DataTableWithScrolling component to demonstrate vertical scrolling and sticky header behavior. - Enhanced DataTablePagination with dynamic height adjustments. - Updated DataTable to support scrolling and improved layout for better user experience. - Added tests for scrolling functionality and initial render of the new component.
|
|
WalkthroughAdds a new server-driven, fixed-height scrollable DataTable story with test scaffolding and URL-synced controls; updates data-table pagination and layout for responsive height and sticky header behavior; bumps Changes
Sequence Diagram(s)sequenceDiagram
participant U as User
participant S as WithScrolling Story
participant L as Route Loader
participant C as Fixed-Height Container
participant H as Sticky Header
participant B as Scrollable Body
participant P as Pagination Controls
rect rgba(200,240,220,0.6)
U->>S: Open story
activate S
S->>L: request server-driven data (loader)
L-->>S: return data
end
rect rgba(220,230,255,0.6)
S->>C: render fixed-height container (CSS var)
C->>H: mount sticky header
C->>B: mount scrollable body (overflow-y)
B-->>C: render rows
C->>P: render pagination / sorting (URL-synced)
P-->>C: update controls
end
S->>S: play() -> run scrolling tests
deactivate S
S-->>U: interactive scrollable table
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes
Possibly related PRs
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro Disabled knowledge base sources:
📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
Comment |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 2
🧹 Nitpick comments (1)
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx (1)
1-2: Replace fixed setTimeout and CSS selectors with Testing Library best practices for better resilience.The test works functionally but has two areas that can be hardened per current Storybook guidance:
Replace CSS selector queries with semantic queries
Instead ofquerySelector('[class*="rounded-md border"]')andquerySelector('[class*="overflow-auto"]'), derive elements from semantic queries:canvas.findByRole('table')and walk to the scroll container, or add a stabledata-testidto the scroll container.Replace setTimeout with waitFor
ThesetTimeout(resolve, 500)andsetTimeout(resolve, 100)calls can be replaced withawait waitFor(() => expect(...))to assert scroll height and sticky positioning without hard-coded delays. This auto-retries until conditions are met or timeout, making tests more robust to render timing variations.These changes align with current Storybook guidance: scope queries to the story canvas with
within(canvasElement), prefer accessible queries likefindByRoleover CSS selectors, usefindBy*for async waits, and usewaitForfor assertions on arbitrary state changes.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (4)
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx(3 hunks)packages/components/package.json(1 hunks)packages/components/src/ui/data-table/data-table-pagination.tsx(2 hunks)packages/components/src/ui/data-table/data-table.tsx(3 hunks)
🧰 Additional context used
📓 Path-based instructions (20)
packages/components/src/ui/**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/form-component-patterns.mdc)
packages/components/src/ui/**/*.tsx: Build on @radix-ui components as the foundation for base UI components
Follow the component composition pattern for UI components that accept form integration
Files:
packages/components/src/ui/data-table/data-table.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursor/rules/form-component-patterns.mdc)
**/*.{tsx,ts}: Props interfaces should be named as ComponentNameProps
Form schemas should be named formSchema or componentNameSchema
Files:
packages/components/src/ui/data-table/data-table.tsxapps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
{apps,packages}/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
{apps,packages}/**/*.{ts,tsx}: Use package name imports for published packages (e.g., import { TextField } from '@lambdacurry/forms/remix-hook-form')
Import from specific entry points (e.g., import { TextField } from '@lambdacurry/forms/remix-hook-form/text-field')
Do not use relative imports across packages (e.g., avoid import { TextField } from '../../packages/components/src/remix-hook-form/text-field')
Order imports: 1) external libraries, 2) internal package imports, 3) cross-package imports, 4) type-only imports (grouped separately)
Files:
packages/components/src/ui/data-table/data-table.tsxapps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
{apps,packages}/**/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
{apps,packages}/**/src/**/*.{ts,tsx}: Use relative imports within the same package (e.g., import { FormControl } from './form')
Use relative imports for sibling directories (e.g., import { Button } from '../ui/button')
Files:
packages/components/src/ui/data-table/data-table.tsxapps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
packages/components/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
packages/components/src/**/*.{ts,tsx}: Always export both component and props type (e.g., export { ComponentName }; export type { ComponentNameProps };)
Use named exports for components for better tree-shaking (e.g., export const ComponentName = ...; avoid default exports)
Avoid default exports for components
Use tree-shaking friendly exports
Files:
packages/components/src/ui/data-table/data-table.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
{apps,packages}/**/src/**/*.{tsx,ts}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
{apps,packages}/**/src/**/*.{tsx,ts}: Use kebab-case for component file names (e.g., text-field.tsx, data-table.tsx)
Match component name in PascalCase to the exported component from the file (e.g., text-field.tsx exports TextField)
Files:
packages/components/src/ui/data-table/data-table.tsxapps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
packages/components/src/ui/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
Don't import from remix-hook-form package in ui components
Files:
packages/components/src/ui/data-table/data-table.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
Avoid circular dependencies
**/*.{ts,tsx}: Indent with 2 spaces, max line width 120, and use single quotes (Biome-enforced)
Use PascalCase for component and type names
Name hooks in camelCase with a use* prefix
Organize imports automatically with Biome
Use named exports only
Files:
packages/components/src/ui/data-table/data-table.tsxapps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
packages/components/src/**
📄 CodeRabbit inference engine (AGENTS.md)
Place all @lambdacurry/forms source under packages/components/src and treat it as the only editable source for the package
Files:
packages/components/src/ui/data-table/data-table.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
**/*.tsx: Keep React components pure and fully typed
Define explicit props interfaces for React components
Use React 19 ref patterns (forwardRef, useImperativeHandle as appropriate)
Files:
packages/components/src/ui/data-table/data-table.tsxapps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
**/*.{ts,tsx,mdx}
📄 CodeRabbit inference engine (AGENTS.md)
Use kebab-case for filenames (e.g., text-field.tsx, data-table-filter/**)
Files:
packages/components/src/ui/data-table/data-table.tsxapps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
packages/**/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Avoid cross-package relative imports in the monorepo
Files:
packages/components/src/ui/data-table/data-table.tsxpackages/components/src/ui/data-table/data-table-pagination.tsx
apps/docs/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
In apps/docs, import from package name instead of relative paths for cross-package dependencies
Files:
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx
apps/docs/src/remix-hook-form/**/*.stories.tsx
📄 CodeRabbit inference engine (.cursor/rules/storybook-testing.mdc)
; always use fetcher.Form with methods.handleSubmit for router integration
apps/docs/src/remix-hook-form/**/*.stories.tsx: Follow the three-phase test pattern in play: default state, invalid submission, then valid submission
Use play functions with @storybook/test utilities (userEvent, expect, canvas/within) for interaction tests
Place decorators on individual stories, not on the meta object
Keep meta configuration minimal (title, component, parameters, tags) and avoid global decorators
Use withReactRouterStubDecorator per story when routing/fetcher behavior is needed; configure routes, loaders, and actions in the decorator
For async elements, use findBy* queries; use queryBy* to assert non-existence; avoid getBy* for async content
Prefer semantic queries (ByRole, ByLabelText, etc.) over CSS selectors or data-testid; avoid CSS selectors when accessible queries exist
Always click an input before clearing; then clear and type
Each story should test one primary workflow; do not bundle multiple unrelated scenarios in a single story
Use step grouping in play for complex workflows
Include required imports for interaction tests: Meta/StoryObj types and { expect, userEvent, within } from @storybook/test; import withReactRouterStubDecorator
Use a controlled form wrapper pattern: useFetcher, useRemixForm with zodResolver(formSchema), RemixFormProvider, and fetcher.Form
Never use a regular
Define Zod schemas and infer types for form data; wire zodResolver into useRemixForm
Test both client-side and server-side validation (loader/action paths) when applicable
Use router decorator configurations suitable to the scenario: loader for server fetch, action for form submissions, or no loader for client-only
Organize and export reusable helper test functions; group related test helpers together
Use role-based queries for portaled UI (listbox/option), open trigger first, query portal via within(document.body), and assert teardown with waitFor
Give triggers of portaled widgets a...
Files:
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx
apps/docs/**
📄 CodeRabbit inference engine (AGENTS.md)
Place Storybook docs, examples, and UI tests in apps/docs
Files:
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx
**/*.stories.@(tsx|mdx)
📄 CodeRabbit inference engine (AGENTS.md)
**/*.stories.@(tsx|mdx): Add stories to exercise states for critical interactions (forms, validation, a11y, filters)
Use per-story decorators as needed for setup
Structure Storybook play tests in three phases (setup, act, assert)
Files:
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx
{package.json,packages/**/package.json,apps/**/package.json}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
Use consistent versioning across packages
Files:
packages/components/package.json
{packages/**/package.json,apps/**/package.json}
📄 CodeRabbit inference engine (.cursor/rules/monorepo-organization.mdc)
Define peerDependencies, dependencies, and devDependencies appropriately in package.json
Files:
packages/components/package.json
packages/components/package.json
📄 CodeRabbit inference engine (.cursor/rules/versioning-with-npm.mdc)
Version bumps for @lambdacurry/forms update packages/components/package.json
Files:
packages/components/package.json
packages/**/package.json
📄 CodeRabbit inference engine (AGENTS.md)
Verify each package’s exports field is correct
Files:
packages/components/package.json
🧠 Learnings (1)
📚 Learning: 2025-09-23T16:19:41.981Z
Learnt from: CR
Repo: lambda-curry/forms PR: 0
File: .cursor/rules/storybook-testing.mdc:0-0
Timestamp: 2025-09-23T16:19:41.981Z
Learning: Applies to apps/docs/src/remix-hook-form/**/*.stories.tsx : Include required imports for interaction tests: Meta/StoryObj types and { expect, userEvent, within } from storybook/test; import withReactRouterStubDecorator
Applied to files:
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx
🧬 Code graph analysis (3)
packages/components/src/ui/data-table/data-table.tsx (2)
packages/components/src/ui/utils/index.ts (1)
cn(4-6)apps/docs/src/remix-hook-form/data-table/data-table-stories.components.tsx (1)
columns(68-147)
apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx (6)
apps/docs/src/remix-hook-form/data-table/data-table-stories.helpers.ts (8)
DataResponse(12-21)useSearchParams(233-233)useMemo(232-232)useFilterSync(228-228)useDataTableFilters(225-225)DataTableFilter(223-223)DataTable(221-221)withReactRouterStubDecorator(234-234)packages/components/src/ui/utils/use-filter-sync.ts (1)
useFilterSync(14-48)packages/components/src/ui/data-table-filter/hooks/use-data-table-filters.tsx (1)
useDataTableFilters(47-397)packages/components/src/ui/data-table/data-table.tsx (1)
DataTable(14-60)apps/docs/src/remix-hook-form/data-table/data-table-stories.test-utils.ts (2)
testInitialRender(11-28)testPagination(105-142)apps/docs/src/lib/storybook/react-router-stub.tsx (1)
withReactRouterStubDecorator(30-55)
packages/components/src/ui/data-table/data-table-pagination.tsx (1)
packages/components/src/ui/utils/index.ts (1)
cn(4-6)
🔇 Additional comments (2)
packages/components/src/ui/data-table/data-table-pagination.tsx (1)
5-5: Responsive pagination layout + height vars look solid.Using
cnto compose the flex layout with--lc-datatable-pagination-heightand hiding the duplicate info label on small screens is consistent with the new table container layout and keeps the controls usable across breakpoints. No functional issues from these changes.Also applies to: 28-32, 34-34
packages/components/src/ui/data-table/data-table.tsx (1)
22-25: Full-height, scrollable layout and sticky header implementation look correct.The CSS variable–based max-height,
h-fullpropagation into the inner table wrapper, sticky header, and full-height empty state all line up and should give the intended scrollable behavior without breaking existing auto-height usages.Also applies to: 38-38, 48-49
| // --- DataTableWithScrolling --- | ||
| function DataTableWithScrolling() { | ||
| // Get the loader data (filtered/paginated/sorted data from server) | ||
| const loaderData = useLoaderData<DataResponse>(); | ||
| const [searchParams, setSearchParams] = useSearchParams(); | ||
|
|
||
| // Initialize data from loader response | ||
| const data = loaderData?.data ?? []; | ||
| const pageCount = loaderData?.meta.pageCount ?? 0; | ||
| const facetedCounts = loaderData?.facetedCounts ?? {}; | ||
|
|
||
| // Convert facetedCounts to the correct type for useDataTableFilters (Map-based) | ||
| const facetedOptionCounts = useMemo(() => { | ||
| const result: Partial<Record<string, Map<string, number>>> = {}; | ||
| Object.entries(facetedCounts).forEach(([col, valueObj]) => { | ||
| result[col] = new Map(Object.entries(valueObj)); | ||
| }); | ||
| return result; | ||
| }, [facetedCounts]); | ||
|
|
||
| // --- Bazza UI Filter Setup --- | ||
| // 1. Initialize filters state with useFilterSync (syncs with URL) | ||
| const [filters, setFilters] = useFilterSync(); | ||
|
|
||
| // --- Read pagination and sorting directly from URL --- | ||
| // Use larger page size to ensure scrolling is needed | ||
| const pageIndex = Number.parseInt(searchParams.get('page') ?? '0', 10); | ||
| const pageSize = Number.parseInt(searchParams.get('pageSize') ?? '20', 10); | ||
| const sortField = searchParams.get('sortField'); | ||
| const sortOrder = (searchParams.get('sortOrder') || 'asc') as 'asc' | 'desc'; | ||
|
|
||
| // --- Pagination and Sorting State --- | ||
| const pagination = { pageIndex, pageSize }; | ||
| const sorting = sortField ? [{ id: sortField, desc: sortOrder === 'desc' }] : []; | ||
|
|
||
| // --- Event Handlers: update URL directly --- | ||
| const handlePaginationChange: OnChangeFn<PaginationState> = (updaterOrValue) => { | ||
| const next = typeof updaterOrValue === 'function' ? updaterOrValue(pagination) : updaterOrValue; | ||
| searchParams.set('page', next.pageIndex.toString()); | ||
| searchParams.set('pageSize', next.pageSize.toString()); | ||
| setSearchParams(searchParams); | ||
| }; | ||
|
|
||
| const handleSortingChange: OnChangeFn<SortingState> = (updaterOrValue) => { | ||
| const next = typeof updaterOrValue === 'function' ? updaterOrValue(sorting) : updaterOrValue; | ||
| if (next.length > 0) { | ||
| searchParams.set('sortField', next[0].id); | ||
| searchParams.set('sortOrder', next[0].desc ? 'desc' : 'asc'); | ||
| } else { | ||
| searchParams.delete('sortField'); | ||
| searchParams.delete('sortOrder'); | ||
| } | ||
| setSearchParams(searchParams); | ||
| }; | ||
|
|
||
| // --- Bazza UI Filter Setup --- | ||
| const bazzaProcessedColumns = useMemo(() => columnConfigs, []); | ||
|
|
||
| // Define a filter strategy (replace with your actual strategy if needed) | ||
| const filterStrategy = 'server' as const; | ||
|
|
||
| // Setup filter actions and strategy (controlled mode) | ||
| const { | ||
| columns: filterColumns, | ||
| actions, | ||
| strategy, | ||
| } = useDataTableFilters({ | ||
| columnsConfig: bazzaProcessedColumns, | ||
| filters, | ||
| onFiltersChange: setFilters, | ||
| faceted: facetedOptionCounts, | ||
| strategy: filterStrategy, | ||
| data, | ||
| }); | ||
|
|
||
| // --- TanStack Table Setup --- | ||
| const table = useReactTable({ | ||
| data, | ||
| columns, | ||
| pageCount, | ||
| state: { | ||
| pagination, | ||
| sorting, | ||
| }, | ||
| onPaginationChange: handlePaginationChange, | ||
| onSortingChange: handleSortingChange, | ||
| getCoreRowModel: getCoreRowModel(), | ||
| getPaginationRowModel: getPaginationRowModel(), | ||
| getSortedRowModel: getSortedRowModel(), | ||
| manualPagination: true, | ||
| manualSorting: true, | ||
| }); | ||
|
|
||
| return ( | ||
| <div className="space-y-4"> | ||
| <div> | ||
| <h1 className="text-2xl font-bold mb-4">Data Table with Scrolling and Sticky Header</h1> | ||
| <p className="text-gray-600 mb-6"> | ||
| This demonstrates the table with vertical scrolling and a sticky header that remains visible while scrolling | ||
| through table rows. The table is contained within a fixed-height container. | ||
| </p> | ||
| </div> | ||
|
|
||
| {/* Bazza UI Filter Interface */} | ||
| <DataTableFilter columns={filterColumns} filters={filters} actions={actions} strategy={strategy} /> | ||
|
|
||
| <div className="h-[500px] overflow-hidden"> | ||
| {/* Data Table */} | ||
| <DataTable table={table} columns={columns.length} pageCount={pageCount} /> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Scrolling story behavior vs docs and pageSize defaults are slightly inconsistent.
The DataTableWithScrolling + WithScrolling story wiring looks correct overall (fixed 500px container, same loader and filter plumbing as the server-driven story), but there are two small inconsistencies:
-
Docs vs actual initial page size
- The story description and
DataTableWithScrollingcomment mention using a larger page size (20 rows) to ensure scrolling. - However,
withReactRouterStubDecoratorstill seeds?page=0&pageSize=10, so the story actually starts at 10 rows unless the URL is overridden. - Consider either:
- Passing an explicit
initialPath: '/?page=0&pageSize=20'intowithReactRouterStubDecoratorforWithScrolling, or - Dropping the “20 rows” detail from the description and keeping everything at 10 for consistency.
- Passing an explicit
- The story description and
-
Default pageSize divergence when URL lacks a value
DataTableWithScrollingfalls back topageSize = 20, whileDataTablePaginationfalls back topageSize = 10.- In a context where no
pageSizequery param is present, the table’s pagination state and the pagination UI could disagree. - It would be safer to centralize this default (e.g., via
dataTableRouterParsers.pageSizeor a shared constant) and use the same default in both the table state andDataTablePagination.
These are minor, but aligning the defaults and story description will make the scrolling story more predictable and easier to reason about.
Also applies to: 627-654
🤖 Prompt for AI Agents
In apps/docs/src/remix-hook-form/data-table/data-table-server-driven.stories.tsx
around lines 256 to 368, the story claims a 20-row initial pageSize but the
router decorator seeds ?pageSize=10 and this file falls back to 20 while
DataTablePagination falls back to 10; fix by either updating the WithScrolling
story decorator to use initialPath='/?page=0&pageSize=20' to match the
description, and update the story text/comment to reflect the chosen value, and
centralize the pageSize default by importing/using the shared constant (e.g.,
dataTableRouterParsers.pageSize or a new exported DEFAULT_PAGE_SIZE) in this
file and in DataTablePagination so both fallbacks agree.
| { | ||
| "name": "@lambdacurry/forms", | ||
| "version": "0.22.5", | ||
| "version": "0.23.0-beta.1", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🧩 Analysis chain
Version bump looks good; verify monorepo consistency.
The prerelease bump to "0.23.0-beta.1" is reasonable for the new DataTable behavior. Please just ensure other package manifests, changelogs, and publish scripts are aligned with this version.
🏁 Script executed:
#!/bin/bash
# From repo root, check for other versions that may need to align.
echo 'Package versions referencing @lambdacurry/forms:'
rg -n '"@lambdacurry/forms"' apps packages
echo
echo 'All version fields in package.json files:'
fd package.json -a apps packages | xargs -I{} jq -r '.name + "@" + .version' {}Length of output: 278
---
🏁 Script executed:
```shell
#!/bin/bash
# Check for CHANGELOG files and publish scripts
echo "=== CHANGELOG files in monorepo ==="
fd -i 'changelog|release|history' -e md -e txt
echo
echo "=== Publish/release scripts ==="
fd 'publish|release' -e sh -e js -e ts packages apps
echo
echo "=== Check for version references in root ==="
cat package.json 2>/dev/null | jq -r '.version // "no root version"' || echo "no root package.json"
Length of output: 153
---
🏁 Script executed:
```shell
#!/bin/bash
# Check CHANGELOG.md for 0.23.0-beta.1 entry
echo "=== First 50 lines of packages/components/CHANGELOG.md ==="
head -50 packages/components/CHANGELOG.md
echo
echo "=== Search for 0.23.0 in CHANGELOG ==="
grep -n "0.23.0" packages/components/CHANGELOG.md || echo "No 0.23.0 found in CHANGELOG"
Length of output: 565
Update CHANGELOG.md with 0.23.0-beta.1 entry.
The version bump to 0.23.0-beta.1 in package.json is correct, and dependency references are properly aligned. However, packages/components/CHANGELOG.md is missing an entry for this version—the most recent entry is 0.22.2. Add a new section documenting the changes for 0.23.0-beta.1.
🤖 Prompt for AI Agents
In packages/components/package.json around line 3, the version was bumped to
0.23.0-beta.1 but packages/components/CHANGELOG.md lacks an entry for that
version; open packages/components/CHANGELOG.md and add a new top section for
0.23.0-beta.1 with date and a brief list of changes (copy relevant release notes
or summarize commits since 0.22.2), following the existing changelog format and
ordering so the new entry appears above 0.22.2.
… for consistency in dependency management
e670350 to
8a4aa5e
Compare
Summary by CodeRabbit
New Features
Documentation
Tests
Chores