Conversation
Owner
gfazioli
commented
Apr 4, 2026
- *** 📦 build(deps): upgrade to Mantine v9, React 19, and modernize tooling**
- *** ♻️ refactor: update source code and tests for Mantine v9 and React 19 compatibility**
- *** ✨ feat(window): add withScrollArea, controlsPosition, and controlsOrder props**
- *** ✅ test(window): add tests and stories for withScrollArea, controlsPosition, and controlsOrder**
* Upgrade @mantine/core and @mantine/hooks to 9.0.0 and update package keyword to mantine-v9 * Replace ESLint with oxlint and Prettier with oxfmt for faster linting and formatting * Upgrade Yarn from 4.12.0 to 4.13.0 and TypeScript to 6.0.2 * Upgrade Storybook from v8 to v10 with updated addons and framework packages * Update Window component, hooks, and WindowGroup for Mantine v9 API compatibility * Upgrade docs dependencies including Next.js 15.5.14, shiki, and @mantinex packages * Update README to reference Mantine 9.x and React 19 requirements * Remove deprecated eslint.config.mjs, .prettierrc.mjs, and tsconfig.eslint.json * Add oxlint.config.ts with comprehensive rules for React, TypeScript, JSX a11y, and Jest * Refresh CLAUDE.md with updated commands reflecting the new oxfmt and oxlint toolchain
…19 compatibility * Update hook signatures to use React 19 RefObject<T | null> generic pattern * Adapt WindowGroup to Mantine v9 factory pattern with updated useProps and useResizeObserver APIs * Align use-mantine-window orchestrator with new useMergedRef from @mantine/hooks v9 * Update use-window-dimensions to use useMounted and useViewportSize from Mantine v9 hooks * Refactor use-window-state to match Mantine v9 persistence and state management patterns * Update Storybook preview to work with MantineProvider from @mantine/core v9 * Adapt Window.test.tsx to use React 19 createRef and updated testing patterns * Ensure SSR hydration safety with Mantine v9 hook lifecycle changes
…rder props * Add `withScrollArea` prop (default `true`) to optionally replace ScrollArea with a plain Box for custom scrolling * Add `controlsPosition` prop (`left`/`right`) for macOS-style or Windows-style header button placement * Add `controlsOrder` prop to allow custom ordering of close, collapse, and tools buttons * Add `windowToolsButton` Styles API selector and `data-controls-position` modifier to header * Create `Window.demo.controlsPosition.tsx` demo showcasing left, right, and custom order configurations * Create `Window.demo.withScrollArea.tsx` demo comparing ScrollArea vs clipped overflow behavior * Update configurator demo with new controls for withScrollArea, controlsPosition, collapsed, and fullSizeResizeHandles * Update `docs.mdx` with new "Disable ScrollArea" and "Controls Position" documentation sections * Update Styles API definitions, CLAUDE.md architecture docs, and README features list
…osition, and controlsOrder * Add Storybook stories for WithoutScrollArea comparing ScrollArea vs plain Box content * Add Storybook stories for ControlsRight demonstrating macOS vs Windows-style button placement * Add Storybook stories for CustomControlsOrder showing custom button arrangement * Add unit tests verifying ScrollArea renders by default and is absent when withScrollArea is false * Add unit tests for controlsPosition left/right with DOM order assertions * Add unit tests for custom controlsOrder ensuring correct button sequence * Update root package.json devDependencies to align with Mantine v9 and Storybook 10.x * Regenerate yarn.lock to reflect updated dependency tree * Ensure all new tests use the existing renderWithMantine helper for consistency * Cover edge case: children still render correctly when withScrollArea is false
Contributor
There was a problem hiding this comment.
Pull request overview
This PR upgrades the library and its tooling to Mantine v9 + React 19, while extending the Window component API with new header-controls options and optional internal scrolling.
Changes:
- Upgrade dependencies/tooling (Mantine v9, React 19, Yarn update, Storybook/CI/tooling modernization).
- Add
withScrollArea,controlsPosition, andcontrolsOrderprops toWindow, plus docs/stories/tests. - Refactor group/context and hooks to match Mantine v9 changes and reduce unnecessary rerenders.
Reviewed changes
Copilot reviewed 32 out of 36 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| tsconfig.json | Switch TS module resolution to bundler for modern tooling compatibility. |
| tsconfig.eslint.json | Remove ESLint-specific TS config (tooling migration). |
| tsconfig.build.json | Narrow build include to package/src and set rootDir for declarations. |
| README.md | Document Mantine 9 / React 19 requirement and new Window props. |
| package/src/WindowGroup.tsx | Memoize context value; adjust factory signature. |
| package/src/WindowGroup.context.ts | Replace Mantine optional context helper with React context. |
| package/src/Window.tsx | Implement withScrollArea, controlsPosition, controlsOrder in the header/content. |
| package/src/Window.test.tsx | Update persistence assertion; add tests for new props. |
| package/src/Window.story.tsx | Add stories demonstrating ScrollArea toggle and control placement/order. |
| package/src/lib/convert-to-pixels.test.ts | Add TS directive for SSR window deletion in tests. |
| package/src/hooks/use-window-state.ts | Add hook-deps lint suppressions with rationale. |
| package/src/hooks/use-window-drag.ts | Update window ref typing to allow null. |
| package/src/hooks/use-window-dimensions.ts | Replace Mantine useResizeObserver usage with manual ResizeObserver. |
| package/src/hooks/use-mantine-window.ts | Fix withinPortal defaulting; add hook-deps lint suppressions. |
| package/package.json | Update keywords to Mantine v9. |
| package.json | Update Yarn version, dependencies, and switch lint/format workflow to oxlint/oxfmt. |
| oxlint.config.ts | Introduce oxlint configuration and rule set. |
| eslint.config.mjs | Remove ESLint config (migration away from ESLint). |
| docs/tsconfig.json | Update TS target and moduleResolution to bundler. |
| docs/styles-api/Window.styles-api.ts | Document new data modifiers for styles API. |
| docs/package.json | Bump docs app dependencies to Mantine v9 / latest Next patch. |
| docs/docs.mdx | Add docs sections for ScrollArea toggle and controls positioning/order. |
| docs/demos/Window.demo.withScrollArea.tsx | Add demo for withScrollArea. |
| docs/demos/Window.demo.controlsPosition.tsx | Add demo for controlsPosition/controlsOrder. |
| docs/demos/Window.demo.configurator.tsx | Expose new props in the configurator demo. |
| docs/demos/index.ts | Export new demos. |
| CLAUDE.md | Update contributor docs for new tooling and new Window props. |
| .yarnrc.yml | Update Yarn release path. |
| .storybook/preview.tsx | Migrate theme switching to Storybook toolbar + Mantine forceColorScheme. |
| .storybook/main.ts | Update Storybook v10 config and addons. |
| .prettierrc.mjs | Remove Prettier config (formatting migration). |
| .oxfmtrc.json | Add oxfmt config including import ordering. |
| .github/workflows/pull_request.yml | Use .nvmrc for Node version and rename workflow. |
Comments suppressed due to low confidence (1)
package/src/WindowGroup.tsx:67
WindowGroupFactorydeclares a forwardedref: HTMLDivElement, but the factory callback no longer accepts the ref parameter, and the rendered<Box>only receivesref={containerRef}. This makesrefon<Window.Group>a no-op (and is inconsistent with the Factory typing). Consider re-adding therefparam and merging it withcontainerRef, or remove thereffrom the factory type if the component is intentionally not ref-forwarding.
export const WindowGroup = factory<WindowGroupFactory>((_props) => {
const props = useProps('WindowGroup', defaultGroupProps, _props);
const {
id: groupId = 'window-group',
withinPortal = false,
showToolsButton = true,
defaultLayout,
groupRef,
onLayoutChange,
children,
style,
...others
} = props;
- Clarify that disabling withScrollArea replaces the internal ScrollArea with a Box that clips overflow. - Remove unused eslint and prettier scripts from package.json to clean up the build configuration.
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
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.