Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add typescript types #57

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add typescript types #57

wants to merge 1 commit into from

Conversation

MoonE
Copy link

@MoonE MoonE commented Jul 25, 2024

I'm not 100% sure using tuple types ([number, number, number]) vs Array<number> is the correct decision. Makes it harder to add e.g. an alpha channel. Though the color array size most likely is fixed most of the time which is why I am using tuples.

By default conversion functions added from other spaces are typed as optional, so with strict null checking you will get an error.
Example usage with JavaScript: and strict type checking.

import _rgb from 'color-space/rgb.js';
import _xyz from 'color-space/xyz.js';
import lchuv from 'color-space/lchuv.js';

/** @typedef {[number, number, number, number]} RgbaData */
/** @typedef {[number, number, number, number]} LchaData */
const rgb = /** @type {typeof _rgb & import('color-space/xyz').RgbXyz} */ (
  _rgb
);
const xyz = /** @type {typeof _xyz & import('color-space/lchuv').XyzLchuv} */ (
  _xyz
);

/**
 * @param {RgbaData} color RGBA color.
 * @return {LchaData} LCHuv color with alpha.
 */
export function rgbaToLcha(color) {
  const output = xyz.lchuv(rgb.xyz([color[0], color[1], color[2]]));
  return [...output, color[3]];
}

/**
 * @param {LchaData} color LCHuv color with alpha.
 * @return {RgbaData} RGBA color.
 */
export function lchaToRgba(color) {
  const output = xyz.rgb(lchuv.xyz([color[0], color[1], color[2]]));
  return [...output, color[3]];
}

When using the full import, all functions are always defined, no problem with strict type checking

import spaces from 'color-space';
const xyzColor = space.rgb.xyz([255, 0, 0]);

Feedback is welcome. This is the first time I'm writing type declarations.

@dy
Copy link
Member

dy commented Jul 26, 2024

@MoonE do you think there might be a simple generic way to define types? I'd ideally want to see a single .d.ts file or not see them at all...
Color spaces are static objects, they should not require heavy or duplicating type definitions.
That's great work but it looks a bit of overkill for the purpose of intellisense, no?

@MoonE
Copy link
Author

MoonE commented Jul 26, 2024

I don't think it is possible to define types in a generic way because while most spaces are very similar there are some variations on what functions are available and which parameters they take.
Also the way spaces add functions to other spaces when imported makes it difficult to have exact types.

It might be possible to have a script generate the big index.d.ts and maybe it's also possible to combine the files into one, I'll have to look into if you'd prefer that.

@dy
Copy link
Member

dy commented Jul 27, 2024

Would it make sense maybe to publish the types under @types/color-space? I would really like to keep maintenance easy. I can invite you to the org if you want.

@MoonE
Copy link
Author

MoonE commented Jul 27, 2024

What org would you invite me to? I don't think I need anything to submit types to the DefinitelyTyped project.

@dy
Copy link
Member

dy commented Sep 15, 2024

Right. Sorry for late response. DefinitelyTyped would be a better place for that I believe, I'd encourage keeping lib code simple.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants