jaredh159 / tailwind-react-native-classnames

simple, expressive API for tailwindcss + react-native
2.08k stars 84 forks source link

Feature request: Like `tw.color('yellow-400')` but for size! #250

Closed apbarratt closed 1 year ago

apbarratt commented 1 year ago

Oh how often I wish I could use something like tw.size('h-12') and get 48 out.

I'm assuming height and border and width etc can be configured differently, though I haven't tried it myself, but if not, then yeah, maybe all I really wish for is tw.size(12).

jaredh159 commented 1 year ago

hi, thanks for the issue. i'm sympathetic to your desire for a helper function like this.

i think the issue with a generic tw.size(...) function would be that different utilities refer to different unit types (though most of them are functionally pixels), so i'm not sure it would be immediately intuitive what sort of result it would give back. so, i'm not sure that adding something like this to the library would be worth it.

but, that said, it would be trivial to define a helper function to do it for you, something like this:

function size(num) {
  return tw(`h-${num}`).height;
}

If you're writing typescript, you might need to convince the typechecker, but that's really as easy as it is. You could theoretically even augment tw by doing something like tw.size = function(num) ...