fix: include styles for img elements while `compileAwayBuilderComponents`

[sidmohanty11]

Description

Style bindings were not accounted for while using compileAwayBuilderComponents plugin. This PR makes sure we have the styles attached to the img elements.

Previously

function MyComponent(props: any) {
  ...
  return (
    <>
        <img
          loading="lazy"
          className="img"
          src={
            type === "Primary" && stateInput === "Default"
              ? "https://cdn.builder.io/api/v1/image/assets/TEMP/ff1535bb3f035f535260dd0463242dadbd5a3b0ed7a209afd653dc3262904a3e?placeholderIfAbsent=true"
              : undefined
          }
        />
      <style jsx>{`
        .img {
          aspect-ratio: 1;
          object-fit: auto;
          object-position: center;
          width: 100%;
        }
      `}</style>
    </>
  );
}

export default MyComponent;

Now

function MyComponent(props: any) {
  ...
  return (
    <>
        <img
          loading="lazy"
          className="img"
          src={
            type === "Primary" && stateInput === "Default"
              ? "https://cdn.builder.io/api/v1/image/assets/TEMP/ff1535bb3f035f535260dd0463242dadbd5a3b0ed7a209afd653dc3262904a3e?placeholderIfAbsent=true"
              : undefined
          }
          style={{
            position:
              type === "Primary" && stateInput === "Default"
                ? "relative"
                : undefined,
            width:
              type === "Primary" && stateInput === "Default"
                ? "100%"
                : undefined,
            display:
              type === "Primary" && stateInput === "Default"
                ? "inherit"
                : "none",
          }}
        />
      <style jsx>{`
        .img {
          aspect-ratio: 1;
          object-fit: auto;
          object-position: center;
          width: 100%;
        }
      `}</style>
    </>
  );
}

export default MyComponent;

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: 569927ae19b8bbfbf685ade4c6d38739f6eef881

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 | Patch | | @builder.io/mitosis-cli | Patch |

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

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
mitosis-fiddle	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 29, 2024 6:49am

[nx-cloud[bot]]

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 569927ae19b8bbfbf685ade4c6d38739f6eef881. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution

---

✅ Successfully ran 4 targets

- [`nx build @builder.io/mitosis-fiddle`](https://cloud.nx.app/runs/V9wiwzwr0m?utm_source=pull-request&utm_medium=comment) - [`nx run-many --skip-nx-cache --target build --parallel 4 --exclude */e2e-alpine,*/e2e-angular,@builder.io/mitosis-fiddle,@builder.io/talk-*,@builder.io/example-apps`](https://cloud.nx.app/runs/P91lDvI62f?utm_source=pull-request&utm_medium=comment) - [`nx build @builder.io/eslint-plugin-mitosis`](https://cloud.nx.app/runs/ovfePESMFY?utm_source=pull-request&utm_medium=comment) - [`nx build @builder.io/mitosis`](https://cloud.nx.app/runs/WazQYNA7r1?utm_source=pull-request&utm_medium=comment)

---

Sent with 💌 from NxCloud.