Skip to content

Conversation

@sidmohanty11
Copy link
Collaborator

@sidmohanty11 sidmohanty11 commented Apr 8, 2025

Description

Adds support for handling:

  • Template strings inside templates - converts them to a computed value
  • Spread values inside template - converts them to a computed value
  • TS as X expressions inside template - converts them to a computed value
  • export default class functionality
  • dynamic components
  • handle dependent signals by setting them onInit
  • onMount hook code only runs on the browser after view init
  • ngSkipHydration using useMetadata
  • helper functions to set attributes and events on an element on arbitrary spread
  • typed inputs
  • handles computed in two different ways - if it's inside a For context and needs index it uses just functions and if it's not then it uses Angular's computed
  • binding functions when passed as props

Fixes:

  • Fns getting passed as fn() with callable expression
  • arguments of callable expression (fn/method) not updating state.x or props.x to x().

Make sure to follow the PR preparation steps in CONTRIBUTING.md before submitting your PR:

  • format the codebase: from the root, run yarn fmt:prettier.
  • update all snapshots (in core & CLI): from the root, run yarn test:update
  • add Changeset entry: from the root, run yarn g:changeset and follow the CLI instructions. Alternatively, use the Changeset Github Bot to create the file.

@changeset-bot
Copy link

changeset-bot bot commented Apr 8, 2025

🦋 Changeset detected

Latest commit: 5c66772

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages
Name Type
@builder.io/mitosis Minor
@builder.io/mitosis-cli Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@nx-cloud
Copy link

nx-cloud bot commented Apr 8, 2025

View your CI Pipeline Execution ↗ for commit 5c66772.

Command Status Duration Result
nx e2e @builder.io/e2e-app ✅ Succeeded 1m 15s View ↗
nx run-many --target test ✅ Succeeded 5m 6s View ↗
nx run-many --target build --exclude @builder.i... ✅ Succeeded 3m 52s View ↗
nx build @builder.io/mitosis-site ✅ Succeeded 2m 26s View ↗

☁️ Nx Cloud last updated this comment at 2025-05-27 10:51:13 UTC

@sidmohanty11 sidmohanty11 marked this pull request as ready for review April 17, 2025 12:07
@sidmohanty11 sidmohanty11 requested a review from samijaber as a code owner April 17, 2025 12:07
@sidmohanty11
Copy link
Collaborator Author

@samijaber this PR is ready for review. Will create a loom shortly, going through the changes.

@nmerget it would mean a lot if you could take a look too!

@sidmohanty11 sidmohanty11 changed the title angular signals generator improvements feat: angular signals generator improvements Apr 17, 2025
Copy link
Contributor

@samijaber samijaber left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🔥 🚀

@@ -0,0 +1,11 @@
import { BaseHook, OnMountHook } from '@/types/mitosis-component';

export const isHookEmpty = (hook?: BaseHook | BaseHook[] | OnMountHook[]): boolean => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, been meaning to add that logic somewhere. Might even make sense to put it somewhere that applies to all generators. somewhere like

export const initializeOptions = <T extends BaseTranspilerOptions>({

after processTargetBlocks runs, therefore we know if a hook is actually empty for that given target and can delete it completely.

Not for this PR, just a thought for the future

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sure! yeah, saw a bunch of empty hooks inside the codebase mostly due to the usage of useTarget to add code for certain SDKs only. will create a PR for this soon

@sidmohanty11 sidmohanty11 merged commit 3ac5f63 into BuilderIO:main May 27, 2025
7 checks passed
@nmerget
Copy link
Contributor

nmerget commented May 28, 2025

@samijaber this PR is ready for review. Will create a loom shortly, going through the changes.

@nmerget it would mean a lot if you could take a look too!

@sidmohanty11 I'm so sorry forgot to check this again. I'll update my own branch and fix some minor issues I found.

I didn't check it deeply, but I think it looks very nice :)

sidmohanty11 added a commit to BuilderIO/builder that referenced this pull request May 30, 2025
## Description

Uses the Angular signals generator:
BuilderIO/mitosis#1748 and does a major
performance revamp

fixes #3904

_Screenshot_
If relevant, add a screenshot or two of the changes you made.
murrayadam pushed a commit to murrayadam/builder that referenced this pull request Sep 5, 2025
## Description

Uses the Angular signals generator:
BuilderIO/mitosis#1748 and does a major
performance revamp

fixes BuilderIO#3904

_Screenshot_
If relevant, add a screenshot or two of the changes you made.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants