wadackel / react-stack-grid

Pinterest like layout components for React.js
https://wadackel.github.io/react-stack-grid/
MIT License
870 stars 77 forks source link

RTL Layout #33

Closed azizghuloum closed 7 years ago

azizghuloum commented 7 years ago

Hello, I have added rtl option to StackGrid:

the purpose is to layout items from right-to-left instead of the default left-to-right The implementation is straightforward: instead of having the StackItem start with left:0 and transformX:${left}px, when rtl is true, we start with right:0 and transformX${-left}px. I updated the demo to include a checkbox for switching RTL/LTR. Run npm start then check/uncheck the RTL checkbox and see how it works.

I added tests for this functionality.

The code passes npm test.

I updated the document at README.md.

azizghuloum commented 7 years ago

Here's a branch with the first commits and without the resizing stuff.

azizghuloum commented 7 years ago

You said that this change has some problems. May I know what these problems are? Or maybe you were referring to the changes related to resize detection?

wadackel commented 7 years ago

Hi @azizghuloum Thanks!

You said that this change has some problems. May I know what these problems are? Or maybe you were referring to the changes related to resize detection?

I thought that the following two were the problems.

Problem.1

javascript-detect-element-resize affects global objects. Personally I prefer using ponyfill rather than polyfill to minimize the influence on the outside.

For example que-etc/resize-observer-polyfill seems to be useful :+1: Specification close to the standard API is preferable.

Problem.2

2017-10-30 21 48 36

When running the RealWorld sample, PropTypes error has appeared.