mirror of
https://github.com/flutter/samples.git
synced 2025-11-08 13:58:47 +00:00
10b21a4567
Bumps [@angular/animations](https://github.com/angular/angular/tree/HEAD/packages/animations) from 18.2.12 to 19.0.0. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/angular/angular/releases"><code>@âangular/animations</code>'s releases</a>.</em></p> <blockquote> <h2>v19.0.0</h2> <h1>19.0.0 (2024-11-19)</h1> <p>Explore Angular v19 with a blog post from the Angular team: <a href="https://blog.angular.dev/meet-angular-v19-7b29dfd05b84">https://blog.angular.dev/meet-angular-v19-7b29dfd05b84</a></p> <h2>Breaking Changes</h2> <h3>compiler</h3> <ul> <li><code>this.foo</code> property reads no longer refer to template context variables. If you intended to read the template variable, do not use <code>this.</code>.</li> </ul> <h3>core</h3> <ul> <li> <p>Angular directives, components and pipes are now standalone by default.</p> <ul> <li>Specify <code>standalone: false</code> for declarations that are currently declared in <code>@NgModule</code>s.</li> <li><code>ng update</code> for v19 will take care of this automatically.</li> </ul> </li> <li> <p>TypeScript versions less than 5.5 are no longer supported.</p> </li> <li> <p>Timing changes for <code>effect</code> API (in developer preview):</p> <ul> <li> <p>effects which are triggered outside of change detection run as part of the change detection process instead of as a microtask. Depending on the specifics of application/test setup, this can result in them executing earlier or later (or requiring additional test steps to trigger; see below examples).</p> </li> <li> <p>effects which are triggered during change detection (e.g. by input signals) run <em>earlier</em>, before the component's template.</p> </li> </ul> </li> <li> <p><code>ExperimentalPendingTasks</code> has been renamed to <code>PendingTasks</code>.</p> </li> <li> <p>The <code>autoDetect</code> feature of <code>ComponentFixture</code> will now attach the fixture to the <code>ApplicationRef</code>. As a result, errors during automatic change detection of the fixture be reported to the <code>ErrorHandler</code>. This change may cause custom error handlers to observe new failures that were previously unreported.</p> </li> <li> <p><code>createComponent</code> will now render default fallback with empty <code>projectableNodes</code>.</p> <ul> <li>When passing an empty array to <code>projectableNodes</code> in the <code>createComponent</code> API, the default fallback content of the <code>ng-content</code> will be rendered if present. To prevent rendering the default content, pass <code>document.createTextNode('')</code> as a <code>projectableNode</code>.</li> </ul> <pre lang="ts"><code>// The first ng-content will render the default fallback content if present createComponent(MyComponent. { projectableNodes: [[], [secondNode]] }); <p>// To prevent projecting the default fallback content: createComponent(MyComponent. { projectableNodes: [[document.createTextNode('')], [secondNode]] });</p> <p></code></pre></p> </li> <li> <p>Errors that are thrown during <code>ApplicationRef.tick</code> will now be rethrown when using <code>TestBed</code>. These errors should be resolved by ensuring the test environment is set up correctly to complete change detection successfully. There are two alternatives to catch the errors:</p> <ul> <li>Instead of waiting for automatic change detection to happen, trigger</li> </ul> </li> </ul> </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/animations</code>'s changelog</a>.</em></p> <blockquote> <h1>19.0.0 (2024-11-19)</h1> <p>Blog post: <a href="https://blog.angular.dev/meet-angular-v19-7b29dfd05b84">https://blog.angular.dev/meet-angular-v19-7b29dfd05b84</a></p> <h2>Breaking Changes</h2> <h3>compiler</h3> <ul> <li><code>this.foo</code> property reads no longer refer to template context variables. If you intended to read the template variable, do not use <code>this.</code>.</li> </ul> <h3>core</h3> <ul> <li> <p>Angular directives, components and pipes are now standalone by default.</p> <ul> <li>Specify <code>standalone: false</code> for declarations that are currently declared in <code>@NgModule</code>s.</li> <li><code>ng update</code> for v19 will take care of this automatically.</li> </ul> </li> <li> <p>TypeScript versions less than 5.5 are no longer supported.</p> </li> <li> <p>Timing changes for <code>effect</code> API (in developer preview):</p> <ul> <li> <p>effects which are triggered outside of change detection run as part of the change detection process instead of as a microtask. Depending on the specifics of application/test setup, this can result in them executing earlier or later (or requiring additional test steps to trigger; see below examples).</p> </li> <li> <p>effects which are triggered during change detection (e.g. by input signals) run <em>earlier</em>, before the component's template.</p> </li> </ul> </li> <li> <p><code>ExperimentalPendingTasks</code> has been renamed to <code>PendingTasks</code>.</p> </li> <li> <p>The <code>autoDetect</code> feature of <code>ComponentFixture</code> will now attach the fixture to the <code>ApplicationRef</code>. As a result, errors during automatic change detection of the fixture be reported to the <code>ErrorHandler</code>. This change may cause custom error handlers to observe new failures that were previously unreported.</p> </li> <li> <p><code>createComponent</code> will now render default fallback with empty <code>projectableNodes</code>.</p> <ul> <li>When passing an empty array to <code>projectableNodes</code> in the <code>createComponent</code> API, the default fallback content of the <code>ng-content</code> will be rendered if present. To prevent rendering the default content, pass <code>document.createTextNode('')</code> as a <code>projectableNode</code>.</li> </ul> <pre lang="ts"><code>// The first ng-content will render the default fallback content if present createComponent(MyComponent. { projectableNodes: [[], [secondNode]] }); <p>// To prevent projecting the default fallback content: createComponent(MyComponent. { projectableNodes: [[document.createTextNode('')], [secondNode]] });</p> <p></code></pre></p> </li> <li> <p>Errors that are thrown during <code>ApplicationRef.tick</code> will now be rethrown when using <code>TestBed</code>. These errors should be resolved by ensuring the test environment is set up correctly to complete change detection successfully. There are two alternatives to catch the errors:</p> <ul> <li>Instead of waiting for automatic change detection to happen, trigger it synchronously and expect the error. For example, a jasmine test could write <code>expect(() => TestBed.inject(ApplicationRef).tick()).toThrow()</code></li> </ul> </li> </ul> </blockquote> <p>... (truncated)</p> </details> <details> <summary>Commits</summary> <ul> <li><a href="09df589e31"><code>09df589</code></a> refactor(core): Migrate all packages with the <code>explicit-standalone-flag</code> sche...</li> <li><a href="84b6896956"><code>84b6896</code></a> refactor(platform-server): Add an ssr benchmark setup. (<a href="https://github.com/angular/angular/tree/HEAD/packages/animations/issues/57647">#57647</a>)</li> <li><a href="9dbe6fc18b"><code>9dbe6fc</code></a> refactor: update license text to point to angular.dev (<a href="https://github.com/angular/angular/tree/HEAD/packages/animations/issues/57901">#57901</a>)</li> <li>See full diff in <a href="https://github.com/angular/angular/commits/19.0.0/packages/animations">compare view</a></li> </ul> </details> <br /> [](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`. --- <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>
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!)