History

dependabot[bot] 1920ce86e2 Bump @angular/compiler from 17.3.10 to 18.0.1 in /web_embedding/ng-flutter (#2313 ) Bumps [@angular/compiler](https://github.com/angular/angular/tree/HEAD/packages/compiler) from 17.3.10 to 18.0.1. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/angular/angular/releases"><code>@angular/compiler</code>'s releases</a>.</em></p> <blockquote> <h2>v18.0.1</h2> <p><!-- raw HTML omitted --><!-- raw HTML omitted --></p> <h1>18.0.1 (2024-05-29)</h1> <h3>compiler</h3> <table> <thead> <tr> <th>Commit</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`419ffa2026`"><img src="https://img.shields.io/badge/419ffa2026-fix-green" alt="fix - 419ffa2026" /></a></td> <td>optimize track function that only passes $index (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55872">#55872</a>)</td> </tr> </tbody> </table> <h3>compiler-cli</h3> <table> <thead> <tr> <th>Commit</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`4c7efc005a`"><img src="https://img.shields.io/badge/4c7efc005a-fix-green" alt="fix - 4c7efc005a" /></a></td> <td>interpolatedSignalNotInvoked diagnostic for class, style, attribute and animation bindings (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55969">#55969</a>)</td> </tr> </tbody> </table> <h3>core</h3> <table> <thead> <tr> <th>Commit</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`4e6ea0e19c`"><img src="https://img.shields.io/badge/4e6ea0e19c-fix-green" alt="fix - 4e6ea0e19c" /></a></td> <td>handle elements with local refs in event replay serialization logic (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/56076">#56076</a>)</td> </tr> <tr> <td><a href="`d73a0175cb`"><img src="https://img.shields.io/badge/d73a0175cb-fix-green" alt="fix - d73a0175cb" /></a></td> <td>link errors to ADEV (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55554">#55554</a>)</td> </tr> <tr> <td><a href="`985a215b10`"><img src="https://img.shields.io/badge/985a215b10-fix-green" alt="fix - 985a215b10" /></a></td> <td>typo in zoneless warning (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55974">#55974</a>)</td> </tr> </tbody> </table> <h3>migrations</h3> <table> <thead> <tr> <th>Commit</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`ba85d08158`"><img src="https://img.shields.io/badge/ba85d08158-fix-green" alt="fix - ba85d08158" /></a></td> <td>handle empty ngSwitchCase (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/56105">#56105</a>)</td> </tr> </tbody> </table> <h2>v18.0.0</h2> <p><!-- raw HTML omitted --><!-- raw HTML omitted --></p> <h1>18.0.0 (2024-05-22)</h1> <h3>animations</h3> <table> <thead> <tr> <th>Commit</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`bcce85af72`"><img src="https://img.shields.io/badge/bcce85af72-refactor-yellow" alt="refactor - bcce85af72" /></a></td> <td>remove deprecated <code>matchesElement</code> from <code>AnimationDriver</code> (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55479">#55479</a>)</td> </tr> </tbody> </table> <h3>common</h3> <table> <thead> <tr> <th>Commit</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`d34c033902`"><img src="https://img.shields.io/badge/d34c033902-refactor-yellow" alt="refactor - d34c033902" /></a></td> <td>Deprecate Local Data API functions (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/54483">#54483</a>)</td> </tr> <tr> <td><a href="`3b0de30b37`"><img src="https://img.shields.io/badge/3b0de30b37-refactor-yellow" alt="refactor - 3b0de30b37" /></a></td> <td>remove deprecated <code>isPlatformWorkerApp</code> and <code>isPlatformWorkerUi</code> API (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55302">#55302</a>)</td> </tr> </tbody> </table> <h3>compiler</h3> <table> <thead> <tr> <th>Commit</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`91b007e58f`"><img src="https://img.shields.io/badge/91b007e58f-fix-green" alt="fix - 91b007e58f" /></a></td> <td>add math elements to schema (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55631">#55631</a>)</td> </tr> <tr> <td><a href="`33d0102304`"><img src="https://img.shields.io/badge/33d0102304-fix-green" alt="fix - 33d0102304" /></a></td> <td>allow comments between connected blocks (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55966">#55966</a>)</td> </tr> <tr> <td><a href="`7fc7f3f05f`"><img src="https://img.shields.io/badge/7fc7f3f05f-fix-green" alt="fix - 7fc7f3f05f" /></a></td> <td>capture all control flow branches for content projection in if blocks (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/54921">#54921</a>)</td> </tr> <tr> <td><a href="`a369f43fbd`"><img src="https://img.shields.io/badge/a369f43fbd-fix-green" alt="fix - a369f43fbd" /></a></td> <td>capture switch block cases for content projection (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/54921">#54921</a>)</td> </tr> <tr> <td><a href="`eb625d3783`"><img src="https://img.shields.io/badge/eb625d3783-fix-green" alt="fix - eb625d3783" /></a></td> <td>declare for loop aliases in addition to new name (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/54942">#54942</a>)</td> </tr> <tr> <td><a href="`f824911510`"><img src="https://img.shields.io/badge/f824911510-fix-green" alt="fix - f824911510" /></a></td> <td>For <code>FatalDiagnosticError</code>, hide the <code>message</code> field without affecting the emit (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55160">#55160</a>)</td> </tr> <tr> <td><a href="`a040fb720a`"><img src="https://img.shields.io/badge/a040fb720a-fix-green" alt="fix - a040fb720a" /></a></td> <td>maintain multiline CSS selectors during CSS scoping (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55509">#55509</a>)</td> </tr> <tr> <td><a href="`39624c6b12`"><img src="https://img.shields.io/badge/39624c6b12-fix-green" alt="fix - 39624c6b12" /></a></td> <td>output input flags as a literal (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55215">#55215</a>)</td> </tr> <tr> <td><a href="`eba92cfa55`"><img src="https://img.shields.io/badge/eba92cfa55-fix-green" alt="fix - eba92cfa55" /></a></td> <td>prevent usage of reserved control flow symbol in custom interpolation context. (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55809">#55809</a>)</td> </tr> <tr> <td><a href="`7d5bc1c628`"><img src="https://img.shields.io/badge/7d5bc1c628-fix-green" alt="fix - 7d5bc1c628" /></a></td> <td>remove container index from conditional instruction (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55190">#55190</a>)</td> </tr> <tr> <td><a href="`4eb0165750`"><img src="https://img.shields.io/badge/4eb0165750-fix-green" alt="fix - 4eb0165750" /></a></td> <td>remove support for unassignable expressions in two-way bindings (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55342">#55342</a>)</td> </tr> <tr> <td><a href="`e1650e3b13`"><img src="https://img.shields.io/badge/e1650e3b13-fix-green" alt="fix - e1650e3b13" /></a></td> <td>throw error if item name and context variables conflict (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55045">#55045</a>)</td> </tr> </tbody> </table> <h3>compiler-cli</h3> <!-- raw HTML omitted --> </blockquote> <p>... (truncated)</p> </details> <details> <summary>Changelog</summary> <p><em>Sourced from <a href="https://github.com/angular/angular/blob/main/CHANGELOG.md"><code>@angular/compiler</code>'s changelog</a>.</em></p> <blockquote> <h1>18.0.1 (2024-05-29)</h1> <h3>compiler</h3> <table> <thead> <tr> <th>Commit</th> <th>Type</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`419ffa2026`">419ffa2026</a></td> <td>fix</td> <td>optimize track function that only passes $index (<a href="https://redirect.github.com/angular/angular/pull/55872">#55872</a>)</td> </tr> </tbody> </table> <h3>compiler-cli</h3> <table> <thead> <tr> <th>Commit</th> <th>Type</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`4c7efc005a`">4c7efc005a</a></td> <td>fix</td> <td>interpolatedSignalNotInvoked diagnostic for class, style, attribute and animation bindings (<a href="https://redirect.github.com/angular/angular/pull/55969">#55969</a>)</td> </tr> </tbody> </table> <h3>core</h3> <table> <thead> <tr> <th>Commit</th> <th>Type</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`4e6ea0e19c`">4e6ea0e19c</a></td> <td>fix</td> <td>handle elements with local refs in event replay serialization logic (<a href="https://redirect.github.com/angular/angular/pull/56076">#56076</a>)</td> </tr> <tr> <td><a href="`d73a0175cb`">d73a0175cb</a></td> <td>fix</td> <td>link errors to ADEV (<a href="https://redirect.github.com/angular/angular/pull/55554">#55554</a>)</td> </tr> <tr> <td><a href="`985a215b10`">985a215b10</a></td> <td>fix</td> <td>typo in zoneless warning (<a href="https://redirect.github.com/angular/angular/pull/55974">#55974</a>)</td> </tr> </tbody> </table> <h3>migrations</h3> <table> <thead> <tr> <th>Commit</th> <th>Type</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><a href="`ba85d08158`">ba85d08158</a></td> <td>fix</td> <td>handle empty ngSwitchCase (<a href="https://redirect.github.com/angular/angular/pull/56105">#56105</a>)</td> </tr> </tbody> </table> <!-- raw HTML omitted --> <p><!-- raw HTML omitted --><!-- raw HTML omitted --></p> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href="`419ffa2026`"><code>419ffa2</code></a> fix(compiler): optimize track function that only passes $index (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55872">#55872</a>)</li> <li><a href="`33d0102304`"><code>33d0102</code></a> fix(compiler): allow comments between connected blocks (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55966">#55966</a>)</li> <li><a href="`eba92cfa55`"><code>eba92cf</code></a> fix(compiler): prevent usage of reserved control flow symbol in custom interp...</li> <li><a href="`6906ff0131`"><code>6906ff0</code></a> refactor(core): clean up clang comments and workarounds (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55750">#55750</a>)</li> <li><a href="`cd96464335`"><code>cd96464</code></a> refactor(compiler): move variable optimization earlier in pipeline (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55771">#55771</a>)</li> <li><a href="`a040fb720a`"><code>a040fb7</code></a> fix(compiler): maintain multiline CSS selectors during CSS scoping (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55509">#55509</a>)</li> <li><a href="`91b007e58f`"><code>91b007e</code></a> fix(compiler): add math elements to schema (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55631">#55631</a>)</li> <li><a href="`0dcae69aaf`"><code>0dcae69</code></a> refactor(compiler): add <code>handler</code> attribute to XMB output (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/54865">#54865</a>)</li> <li><a href="`a5c57c7484`"><code>a5c57c7</code></a> fix(core): resolve error for multiple component instances that use fallback c...</li> <li><a href="`8f69c83b84`"><code>8f69c83</code></a> refactor: migrate compiler to prettier formatting (<a href="https://github.com/angular/angular/tree/HEAD/packages/compiler/issues/55398">#55398</a>)</li> <li>Additional commits viewable in <a href="https://github.com/angular/angular/commits/18.0.1/packages/compiler">compare view</a></li> </ul> </details> <br /> [![Dependabot compatibility score](https://dependabot-badges.githubapp.com/badges/compatibility_score?dependency-name=@angular/compiler&package-manager=npm_and_yarn&previous-version=17.3.10&new-version=18.0.1)](https://docs.github.com/en/github/managing-security-vulnerabilities/about-dependabot-security-updates#about-compatibility-scores) Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting `@dependabot rebase`. [//]: # (dependabot-automerge-start) [//]: # (dependabot-automerge-end) --- <details> <summary>Dependabot commands and options</summary> <br /> You can trigger Dependabot actions by commenting on this PR: - `@dependabot rebase` will rebase this PR - `@dependabot recreate` will recreate this PR, overwriting any edits that have been made to it - `@dependabot merge` will merge this PR after your CI passes on it - `@dependabot squash and merge` will squash and merge this PR after your CI passes on it - `@dependabot cancel merge` will cancel a previously requested merge and block automerging - `@dependabot reopen` will reopen this PR if it is closed - `@dependabot close` will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually - `@dependabot show <dependency name> ignore conditions` will show all of the ignore conditions of the specified dependency - `@dependabot ignore this major version` will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself) - `@dependabot ignore this minor version` will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself) - `@dependabot ignore this dependency` will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself) </details> Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>		6 months ago
..
element_embedding_demo	Bump deps and min SDKs, move web apps to new bootstrapping logic (#2292 )	6 months ago
ng-flutter	Bump @angular/compiler from 17.3.10 to 18.0.1 in /web_embedding/ng-flutter (#2313 )	6 months ago
README.md	[web_embedding] Update README to link to our first community contribs. (#1980 )	1 year ago

README.md

web_embedding

This directory contains examples of how to embed Flutter in web apps (without iframes):

element_embedding_demo: Modifies the index.html of a flutter app so it is launched in a custom hostElement. This is the most basic embedding example.
ng-flutter: A simple Angular app (and component) that replicates the above example, but in an Angular style.

Check the README.md of each example for more details on how to run it, and the "Points of Interest" it may contain.

Community Contributions

Members of the community have graciously ported and contributed the following examples of Flutter Web embedding into other web frameworks:

Author	Host Framework	Code
@p-mazhnik	React JS	p-mazhnik/flutter-embedding cra-flutter
@p-mazhnik	React Native	p-mazhnik/flutter-embedding expo-flutter

(All contributions are welcome! Please, create an issue or open a PR to let us know how you've embedded a Flutter Web app with your favorite web framework (Vue? Svelte? Ember? Aurelia? jQuery? MooTools? Prototype?), so it can be added to the table above!)