Doesn't support Classic components

[boris-petrov]

Component TS:

import Component from '@ember/component';

export default class ClassicComponent extends Component {
  public foo!: string;
}

Component HBS:

{{log @foo}}

Leads to:

Property 'foo' does not exist on type '{}'.typed-templates

[lifeart]

Yeah, support of classic components - it’s a thing to improve, especially for arguments, it’s require more static analysis, not related to typescript itself

[lifeart]

I think for now we could go with support of optional types as arguments for ember components

`
public foo?: null

`

[lifeart]

import Component from '@ember/component';

type OptionalKeys<T> = { [K in keyof T]-?: {} extends { [P in K]: T[K] } ? K : never }[keyof T];

type RequiredKeys<T> = { [K in keyof T]-?: {} extends { [P in K]: T[K] } ? never : K }[keyof T];
type PickRequired<T> = Pick<T, RequiredKeys<T>>;

type PickOptional<T> = Pick<T, OptionalKeys<T>>;

type Nullable<T> = { [P in keyof T]: T[P] | null };

type NullableOptional<T> = PickRequired<T> & Nullable<PickOptional<T>>;


class NlassicComponent extends Component {
  foo!: string;
  name?: number;
  boo: string = 'a';
}


export default class ClassicComponent extends Component {
  name = 'st'
  items!: PickOptional<NlassicComponent>;
  botems!: PickOptional<NlassicComponent>;
  boo = this.items.name;
  a = this.botems.foo;
}

[lifeart]

PickOptional will be used for args

[lifeart]

but, I'm not getting how to describe it in typescript :) (without generic notation)
We have to define it like

 get args(): Args & PickOptional<this> {
      return this._args as Args & PickOptional<this>;
    }

but this, will be this of Component, not it's child