Sitelet https://github.com/limitless-angular/limitless-angular/pull/70/files
Skip to content

feat(sanity)!: support angular 21 #70

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.

Sign up for GitHub

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

Merged
osnoser1 merged 1 commit into from
Jun 15, 2026
Merged

feat(sanity)!: support angular 21 #70

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 14 additions & 14 deletions apps/analog-sanity-blog-example/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@
"serve": "vite dev --host 0.0.0.0 --port 4200"
},
"dependencies": {
"@analogjs/router": "2.6.0",
"@angular/common": "~20.0.0",
"@angular/compiler": "~20.0.0",
"@angular/core": "~20.0.0",
"@angular/platform-browser": "~20.0.0",
"@angular/platform-server": "~20.0.0",
"@angular/router": "~20.0.0",
"@analogjs/router": "2.6.1",
"@angular/common": "~21.0.0",
"@angular/compiler": "~21.0.0",
"@angular/core": "~21.0.0",
"@angular/platform-browser": "~21.0.0",
"@angular/platform-server": "~21.0.0",
"@angular/router": "~21.0.0",
"@limitless-angular/analog-sanity-blog": "workspace:*",
"@limitless-angular/sanity": "workspace:*",
"@portabletext/toolkit": "^5.0.2",
Expand All @@ -29,14 +29,14 @@
"tslib": "^2.3.0"
},
"devDependencies": {
"@analogjs/content": "2.6.0",
"@analogjs/platform": "2.6.0",
"@angular/build": "~20.0.0",
"@angular/cli": "~20.0.0",
"@angular/compiler-cli": "~20.0.0",
"@analogjs/content": "2.6.1",
"@analogjs/platform": "2.6.1",
"@angular/build": "~21.0.0",
"@angular/cli": "~21.0.0",
"@angular/compiler-cli": "~21.0.0",
"@tailwindcss/typography": "^0.5.13",
"@types/node": "~22.19.20",
"angular-eslint": "^20.0.0",
"angular-eslint": "^21.0.0",
"autoprefixer": "^10.4.0",
"eslint": "^9.8.0",
"jsdom": "^22.0.0",
Expand All @@ -47,7 +47,7 @@
"postcss": "^8.4.5",
"rollup-plugin-typescript-paths": "^1.5.0",
"tailwindcss": "^3.0.2",
"typescript": "~5.8.3",
"typescript": "~5.9.3",
"typescript-eslint": "^8.61.0",
"vite": "^8.0.16",
"vite-plugin-webfont-dl": "^3.12.0"
Expand Down
8 changes: 6 additions & 2 deletions apps/analog-sanity-blog-example/src/main.server.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,10 @@ import '@angular/platform-server/init';

import { enableProdMode } from '@angular/core';
import { renderApplication } from '@angular/platform-server';
import { bootstrapApplication } from '@angular/platform-browser';
import {
bootstrapApplication,
BootstrapContext,
} from '@angular/platform-browser';

import { provideServerContext } from '@analogjs/router/server';
import { ServerContext } from '@analogjs/router/tokens';
Expand All @@ -14,7 +17,8 @@ if (import.meta.env.PROD) {
enableProdMode();
}

const bootstrap = () => bootstrapApplication(AppComponent, config);
const bootstrap = (context: BootstrapContext) =>
bootstrapApplication(AppComponent, config, context);

export default async function render(
url: string,
Expand Down
24 changes: 12 additions & 12 deletions apps/sanity-example/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@
"serve": "ng serve"
},
"dependencies": {
"@angular/common": "~20.0.0",
"@angular/compiler": "~20.0.0",
"@angular/core": "~20.0.0",
"@angular/platform-browser": "~20.0.0",
"@angular/platform-server": "~20.0.0",
"@angular/router": "~20.0.0",
"@angular/ssr": "~20.0.0",
"@angular/common": "~21.0.0",
"@angular/compiler": "~21.0.0",
"@angular/core": "~21.0.0",
"@angular/platform-browser": "~21.0.0",
"@angular/platform-server": "~21.0.0",
"@angular/router": "~21.0.0",
"@angular/ssr": "~21.0.0",
"@limitless-angular/sanity": "workspace:*",
"@portabletext/toolkit": "^5.0.2",
"@portabletext/types": "^4.0.2",
Expand All @@ -27,19 +27,19 @@
"tslib": "^2.3.0"
},
"devDependencies": {
"@angular/build": "~20.0.0",
"@angular/cli": "~20.0.0",
"@angular/compiler-cli": "~20.0.0",
"@angular/build": "~21.0.0",
"@angular/cli": "~21.0.0",
"@angular/compiler-cli": "~21.0.0",
"@netlify/angular-runtime": "4.0.0",
"@tailwindcss/typography": "^0.5.13",
"@types/express": "4.17.14",
"@types/leaflet": "^1.9.12",
"@types/node": "~22.19.20",
"@types/prismjs": "^1.26.4",
"angular-eslint": "^20.0.0",
"angular-eslint": "^21.0.0",
"eslint": "^9.8.0",
"tailwindcss": "^3.0.2",
"typescript": "~5.8.3",
"typescript": "~5.9.3",
"typescript-eslint": "^8.61.0"
}
}
8 changes: 6 additions & 2 deletions apps/sanity-example/src/main.server.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
import { bootstrapApplication } from '@angular/platform-browser';
import {
bootstrapApplication,
BootstrapContext,
} from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
import { config } from './app/app.config.server';

const bootstrap = () => bootstrapApplication(AppComponent, config);
const bootstrap = (context: BootstrapContext) =>
bootstrapApplication(AppComponent, config, context);

export default bootstrap;
24 changes: 12 additions & 12 deletions apps/sanity-presentation-e2e-preview/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,28 +10,28 @@
"serve:ssr": "node dist/sanity-presentation-e2e-preview/server/server.mjs"
},
"dependencies": {
"@angular/common": "~20.0.0",
"@angular/compiler": "~20.0.0",
"@angular/core": "~20.0.0",
"@angular/platform-browser": "~20.0.0",
"@angular/platform-server": "~20.0.0",
"@angular/router": "~20.0.0",
"@angular/ssr": "~20.0.0",
"@angular/common": "~21.0.0",
"@angular/compiler": "~21.0.0",
"@angular/core": "~21.0.0",
"@angular/platform-browser": "~21.0.0",
"@angular/platform-server": "~21.0.0",
"@angular/router": "~21.0.0",
"@angular/ssr": "~21.0.0",
"@limitless-angular/sanity": "workspace:*",
"@sanity/client": "^7.22.1",
"express": "^4.18.2",
"rxjs": "~7.8.0",
"tslib": "^2.3.0"
},
"devDependencies": {
"@angular/build": "~20.0.0",
"@angular/cli": "~20.0.0",
"@angular/compiler-cli": "~20.0.0",
"@angular/build": "~21.0.0",
"@angular/cli": "~21.0.0",
"@angular/compiler-cli": "~21.0.0",
"@types/express": "^4.17.17",
"@types/node": "~22.19.20",
"angular-eslint": "^20.0.0",
"angular-eslint": "^21.0.0",
"eslint": "^9.8.0",
"typescript": "~5.8.3",
"typescript": "~5.9.3",
"typescript-eslint": "^8.61.0"
}
}
8 changes: 6 additions & 2 deletions apps/sanity-presentation-e2e-preview/src/main.server.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
import { bootstrapApplication } from '@angular/platform-browser';
import {
bootstrapApplication,
BootstrapContext,
} from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
import { config } from './app/app.config.server';

const bootstrap = () => bootstrapApplication(AppComponent, config);
const bootstrap = (context: BootstrapContext) =>
bootstrapApplication(AppComponent, config, context);

export default bootstrap;
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@
"prettier": "3.3.3",
"semver": "^7.8.2",
"turbo": "2.9.16",
"typescript": "~5.8.3",
"typescript": "~5.9.3",
"typescript-eslint": "^8.61.0",
"yargs": "^17.7.2"
}
Expand Down
16 changes: 12 additions & 4 deletions packages/sanity/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ Limitless Angular is a powerful collection of Angular libraries focused on Sanit
- 🖼️ **Image Optimization**: Built-in image loader and directives for Sanity images
- 🔄 **Real-time Preview**: Live content updates with Preview Kit
- ✏️ **Visual Editing**: Seamless content management integration
- 🎯 **Angular-First**: Built specifically for Angular 18+
- 🎯 **Angular-First**: Built specifically for Angular 19+

## Installation

Expand All @@ -31,11 +31,19 @@ npm install --save @limitless-angular/sanity @sanity/client

| Angular | `@limitless-angular/sanity` |
| ------- | --------------------------- |
| 20.x | 20.x |
| 19.x | 20.x, 19.x |
| 21.x | 21.x |
| 20.x | 21.x, 20.x |
| 19.x | 21.x, 20.x, 19.x |
| 18.x | 20.x, 19.x, 18.x |

The current 20.x package line supports Angular 18, Angular 19, and Angular 20.
The current stable 20.x package line supports Angular 18, Angular 19, and
Angular 20.

Angular 21 support is available on the `next` prerelease line:

```bash
npm install @limitless-angular/sanity@next
```

## Quick Start

Expand Down
32 changes: 16 additions & 16 deletions packages/sanity/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,9 @@
"cms"
],
"peerDependencies": {
"@angular/common": "^18.0.0 || ^19.0.0 || ^20.0.0",
"@angular/core": "^18.0.0 || ^19.0.0 || ^20.0.0",
"@angular/router": "^18.0.0 || ^19.0.0 || ^20.0.0",
"@angular/common": "^19.0.0 || ^20.0.0 || ^21.0.0",
"@angular/core": "^19.0.0 || ^20.0.0 || ^21.0.0",
"@angular/router": "^19.0.0 || ^20.0.0 || ^21.0.0",
"@sanity/client": "^6.28.0 || ^7.0.0",
"rxjs": "^7.8.0"
},
Expand All @@ -56,26 +56,26 @@
"xstate": "^5.19.2"
},
"devDependencies": {
"@analogjs/vite-plugin-angular": "^2.6.0",
"@analogjs/vitest-angular": "^2.6.0",
"@angular/build": "~20.0.0",
"@angular/common": "~20.0.0",
"@angular/compiler": "~20.0.0",
"@angular/compiler-cli": "~20.0.0",
"@angular/core": "~20.0.0",
"@angular/platform-browser": "~20.0.0",
"@angular/router": "~20.0.0",
"@analogjs/vite-plugin-angular": "^2.6.1",
"@analogjs/vitest-angular": "^2.6.1",
"@angular/build": "~21.0.0",
"@angular/common": "~21.0.0",
"@angular/compiler": "~21.0.0",
"@angular/compiler-cli": "~21.0.0",
"@angular/core": "~21.0.0",
"@angular/platform-browser": "~21.0.0",
"@angular/router": "~21.0.0",
"@sanity/client": "^7.22.1",
"@testing-library/angular": "^18.1.1",
"@testing-library/angular": "^19.4.1",
"@testing-library/dom": "^10.4.0",
"@types/lodash-es": "^4.17.12",
"@types/node": "~22.19.20",
"angular-eslint": "^20.0.0",
"angular-eslint": "^21.0.0",
"eslint": "^9.8.0",
"jsdom": "^22.0.0",
"ng-packagr": "~20.0.0",
"ng-packagr": "~21.0.0",
"rxjs": "~7.8.0",
"typescript": "~5.8.3",
"typescript": "~5.9.3",
"typescript-eslint": "^8.61.0",
"vite": "^8.0.16",
"vitest": "^4.1.8"
Expand Down
16 changes: 6 additions & 10 deletions packages/sanity/portabletext/src/directives/portable-text-directives.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import {
TypedObject,
} from '@portabletext/types';

import { isAngularVersionLessThan19 } from '@limitless-angular/sanity/shared';
import { PortableTextListBlock } from '../types';
import { PortableTextComponent } from '../components/portable-text.component';

Expand All @@ -32,15 +31,12 @@ export class DynamicPortableTextContent<Node extends TypedObject = TypedObject>
template = inject(PortableTextComponent).childrenTmpl;

// eslint-disable-next-line no-unused-private-class-members
#_ = effect(
() => {
this.container()?.clear();
this.container()?.createEmbeddedView(this.template(), {
children: this.children(),
});
},
isAngularVersionLessThan19() ? { allowSignalWrites: true } : undefined,
);
#_ = effect(() => {
this.container()?.clear();
this.container()?.createEmbeddedView(this.template(), {
children: this.children(),
});
});

/**
* @deprecated empty hook that is used just to avoid a breaking change, it will be removed in a major version
Expand Down
20 changes: 8 additions & 12 deletions packages/sanity/portabletext/src/directives/render-node.directive.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ import {

import { TypedObject } from '@portabletext/types';

import { isAngularVersionLessThan19 } from '@limitless-angular/sanity/shared';
import { PortableTextComponent } from '../components/portable-text.component';

// eslint-disable-next-line @angular-eslint/directive-selector
Expand All @@ -21,16 +20,13 @@ export class RenderNode {
#vcr = inject(ViewContainerRef);

constructor() {
effect(
() => {
this.#vcr.clear();
this.#vcr.createEmbeddedView(this.#renderNode(), {
$implicit: this.node(),
isInline: this.isInline(),
index: this.index(),
});
},
isAngularVersionLessThan19() ? { allowSignalWrites: true } : undefined,
);
effect(() => {
this.#vcr.clear();
this.#vcr.createEmbeddedView(this.#renderNode(), {
$implicit: this.node(),
isInline: this.isInline(),
index: this.index(),
});
});
}
}
17 changes: 8 additions & 9 deletions packages/sanity/visual-editing/src/overlay-components/components/insert-menu.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,15 +76,14 @@ function getInsertMenuOptions(
@if (previewImageurl(/sitelet?url=https%3A%2F%2Fgithub.com%2Flimitless-angular%2Flimitless-angular%2Fpull%2F70%2FschemaType); as previewImage) {
<img class="preview-image" [src]="previewImage" alt="" />
} @else {
@if (iconFor(schemaType); as icon) {
<span class="icon" [attr.aria-label]="icon.label">
@if (icon.html) {
<span [innerHTML]="icon.html"></span>
} @else {
{{ icon.text }}
}
</span>
}
@let icon = iconFor(schemaType);
<span class="icon" [attr.aria-label]="icon.label">
@if (icon.html) {
<span [innerHTML]="icon.html"></span>
} @else {
{{ icon.text }}
}
</span>
}
<span class="label">{{ labelFor(schemaType) }}</span>
</button>
Expand Down
17 changes: 8 additions & 9 deletions packages/sanity/visual-editing/src/ui/context-menu/context-menu.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,15 +51,14 @@ type ContextMenuState = NonNullable<OverlayState['contextMenu']>;
#menu
>
<div class="header">
@if (titleIcon(); as icon) {
<span class="icon" [attr.aria-label]="icon.label">
@if (icon.html) {
<span [innerHTML]="icon.html"></span>
} @else {
{{ icon.text }}
}
</span>
}
@let icon = titleIcon();
<span class="icon" [attr.aria-label]="icon.label">
@if (icon.html) {
<span [innerHTML]="icon.html"></span>
} @else {
{{ icon.text }}
}
</span>
<span class="title">{{ title() }}</span>
</div>
@if (items(); as items) {
Expand Down
Loading
Loading