Type error in v14.0

[Saul-Mirone]

Describe the bug

../../node_modules/.pnpm/twemoji@14.0.0/node_modules/twemoji/index.d.ts:32:1 - error TS1046: Top-level declarations in .d.ts files must start with either a 'declare' or 'export' modifier.

32 const twemoji: {

To Reproduce
Steps to reproduce the behavior:

1. Go to https://github.com/Saul-Mirone/milkdown
2. git checkout renovate/all
3. pnpm install && pnpm build --filter=@milkdown/plugin-emoji
4. See error

Expected behavior
Typescript compile can pass with no error.

Screenshots
If applicable, add screenshots to help explain your problem.

Environment
For web, specify your OS and browser version. For mobile, specify device, OS
and version. For libraries, what version of build tools are you using?

Additional context
Add any other context about the problem here.

[BenjaminNolan]

In addition to the above, we're getting a TypeScript error when calling Twemoji.parse() as it is incorrectly typed as returning void here, when it actually returns a string. See scripts/build.js examples, which all return strings. The fix for this bit, at least, is to just change the : void; on 37 to : string;.

[hthetiot]

I made PR #533 to address this issue feedbacks.
If you need quick fix you can update tsconfig.json with "twemoji": ["src/twemoji.d.ts"] in "ts-node".moduleTypes section and use the following content for src/twemoji.d.ts.

src/twemoji.d.ts

declare interface TwemojiOptions {
  /**
   * Default: MaxCDN
   */
  base?: string;
  /**
   * Default: .png
   */
  ext?: string;
  /**
   * Default: emoji
   */
  className?: string;
  /**
   * Default: 72x72
   */
  size?: string | number;
  /**
   * To render with SVG use `folder: svg, ext: .svg`
   */
  folder?: string;
  /**
   * The function to invoke in order to generate image src(s).
   */
  callback?(icon: string, options: TwemojiOptions): void;
  /**
   * Default () => ({})
   */
  attributes?(): void;
}

declare type Twemoji = {
  convert: {
    fromCodePoint(hexCodePoint: string): string;
    toCodePoint(utf16surrogatePairs: string): string;
  };
  parse(node: HTMLElement | string, options?: TwemojiOptions): void;
};

declare module 'twemoji' {
  const twemoji: Twemoji;
  export default twemoji;
}

tsconfig.json:

{
    "ts-node": {
        "moduleTypes": {
            "twemoji": ["src/twemoji.d.ts"]
        },
    },
   // ...
}

[hthetiot]

I had some weird issue with that tsconfig.json workaround above to override the index.d.ts while fix is not merged, where module types was ignored on Linux (GitHub CI) but not on macOS, in the end I just added skipLibCheck as a temporary workaround for the workaround.

[jdecked]

Fix is merged now; FWIW I'm happy to merge whatever typescript fixes there are relatively quickly in the future – we don't use TS at Twitter, so there's always a chance that whatever exists for TS types in master is somehow broken or incorrect. Thanks for catching it.

[hthetiot]

Thank you @jdecked for quick merge, i have tested twemoji@14.0.1 with typescript@4.5.5 and angular@13.2.6 following syntax works as expected now.

const twemoji = await import('twemoji').then((m) => m.default);

OR

import twemoji from "twemoji";

@Saul-Mirone and @BenjaminNolan all good on your side now using 14.0.1 ?