[GH-ISSUE #122] TypeScript type declaration #74

Closed
opened 2026-05-05 11:37:50 -06:00 by gitea-mirror · 9 comments
Owner

Originally created by @khanhas on GitHub (May 11, 2018).
Original GitHub issue: https://github.com/kusti8/proton-native/issues/122

I have recently just pulled request new definition files for our package on DefinitelyTyped. If this goes through, TypeScript user will be able to install @types/proton-native package and start making app with TypeScript easier and faster.

I covered almost all Components , but it still has some problems and I need your help:

  • Passing props for children.
    • Grid's row, column or Form's label are props that are only available for components inside them. They shouldn't available for components outside of <Grid></Grid>, <Form></Form>. I don't know how to achieve that.
  • Universal props
    • Although currently, there's only one universal prop but how it is defined halt me from adding it in. Are all universal props from now on always excluded from Tabs, Grid children, Combobox/RadioButton Items, MenuBar? Or each one of them will have a separate list of exclusion? Depends on that, I choose a fast approach to extends props list for all components.

If you like TypeScript and Proton-native and want to contribute, please do comment it here or my pull request on DefinitelyTyped or pull a request on my fork.
Any help would be greatly appreciated!
Happy coding!

Originally created by @khanhas on GitHub (May 11, 2018). Original GitHub issue: https://github.com/kusti8/proton-native/issues/122 I have recently just pulled request new definition files for our package on [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/25705). If this goes through, TypeScript user will be able to install `@types/proton-native` package and start making app with TypeScript easier and faster. I covered almost all Components , but it still has some problems and I need your help: - [x] Passing props for children. - [Grid](https://proton-native.js.org/#/component_APIs/grid_components)'s `row`, `column` or [Form](https://proton-native.js.org/#/component_APIs/form)'s `label` are props that are only available for components inside them. They shouldn't available for components outside of `<Grid></Grid>`, `<Form></Form>`. I don't know how to achieve that. - [x] Universal props - Although currently, there's only one universal prop but how it is defined halt me from adding it in. Are all universal props from now on always excluded from Tabs, Grid children, Combobox/RadioButton Items, MenuBar? Or each one of them will have a separate list of exclusion? Depends on that, I choose a fast approach to `extends` props list for all components. If you like TypeScript and Proton-native and want to contribute, please do comment it here or my pull request on [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/25705) or pull a request on [my fork](https://github.com/khanhas/DefinitelyTyped). Any help would be greatly appreciated! Happy coding!
Author
Owner

@kusti8 commented on GitHub (May 11, 2018):

Looks nice. I haven't done TypeScript at all, so I wouldn't really be of much use. So as for your first point, I don't know what's available or what can be done. For your second point, universal props aren't a set list with set exclusions. They're a list of props that most items implement.

<!-- gh-comment-id:388472045 --> @kusti8 commented on GitHub (May 11, 2018): Looks nice. I haven't done TypeScript at all, so I wouldn't really be of much use. So as for your first point, I don't know what's available or what can be done. For your second point, universal props aren't a set list with set exclusions. They're a list of props that most items implement.
Author
Owner

@khanhas commented on GitHub (May 12, 2018):

Thank you very much! I will include universal prop soon.
I create this Issue for more like a discussion thread than an actual issue. So can you add some label for this thread to gain some attention from user/dev that are familiar with using React/React Native + TypeScript?

<!-- gh-comment-id:388526729 --> @khanhas commented on GitHub (May 12, 2018): Thank you very much! I will include universal prop soon. I create this Issue for more like a discussion thread than an actual issue. So can you add some label for this thread to gain some attention from user/dev that are familiar with using React/React Native + TypeScript?
Author
Owner

@kusti8 commented on GitHub (May 21, 2018):

Hey @khanhas what's the status on this?

<!-- gh-comment-id:390780981 --> @kusti8 commented on GitHub (May 21, 2018): Hey @khanhas what's the status on this?
Author
Owner

@parro-it commented on GitHub (May 22, 2018):

@khanhas, you may find helpful to coordinate your efforts with @sandangel that is working on https://github.com/parro-it/libui-node/pull/112 to add typescript types in libui-node.

<!-- gh-comment-id:390858413 --> @parro-it commented on GitHub (May 22, 2018): @khanhas, you may find helpful to coordinate your efforts with @sandangel that is working on https://github.com/parro-it/libui-node/pull/112 to add typescript types in libui-node.
Author
Owner

@khanhas commented on GitHub (May 22, 2018):

New update waiting for approval: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/25936

Changes:

  • Added Grid children, label, stretchy props
    Since I haven't figured it out how to pass props for children, I let all components have Grid children and label props. stretchy added where needed. This solution ensure that it won't raise any error on these props.
    Although so, I'm still not quite happy with it. Because we have to sacrifice "strictness" of type of certain components, like stretchy still can be applied in grid children and Grid children props can be used in every components even they're not inside a Grid .
    On the bright side, we are able to outsource children component in another class and still have its proper additional props.

  • Specified children type for some components.

  • Slider: added max, min props

  • ColorButton: onClick to onChange

  • Removed undocumented components.
    I just realized they are just components for bigger wrapper components, not "new,
    cutting edge" components waiting to be finished and released. User can't use them anyway so their definition are better be removed.

<!-- gh-comment-id:390962653 --> @khanhas commented on GitHub (May 22, 2018): New update waiting for approval: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/25936 **Changes:** - Added Grid children, label, stretchy props Since I haven't figured it out how to pass props for children, I let all components have Grid children and `label` props. `stretchy` added where needed. This solution ensure that it won't raise any error on these props. Although so, I'm still not quite happy with it. Because we have to sacrifice "strictness" of type of certain components, like `stretchy` still can be applied in grid children and Grid children props can be used in every components even they're not inside a `Grid` . On the bright side, we are able to outsource children component in another class and still have its proper additional props. - Specified children type for some components. - `Slider`: added `max`, `min` props - `ColorButton`: `onClick` to `onChange` - Removed undocumented components. I just realized they are just components for bigger wrapper components, not "new, cutting edge" components waiting to be finished and released. User can't use them anyway so their definition are better be removed.
Author
Owner

@khanhas commented on GitHub (May 22, 2018):

@parro-it If you don't want to unnecessarily include Typescript and its dependencies for your project, I think it's best to pull a "Add type" request on DefinitelyTyped and let them do the job.

<!-- gh-comment-id:390966407 --> @khanhas commented on GitHub (May 22, 2018): @parro-it If you don't want to unnecessarily include Typescript and its dependencies for your project, I think it's best to pull a "Add type" request on DefinitelyTyped and let them do the job.
Author
Owner

@parro-it commented on GitHub (May 22, 2018):

I don't know exactly, I never used typescript, as I said, @sandangel is doing the work...
Anyway, the typescript dependency is actually added as a dev dependency, which I don't care.

<!-- gh-comment-id:390967640 --> @parro-it commented on GitHub (May 22, 2018): I don't know exactly, I never used typescript, as I said, @sandangel is doing the work... Anyway, the typescript dependency is actually added as a dev dependency, which I don't care.
Author
Owner

@khanhas commented on GitHub (Jun 10, 2018):

Area.Text are already added in @types/proton-native and waiting for approval.
Tracks its progress here: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/26406

Changes:

  • Added AreaTextProps and AreaText component

If you want to play with Area.Text right now, manually replace this index.d.ts with the one in ./node_modules/@types/proton-native/.
Reload your editor.

<!-- gh-comment-id:396020287 --> @khanhas commented on GitHub (Jun 10, 2018): Area.Text are already added in @types/proton-native and waiting for approval. Tracks its progress here: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/26406 ### Changes: - Added AreaTextProps and AreaText component If you want to play with Area.Text right now, manually replace this [`index.d.ts`](https://github.com/khanhas/DefinitelyTyped/blob/5d209bbbcede0582a157ee4a26b09af671409bfc/types/proton-native/index.d.ts) with the one in `./node_modules/@types/proton-native/`. Reload your editor.
Author
Owner

@kusti8 commented on GitHub (Jun 19, 2018):

Thanks for the work on this! Added to docs in 62e4b00

<!-- gh-comment-id:398239092 --> @kusti8 commented on GitHub (Jun 19, 2018): Thanks for the work on this! Added to docs in 62e4b00
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/proton-native#74
No description provided.