* Make PaintEditor component rtl aware
Fixes the color-picker and any other popover elements.
Adds an RTL prop to the PaintEditor that initializes the `layout` state in redux. Any other components that need to know the layout refer to the state in redux.
I debated whether the state should just be a boolean (true for RTL), or ‘rtl’, ‘ltr’. I went with the latter, but could be convinced that boolean would be better.
I did not add `dir=“rtl”` to the font picker dropdown as all the names are in LTR languages.
Question: Should the sliders reverse direction, and if so, is it worth doing right now when the layout of the color picker may change.
Adding the rtl prop and the `dir=…` to the PaintEditorComponent fixes layout issues in the playground.
* Don’t reverse gradient swatches: the fill colors (and swatch preview) should represent the way the left-right colors will blend when filling a shape.
* Mirror margins, borders and arrow icons for RTL
This handles everything exception the color picker.
I verified that things like the paint brush and magnifying glass should not be mirrored (even people who read Hebrew are usually right-handed)
* Fix dropdown icon padding in RTL
When using images as clickable elements (within buttons or alone) you
need to mark them as not draggable. They are draggable by default and
starting a drag prevents the onClick from being handled, messing up the
clickable behavior.
#226 appears to be caused when the duration in ms is below a certain value, which is why we don’t see it in other popovers. I’m not sure exactly what may be causing this in the `react-popover` library and will open an issue about it, but for now, 20ms is imperceptibly fast, and removes the error.
make the swatches aligned in gui, and make sure the cursor shows when not eye dropping. Also moves eye dropper initialization into the helper. Thanks @paulkaplan!
1. Removes the cursour over loupe, and fills the loupe center’s color correctly
2. Fixes a console error and loupe initialization issue
3. Increases the size of the swatches
Thanks @paulkaplan!
Turns out that the width/height paper sets on the canvas is tracked at scale to the width/height we set in the `pixelRatio` value, so use that to handle grabbing pixel color rather than a constant we set.
fixes lint and gui compatibility issues shown by @paulkaplan, and also does some cleanup to references and structure as requested by @fsih. Thanks to both of you for the reviews!
FYI – part of the canvas reference change made it so that the `PaintEditor` presentation component could become a classless declaration.
squish some things together a bit more, including in desktop mode (in order to fit the coming “rotation point” button). Also turn canvas into 480x360, as it is in the mocks