Box: Using "start" as a value for textAlign doesn't add text alignment

🐛 Bug report

Current behavior

Using "start" as a value for textAlign prop doesn't add any text alignment. This means it is impossible to left align content that is nested under a component with a different text alignment.

Steps to reproduce the bug

You can see a reproduction of this issue in this Sandbox https://codesandbox.io/s/ancient-wave-dr52s?file=/src/App.js:205-266. I

Expected behavior

You should be able to left align content, no matter what the parent styles are.

Possible solutions

Currently, the textAlign property defaults to "start", which ends up being a no-op:

reactist/src/new-components/box/box.tsx

Lines 151 to 153 in 02bd83e

    
           getClassNames(widthStyles, 'maxWidth', maxWidth), 
        
           textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null, 
        
           // padding

I think it would make sense for textAlign to not have a default value, and then make "start" behave the same way as the other values like "center" and "end".

Environment

@doist/reactist version: 11.0.0
react version: 17.0.2
Browser: Chrome

Also, if this is a confirmed bug that we want to fix I can create a PR to do so.

Sounds like a bug to me – any objections here @gnapse?

Yup, I did not think of the cascade when I did this 😅

I now realize it is better to be explicit all the time.

@pauloslund did you end up doing something about this?

@gnapse I did! Although I just created the PR for it now

	getClassNames(widthStyles, 'maxWidth', maxWidth),
	textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null,
	// padding