Comments (1)
Hello,
I agree they are more disappointing that I would have liked/hoped. As you mentioned, the library depends on csstype
to tackle this. The library was mainly chosen because it is what React itself uses for its style
prop under the hood, so it makes sense to use it for React component libraries for compatibility and an assumption that it is the best solution they could find.
After some thought, I'm guessing the main issue on why it's so loosely typed is because of the vast number of options.
If you consider something simple like padding
, it has to support:
style={{ padding: 1 }}
which translates topadding: 1px;
style={{ padding: '1px' }}
which also translates topadding: 1px;
style={{ padding: '1em' }}
which translates topadding: 1em;
style={{ padding: '1pt' }}
which translates topadding: 1pt;
style={{ padding: '1pc' }}
which translates topadding: 1pc;
- ...
And that doesn't include the shortcuts such as style={{ padding: '5em 10em' }}
or style={{ padding: '1em 2em 3em 4em' }}
.
So the type would have to be number
, or string
s that are a number
followed by px
or em
or pt
... , and then these combined into a possible pair or as a four.
I'm not sure there is any valid way to do this in Typescript other than a list of all possible values such as '1px' | '2px' | '3px'
and so on. I found that with the fairly limited number of conditional type definitions I included in these libraries, I had to put a disclaimer in the README as it was starting to overwhelm VS Code with the conditional type suggestion.
I think the best we could realistically hope for are console
warnings at development time using regexes or something?
Apologies I've not really provided a solution 😕
from react-css-grid.
Related Issues (5)
- Feature request: `as` prop HOT 3
- React 18? HOT 2
- v2 still works with React v17 HOT 5
- Reliability HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-css-grid.