typed-ember / glint

TypeScript powered tooling for Glimmer templates
https://typed-ember.gitbook.io/glint
MIT License
108 stars 50 forks source link

[feat] improve attributes transform semantics to match hbs AST #695

Open lifeart opened 5 months ago

lifeart commented 5 months ago

Handlebars AST attribute representation: (array of elements)

image

In scope of this PR we matching attributes to hbs semantics, where it's represented as array of key-value pairs, instead of record. It gives us more flexibility in syntaxes and reduce potential fail-cases because attribute name is explicitly string.

And getting rid of An object literal cannot have multiple properties with the same name typescript error.

- export declare function applyAttributes(element: Element, attrs: Record<string, AttrValue>): void;
+ export declare function applyAttributes(element: Element, attrs: Array<[string, AttrValue]>): void;

Resolves: https://github.com/typed-ember/glint/issues/693

Note, we not getting DX worse, because template-lint has rule to warn about duplicated attributes: https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-duplicate-attributes.md


Sidenote:

It seems we could have autocomoplete/attibutes validation if replace

export declare function applyAttributes(element: Element, attrs: Array<[string, AttrValue]>): void;

With

export declare function applyAttributes<T extends Element, K extends keyof T>(element: T, attrs: Array<[K, T[K] | SafeString]>): void;
image image

ts playground

patricklx commented 5 months ago

this is also beeing worked on in #663, i mean the attributes autocomoplete/validation