build(deps): update Angular to 22.2.0 and fix image-size vulnerability - #121
Merged
Merged
Conversation
…erver.ts chore: update peer dependency for @angular/cdk to version 21.0.0 in flex-layout package.json fix: correct schema path in flex-layout project.json and add tsConfig option for packaging
- Created a new markdown page (index.html) for standalone content. - Added a sitemap.xml for better SEO and navigation. - Implemented SectionPageComponent with dynamic content rendering and layout using Angular Material and ngx-layout directives.
…ved performance - Updated multiple components in the responsive and stackoverflow pages to use ChangeDetectionStrategy.Eager. - Modified tsconfig.app.json to include angularCompilerOptions for nullish coalescing and optional chaining checks. - Adjusted various test files to import necessary components instead of declaring them. - Added .npmrc file to set legacy-peer-deps to true for compatibility. - Changed module resolution strategy in tsconfig.json from node to bundler.
…hers - Replaced Jasmine spies with Vitest spies in media-marshaller tests. - Removed custom matchers from various spec files and set up Vitest environment. - Updated TypeScript configuration to use Vitest types instead of Jasmine. - Deleted obsolete Karma configuration files and test setup.
- Updated @docusaurus/preset-classic to ^3.10.1 and related Docusaurus packages. - Replaced conventional-changelog-cli with conventional-changelog. - Added jsdom as a dependency. - Removed unused expect imports from various test files. - Refactored test imports to use Default directives from ngx-layout. - Updated test setup for Vitest compatibility, including ProxyZone handling. - Added vitest-base.config.ts for base Vitest configuration. - Adjusted tsconfig.spec.json to include test-setup.ts.
- Introduced a new test target for server-side rendering (SSR) in angular.json. - Updated package.json to use the new SSR test command. - Removed deprecated SSR test files and configurations. - Added a new provider file for SSR tests to set PLATFORM_ID. - Adjusted flex directive tests to handle null styles during SSR. - Updated TypeScript configuration to include the new SSR provider file.
…json and package-lock.json
…tGap (#95) (#106) fxLayoutGap emitted physical margin properties (margin-right/left) and selected between them by reading the CDK Directionality (the `dir` attribute). That broke layouts when the writing direction was set via CSS `direction: rtl`, and required LTR/RTL branching throughout the directive. Switch to logical properties, which the browser resolves against the writing direction automatically: row -> margin-inline-end row-reverse -> margin-inline-start column -> margin-block-end column-reverse -> margin-block-start grid margin -> margin-inline / margin-block grid padding -> padding-inline / padding-block This both fixes the RTL bug and removes now-dead direction handling: the Directionality injection and its change trigger, the four direction-keyed style caches and their selection in updateWithValue, and the `directionality` field on LayoutGapParent. Tests updated to assert the logical properties; full library suite passes (478/478). Closes #95 Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
# Conflicts: # projects/libs/flex-layout/flex/layout-gap/layout-gap.spec.ts
The Default<X>Directive classes were deprecated in v21 ("will be removed
in version 21") but were never removed. They are redundant subclasses —
the base directives already carry the same selector and inputs — so they
add nothing but a duplicate public symbol.
Remove all 22 Default* directives and repoint the Flex/Extended/Grid
modules (and specs/demo) to the base directives. Grid directive
descriptions that were attached to the Default* classes are moved onto
the corresponding base directives so no docs are lost.
The NgModules are intentionally kept for now.
BREAKING CHANGE: The deprecated Default* directives have been removed.
Replace each `Default<X>Directive` with `<X>Directive` (e.g.
`DefaultFlexDirective` -> `FlexDirective`). The base directives have
identical selectors and behavior, so only the import/symbol name changes.
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
) (#108) On a media/breakpoint change (e.g. window resize), MediaMarshaller.updateStyles() iterates elementMap (a strong Map) and flushes styles for every tracked element. An element can be detached/destroyed between the resize event firing and the flush, leaving element.style undefined and causing "TypeError: Cannot read properties of undefined (reading 'setProperty')". Because the throw aborted the whole forEach pass, a single stale element broke styling for all remaining elements too. Guard the browser setProperty call with optional chaining so a non-styleable element is skipped instead of throwing. The server path is unaffected. Closes #57 Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
* feat(layout-gap): use CSS `gap` instead of child margins (#43) fxLayoutGap previously applied `margin` to each child except the last, which left two rendering bugs with `fxLayout="row wrap"`: - no spacing between wrapped rows, and - an extra leading margin on the last/short row. Switch fxLayoutGap to set the native CSS `gap` property on the flex container itself. `gap` spaces items within a row/column AND between wrapped rows, fixing both issues, and is direction-independent so RTL and reversed flows need no special handling. This removes the MutationObserver, child sorting, layout tracking, and the grid negative-margin/padding machinery; BaseDirective2's default update path now applies the gap to the host. BREAKING CHANGE: fxLayoutGap now emits CSS `gap` on the container rather than `margin` on children, so the element must be a flex container (apply fxLayout) for the gap to take effect. The legacy " grid" suffix is still accepted but is now equivalent to a plain gap. Closes #43 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> * docs(demo): update layout-gap demo for CSS gap behavior The "Layout Gap" demo used the legacy `fxLayoutGap="10px 5px grid"` with `fxFlex="25"` children, relying on the old negative-margin grid hack so four 25%-basis items fit per row with gutters. With CSS `gap`, the gap is added on top of the flex-basis, so size the children with `calc(25% - 7.5px)` to keep four per row, and use a plain `fxLayoutGap="10px"` (the ` grid` suffix is now a no-op). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
The default breakpoints retain the original @angular/flex-layout ranges
where `md` starts at 960px, which is dated. Rather than change the
defaults (a breaking change for migrants), add an importable
MATERIAL_BREAKPOINTS preset with modern Material 3 values:
xs <600 | sm 600 | md 900 | lg 1200 | xl 1536
It uses the same xs/sm/md/lg/xl (+ lt-*/gt-*) alias set as the defaults,
so responsive selectors are unchanged — only the activation ranges. Opt
in by disabling the built-ins and providing the preset:
FlexLayoutModule.withConfig({ disableDefaultBps: true }, MATERIAL_BREAKPOINTS)
Also fixes the breakpoints doc, which referenced a non-existent
DISABLE_DEFAULT_BREAKPOINTS token (the real option is `disableDefaultBps`).
Closes #26
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
The changelog regeneration emitted two identical 22.0.0-rc (2026-06-15) blocks that duplicate the new 22.0.0 release section. Remove them, keeping the original historical 22.0.0-rc (2026-06-03) entry. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Update the library README to reflect that ngx-layout is now fully standalone: add a standalone component / provideFlexLayout example and call out the removal of the deprecated Default* directives. The NgModule usage is retained as still supported. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Replace the margin-based gap implementation (onLayoutChange, updateWithValue, clearStyles override, willDisplay, MutationObserver child observation) with the container's native CSS `gap` property. Update the spec to assert `gap` on the container rather than margin-inline-end / margin-block-end on individual children. Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
) Resolve all 12 npm audit findings (5 high, 4 moderate, 3 low) in transitive dev/build dependencies by pinning each to its minimum patched version within the compatible major via package.json overrides: - @babel/core 7.29.6, esbuild 0.28.1, hono 4.12.31, http-proxy-middleware 2.0.10, joi 17.13.4, js-yaml 4.2.0, piscina 5.2.0, undici 7.28.0, vite 7.3.5, webpack-dev-server 5.2.5 - gray-matter scoped to js-yaml 3.15.0 (needs 3.x API) - node-gyp scoped to undici 6.27.0 (needs ^6); jsdom uses undici 7.28.0 npm audit now reports 0 vulnerabilities; library build and all 468 tests pass. Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The overrides block pinned versions that have since had new advisories filed against them (hono <=4.13.4, undici 7.0.0-7.28.0, webpack-dev-server <=5.2.5, js-yaml 4.0.0-4.3.1, joi, esbuild), and the gray-matter override forced the vulnerable js-yaml 3.15.0. Bump each to the patched release within the same major, and add a qs override (6.16.0) to clear the array-limit bypass / DoS advisories pulled in transitively. Clears the override-related advisories; the remaining 23 are transitive deps of the Angular 22.0.x toolchain (addressed by the follow-up 22.1.x update) and image-size, which has no patched release published yet. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Run ng update to bring @angular/* (core, common, compiler, forms, router, animations, platform-*), @angular/material, @angular/cdk and angular-eslint to the latest 22.1.x release. Align @angular/ssr and @angular/build (which ng update does not manage) to 22.1.7. The 22.1.x toolchain also pulls patched transitive dependencies, clearing 6 further advisories (23 -> 17 remaining, all image-size which has no upstream patch). Library builds and all 468 tests pass. No breaking migrations for this minor bump; the deferred inject() migration is intentionally not run. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
# Conflicts: # CHANGELOG.md # package-lock.json # package.json
- Update @angular/* packages to 22.2.0 - Bump ng-packagr to 22.2.1 - npm audit fix: image-size 2.0.2 -> 2.0.4 (GHSA-5p2g-fcmc-qvqq, GHSA-w3rx-r6r6-pgpr) Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
✅ Deploy Preview for ngx-layout ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview for ngx-layout-docs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
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
1 participant
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
@angular/*packages from 22.1.x to 22.2.0 (viang update)ng-packagr22.0.0 → 22.2.1npm audit fix:image-size2.0.2 → 2.0.4 (transitive via Docusaurus), resolving high-severity DoS advisories GHSA-5p2g-fcmc-qvqq and GHSA-w3rx-r6r6-pgpr.npm auditnow reports 0 vulnerabilities.No library source changes; peer range (
@angular/cdk >=21.0.0) unchanged.Test plan
npm run build(library)npm test— 468/468 passingnpm run test:ssr— 468/468 passingnpm run build:demo-appnpm run build:universal-demo-app🤖 Generated with Claude Code