masua 0.10.0 → 0.10.1

package/README.md

@@ -4,7 +4,7 @@
 
 # masua
 
-Simple masonry layout library in TypeScript.
+Simple masonry layout library in TypeScript. Initially forked from [minimasonry](https://github.com/Spope/MiniMasonry.js) by Spope.
 
 ## Usage
 
@@ -12,6 +12,16 @@ Simple masonry layout library in TypeScript.
 import { grid } from 'masua'
 
 grid(document.querySelector('#my-grid'))
+// With configuration options.
+grid(document.querySelector('#my-custom-grid'), {
+  gutter: 20,
+  baseWidth: 300,
+  minify: false,
+  surroundingGutter: true,
+  ultimateGutter: 10,
+  direction: 'rtl',
+  wedge: true,
+})
 ```
 
 ## React
@@ -20,7 +30,7 @@ grid(document.querySelector('#my-grid'))
 import { Grid } from 'masua'
 
 const MyGrid = () => (
-  <Grid>
+  <Grid disabled={window.innerWidth < 501}>
     <Box />
     <Box size={3} />
     <Box size={2} />

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "masua",
   "description": "Simple masonry layout library in TypeScript.",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "repository": "github:tobua/masua",
   "homepage": "https://tobua.github.io/masua",
   "license": "MIT",

package/react.tsx

@@ -19,6 +19,7 @@ const configurationProperties = [
 
 export function Grid({
   disabled = false,
+  children,
   ...props
 }: JSX.IntrinsicElements['div'] & Partial<ReactConfiguration>) {
   const gridRef = useRef(null)
@@ -37,7 +38,11 @@ export function Grid({
   useEffect(() => {
     if (disabled) return () => {}
     return grid(gridRef.current, configurationProps).destroy
-  }, [])
+  }, [children])
 
-  return <div ref={gridRef} {...props} />
+  return (
+    <div ref={gridRef} {...props}>
+      {children}
+    </div>
+  )
 }