How to add TypeScript signatures

[gabrielflorit]

I'm having a bit of a hard time understanding how to type the signature here. E.g. what would be the TS signature for the example in the README?

<button {{on "click" (fn (set this "greeting") "Hola!")}}>
  Español
</button>

[knownasilya]

Probably something about generics, do you have an example of the type you have now? I'm assuming glint.

[johanrd]

Hi. The helper function itself is typed in main (https://github.com/adopted-ember-addons/ember-set-helper/blob/main/ember-set-helper/src/helpers/set.ts). yet the V2 version (with types) is not published to npm.

I am not fully sure how to build and publish to npm with types, so help is appreciated

[knownasilya]

So you are just waiting for the new version to be published, got it.

[gabrielflorit]

Let me explain a bit. Take the Counter example. This is my attempt at converting it to TypeScript:

// app/components/counter.ts
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';

interface CounterSignature {
  Args: {
    onClick: (count: number) => void; 
  }
}

export default class Counter extends Component<CounterSignature> {
  @tracked count = 0;

  @action
  updateCount() {
    this.count++;

    if (this.args.onClick) {
      this.args.onClick(this.count);
    }
  }
}

But this results in a TypeScript error here:

<!-- usage -->
// Error: Type 'string' is not assignable to type '(count: number) => void'
<Counter @onClick={{set this "currentCount"}} /> 

I'm a little at a loss as to how to proceed.

[knownasilya]

Give v3.0.0 of this addon a try

[gabrielflorit]

@knownasilya I get the following error on 3.0.0:

ember-set-helper at /Users/.../node_modules/ember-set-helper is missing its addon main file

[cah-brian-gantzler]

@knownasilya I get the following error on 3.0.0:

ember-set-helper at /Users/.../node_modules/ember-set-helper is missing its addon main file

same

[johanrd]

@gabrielflorit @cah-brian-gantzler Can you try with 3.0.1?

I now get types in glint by import set from 'ember-set-helper/helpers/set'.

(…we could perhaps consider to make it possible to also import set from 'ember-set-helper or import { set } from 'ember-set-helper?)

[cah-brian-gantzler]

Will try it. I like the import { set } version, however I would normally do import {set as setHelper} because this addon has the conflict should set from ember/object also be used. When importing this as set, the error that is generated is not immediately obvious. Just an FYI

[cah-brian-gantzler]

Working correctly now. Thanks

[MichalBryxi]

Working correctly now. Thanks

Has this been released @cah-brian-gantzler ?

When using "ember-set-helper": "^3.0.1" following code:

import { set as setHelper } from 'ember-set-helper';

...

<template>
  <Foo @onChange={{setHelper this.settings 'date'}} />
</template>

I get following error:

Error: Attempted to use a value as a helper, but it was not an object or function. Helper definitions must be objects or functions with an associated helper manager. The value was: undefined

[johanrd]

@MichalBryxi: Currently, the import is import set from 'ember-set-helper/helpers/set', or in your case import setHelper from 'ember-set-helper/helpers/set'