Fix: Type error on <Image /> component when strict TypeScript rules are used with library type checking.

[admirsaheta]

Changes

• What does this change?
  Fixes the following typescript issue, with it now being explicitly defined to avoid type mismatch on the runtime interpreter

Element implicitly has an 'any' type because expression of type '"data-image-component"' can't be used to index type 'HTMLAttributes<"img">'.
  Property 'data-image-component' does not exist on type 'HTMLAttributes<"img">'.

Testing

Docs

[changeset-bot]

🦋 Changeset detected

Latest commit: e2f956b

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

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

[github-actions]

This PR is blocked because it contains a major changeset. A reviewer will merge this at the next release if approved.

[Fryuni]

Hey @admirsaheta, thanks for the PR! We are always glad to have new contributors.

There are just some things to improve on the changeset:

• Those messages get added to the release notes and to the changelog, so we use clear descriptions of what was changed or fixed for people to understand how it might affect them.
• The changeset also indicates how the change relates to SemVer, so a "major" there would mean a breaking change that would have to wait until Astro 5 to be included. That is not the case here. Since this PR doesn't change any Astro behavior and fixes a problem it can be a patch.

Not a major change

[Princesseuh]

Hmm, I think there's a better fix here. HTMLAttributes not allowing data attributes is a problem

[admirsaheta]

Hmm, I think there's a better fix here. HTMLAttributes not allowing data attributes is a problem

You could extend the interface and provide custom attributes there e.g

interface AdditionalAttributes extends HTMLAttributes<HTMLImageElement> {
    'data-image-component'?: string;
}

Let me know which approach fits better

[florian-lefebvre]

We have been discussing on discord to update the HTMLAttributes. So at

astro/packages/astro/types.d.ts

Line 8 in 1cd2a74

export type HTMLAttributes<Tag extends HTMLTag> = Omit<

allow such type:

[key: `data-${string}`]: any

Do you want to handle it?

[admirsaheta]

Sure thing, give me a few :)

[florian-lefebvre]

There's no rush don't worry!

[admirsaheta]

Should handle it correctly here now 👍

[florian-lefebvre]

@Princesseuh Do you prefer any?

[Princesseuh]

Without necessarily using any, allowing also null would be great

[admirsaheta]

Without necessarily using any, allowing also null would be great

Done

[florian-lefebvre]

LGTM