ekros / nice-react-layout Goto Github PK

Any plan to add an online demo?

If you have, let's say, a four-panel horizontal layout with a separator in the middle and you drag one panel from the left side to the right side or viceversa, the separator starts to behave weirdly when dragged. After some research, I narrowed it down to the internal representation of the layout (layout and layoutOrdering in the Layout state). It seems to happen when the original layoutOrdering is modified. This ordering modifies the order attribute of the flex items.

Given the following code:

<HorizontalLayout>
  <Panel></Panel>
  {foo ? <Panel></Panel> : null}
</HorizontalLayout>

It throws an error: TypeError: Cannot read property 'id' of null

It should ignore nullish children so this kind of logic can be used.

I came across an issue when I was adding panels dynamically. Please take a look at my work around:
https://github.com/ekros/nice-react-layout/compare/master...Jaygiri:patch-1?expand=1

Thanks for your work.

If I try to compose a layout from separate functional components then some features (e.g. mockup colors and fixedHeights) are ignored.

e.g. The following will split the space evenly between both panels and not color the 1st panel.

const Header = (height, message) => (
  <Panel fixed fixedHeight={150}>{message}</Panel>
);

return (
  <View>
    <VerticalLayout mockup>
      <Header message={'Hello'} />
      <Panel>World</Panel>
    </VerticalLayout>
  </View>
);

First of all, thanks for a promising library which is both easy to use and yields good results.

It seems that when interaction/moving a separator it's logging in the console on every interaction. Is there any plan to remove logging on build?

Thanks