feat: 氧化铝数字孪生系统监控大屏完成

node_modules/react-responsive-masonry/LICENCE.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) Cédric Delpoux
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

node_modules/react-responsive-masonry/README.md

@@ -0,0 +1,125 @@
+# react-responsive-masonry
+
+[![npm package][npm-badge]][npm] [![Travis][build-badge]][build]
+[![Codecov][codecov-badge]][codecov] ![Module formats][module-formats]
+
+A lightweight React responsive masonry component built with css flexbox.
+
+## Getting started
+
+[![react-responsive-masonry](https://nodei.co/npm/react-responsive-masonry.png?downloads=true&downloadRank=true&stars=true)](https://nodei.co/npm/react-responsive-masonry/)
+
+You can download `react-responsive-masonry` from the NPM registry via the `npm` or
+`yarn` commands
+
+```shell
+yarn add react-responsive-masonry
+npm install react-responsive-masonry --save
+```
+
+If you don't use package manager and you want to include `react-responsive-masonry`
+directly in your html, you could get it from the UNPKG CDN
+
+```html
+https://unpkg.com/react-responsive-masonry/umd/react-responsive-masonry.js
+```
+
+## Demo
+
+See [Demo page][github-page]
+
+## Example
+
+![React-responsive-masonry gif](/demo/src/example.gif)
+
+## Usage
+
+If you want the number of columns change by resizing the window, you need to wrap the `Masonry` component by the `ResponsiveMasonry` component.
+Otherwise, you only need to use the `Masonry` component.
+
+```js
+import React from "react"
+import Masonry, {ResponsiveMasonry} from "react-responsive-masonry"
+
+// The number of columns and the gutter change by resizing the window
+class MyWrapper extends React.Component {
+    render() {
+        return (
+            <ResponsiveMasonry
+                columnsCountBreakPoints={{350: 1, 750: 2, 900: 3}}
+                gutterBreakpoints={{350: "12px", 750: "16px", 900: "24px"}}
+            >
+                <Masonry>
+                    <ChildA />
+                    <ChildB />
+                    {/* Children */}
+                    <ChildY />
+                    <ChildZ />
+                </Masonry>
+            </ResponsiveMasonry>
+        )
+    }
+}
+
+// The number of columns and the gutter don't change by resizing the window
+class MyWrapper extends Component {
+    render() {
+        return (
+            <Masonry columnsCount={3}>
+                <ChildA />
+                <ChildB />
+                {/* Children */}
+                <ChildY />
+                <ChildZ />
+            </Masonry>
+        )
+    }
+}
+```
+
+## Props
+
+### Mansonry component
+
+| Name         | PropType | Description                                            | Default |
+| ------------ | -------- | ------------------------------------------------------ | ------- |
+| columnsCount | Number   | Injected by ResponsiveMasonry                          | 3       |
+| gutter       | String   | Margin surrounding each item e.g. "10px" or "1.5rem"   | "0"     |
+| containerTag | String   | Tag name of the container element                      | "div"   |
+| itemTag      | String   | Tag name of the item element                           | "div"   |
+| itemStyle    | Object   | Style object applied to each item                      | {}      |
+| sequential   | Boolean  | If true, items are placed in the order they are passed | false   |
+
+### ResponsiveMasonry component
+
+| Name                    | PropType | Description                                                                              | Default                  |
+| ----------------------- | -------- | ---------------------------------------------------------------------------------------- | ------------------------ |
+| columnsCountBreakPoints | Object   | Keys are breakpoints in px, values are the columns number                                | {350: 1, 750: 2, 900: 3} |
+| gutterBreakpoints       | Object   | Keys are breakpoints in px, values are the gutter value in any valid CSS value for 'gap' |                          |
+
+## Contributing
+
+-   ⇄ Pull/Merge requests and ★ Stars are always welcome.
+-   For bugs and feature requests, please [create an issue][github-issue].
+-   Pull requests must be accompanied by passing automated tests (`npm test`).
+
+See [CONTRIBUTING.md](./CONTRIBUTING.md) guidelines
+
+## Changelog
+
+See [changelog](./CHANGELOG.md)
+
+## License
+
+This project is licensed under the MIT License - see the
+[LICENCE.md](./LICENCE.md) file for details
+
+[npm-badge]: https://img.shields.io/npm/v/react-responsive-masonry.svg?style=flat-square
+[npm]: https://www.npmjs.org/package/react-responsive-masonry
+[build-badge]: https://img.shields.io/travis/cedricdelpoux/react-responsive-masonry/master.svg?style=flat-square
+[build]: https://travis-ci.org/cedricdelpoux/react-responsive-masonry
+[codecov-badge]: https://img.shields.io/codecov/c/github/cedricdelpoux/react-responsive-masonry.svg?style=flat-square
+[codecov]: https://codecov.io/gh/cedricdelpoux/react-responsive-masonry
+[module-formats]: https://img.shields.io/badge/module%20formats-umd%2C%20cjs%2C%20esm-green.svg?style=flat-square
+[github-page]: https://cedricdelpoux.github.io/react-responsive-masonry
+[github-issue]: https://github.com/cedricdelpoux/react-responsive-masonry/issues/new

node_modules/react-responsive-masonry/es/Masonry/index.js

@@ -0,0 +1,180 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+import PropTypes from "prop-types";
+import React from "react";
+
+var Masonry = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Masonry, _React$Component);
+
+  function Masonry() {
+    var _this;
+
+    _this = _React$Component.call(this) || this;
+    _this.state = {
+      columns: [],
+      childRefs: [],
+      hasDistributed: false
+    };
+    return _this;
+  }
+
+  var _proto = Masonry.prototype;
+
+  _proto.componentDidUpdate = function componentDidUpdate() {
+    if (!this.state.hasDistributed && !this.props.sequential) this.distributeChildren();
+  };
+
+  Masonry.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
+    var children = props.children,
+        columnsCount = props.columnsCount;
+    var hasColumnsChanged = columnsCount !== state.columns.length;
+    if (state && children === state.children && !hasColumnsChanged) return null;
+    return _extends({}, Masonry.getEqualCountColumns(children, columnsCount), {
+      children: children,
+      hasDistributed: false
+    });
+  };
+
+  _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
+    return nextProps.children !== this.state.children || nextProps.columnsCount !== this.props.columnsCount;
+  };
+
+  _proto.distributeChildren = function distributeChildren() {
+    var _this2 = this;
+
+    var _this$props = this.props,
+        children = _this$props.children,
+        columnsCount = _this$props.columnsCount;
+    var columnHeights = Array(columnsCount).fill(0);
+    var isReady = this.state.childRefs.every(function (ref) {
+      return ref.current.getBoundingClientRect().height;
+    });
+    if (!isReady) return;
+    var columns = Array.from({
+      length: columnsCount
+    }, function () {
+      return [];
+    });
+    var validIndex = 0;
+    React.Children.forEach(children, function (child) {
+      if (child && React.isValidElement(child)) {
+        // .current is undefined if ref was passed to a functional component without forwardRef
+        // now passing ref into a wrapper div so it should always be defined
+        var childHeight = _this2.state.childRefs[validIndex].current.getBoundingClientRect().height;
+
+        var minHeightColumnIndex = columnHeights.indexOf(Math.min.apply(Math, columnHeights));
+        columnHeights[minHeightColumnIndex] += childHeight;
+        columns[minHeightColumnIndex].push(child);
+        validIndex++;
+      }
+    });
+    this.setState(function (p) {
+      return _extends({}, p, {
+        columns: columns,
+        hasDistributed: true
+      });
+    });
+  };
+
+  Masonry.getEqualCountColumns = function getEqualCountColumns(children, columnsCount) {
+    var columns = Array.from({
+      length: columnsCount
+    }, function () {
+      return [];
+    });
+    var validIndex = 0;
+    var childRefs = [];
+    React.Children.forEach(children, function (child) {
+      if (child && React.isValidElement(child)) {
+        var ref = React.createRef();
+        childRefs.push(ref);
+        columns[validIndex % columnsCount].push( /*#__PURE__*/React.createElement("div", {
+          style: {
+            display: "flex",
+            justifyContent: "stretch"
+          },
+          key: validIndex,
+          ref: ref
+        }, child) // React.cloneElement(child, {ref}) // cannot attach refs to functional components without forwardRef
+        );
+        validIndex++;
+      }
+    });
+    return {
+      columns: columns,
+      childRefs: childRefs
+    };
+  };
+
+  _proto.renderColumns = function renderColumns() {
+    var _this$props2 = this.props,
+        gutter = _this$props2.gutter,
+        itemTag = _this$props2.itemTag,
+        itemStyle = _this$props2.itemStyle;
+    return this.state.columns.map(function (column, i) {
+      return React.createElement(itemTag, {
+        key: i,
+        style: _extends({
+          display: "flex",
+          flexDirection: "column",
+          justifyContent: "flex-start",
+          alignContent: "stretch",
+          flex: 1,
+          width: 0,
+          gap: gutter
+        }, itemStyle)
+      }, column.map(function (item) {
+        return item;
+      }));
+    });
+  };
+
+  _proto.render = function render() {
+    var _this$props3 = this.props,
+        gutter = _this$props3.gutter,
+        className = _this$props3.className,
+        style = _this$props3.style,
+        containerTag = _this$props3.containerTag;
+    return React.createElement(containerTag, {
+      style: _extends({
+        display: "flex",
+        flexDirection: "row",
+        justifyContent: "center",
+        alignContent: "stretch",
+        boxSizing: "border-box",
+        width: "100%",
+        gap: gutter
+      }, style),
+      className: className
+    }, this.renderColumns());
+  };
+
+  return Masonry;
+}(React.Component);
+
+Masonry.propTypes = process.env.NODE_ENV !== "production" ? {
+  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
+  columnsCount: PropTypes.number,
+  gutter: PropTypes.string,
+  className: PropTypes.string,
+  style: PropTypes.object,
+  containerTag: PropTypes.string,
+  itemTag: PropTypes.string,
+  itemStyle: PropTypes.object,
+  sequential: PropTypes.bool
+} : {};
+Masonry.defaultProps = {
+  columnsCount: 3,
+  gutter: "0",
+  className: null,
+  style: {},
+  containerTag: "div",
+  itemTag: "div",
+  itemStyle: {},
+  sequential: false
+};
+export default Masonry;

node_modules/react-responsive-masonry/es/ResponsiveMasonry/index.js

@@ -0,0 +1,92 @@
+import React, { useCallback, useEffect, useLayoutEffect, useMemo, useState } from "react";
+import PropTypes from "prop-types";
+var DEFAULT_COLUMNS_COUNT = 1;
+var DEFAULT_GUTTER = "10px";
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+
+var useHasMounted = function useHasMounted() {
+  var _useState = useState(false),
+      hasMounted = _useState[0],
+      setHasMounted = _useState[1];
+
+  useIsomorphicLayoutEffect(function () {
+    setHasMounted(true);
+  }, []);
+  return hasMounted;
+};
+
+var useWindowWidth = function useWindowWidth() {
+  var hasMounted = useHasMounted();
+
+  var _useState2 = useState(typeof window !== "undefined" ? window.innerWidth : 0),
+      width = _useState2[0],
+      setWidth = _useState2[1];
+
+  var handleResize = useCallback(function () {
+    if (!hasMounted) return;
+    setWidth(window.innerWidth);
+  }, [hasMounted]);
+  useIsomorphicLayoutEffect(function () {
+    if (hasMounted) {
+      window.addEventListener("resize", handleResize);
+      handleResize();
+      return function () {
+        return window.removeEventListener("resize", handleResize);
+      };
+    }
+  }, [hasMounted, handleResize]);
+  return width;
+};
+
+var MasonryResponsive = function MasonryResponsive(_ref) {
+  var _ref$columnsCountBrea = _ref.columnsCountBreakPoints,
+      columnsCountBreakPoints = _ref$columnsCountBrea === void 0 ? {
+    350: 1,
+    750: 2,
+    900: 3
+  } : _ref$columnsCountBrea,
+      _ref$gutterBreakPoint = _ref.gutterBreakPoints,
+      gutterBreakPoints = _ref$gutterBreakPoint === void 0 ? {} : _ref$gutterBreakPoint,
+      children = _ref.children,
+      _ref$className = _ref.className,
+      className = _ref$className === void 0 ? null : _ref$className,
+      _ref$style = _ref.style,
+      style = _ref$style === void 0 ? null : _ref$style;
+  var windowWidth = useWindowWidth();
+  var getResponsiveValue = useCallback(function (breakPoints, defaultValue) {
+    var sortedBreakPoints = Object.keys(breakPoints).sort(function (a, b) {
+      return a - b;
+    });
+    var value = sortedBreakPoints.length > 0 ? breakPoints[sortedBreakPoints[0]] : defaultValue;
+    sortedBreakPoints.forEach(function (breakPoint) {
+      if (breakPoint < windowWidth) {
+        value = breakPoints[breakPoint];
+      }
+    });
+    return value;
+  }, [windowWidth]);
+  var columnsCount = useMemo(function () {
+    return getResponsiveValue(columnsCountBreakPoints, DEFAULT_COLUMNS_COUNT);
+  }, [getResponsiveValue, columnsCountBreakPoints]);
+  var gutter = useMemo(function () {
+    return getResponsiveValue(gutterBreakPoints, DEFAULT_GUTTER);
+  }, [getResponsiveValue, gutterBreakPoints]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: className,
+    style: style
+  }, React.Children.map(children, function (child, index) {
+    return React.cloneElement(child, {
+      key: index,
+      columnsCount: columnsCount,
+      gutter: gutter
+    });
+  }));
+};
+
+MasonryResponsive.propTypes = process.env.NODE_ENV !== "production" ? {
+  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
+  columnsCountBreakPoints: PropTypes.object,
+  className: PropTypes.string,
+  style: PropTypes.object
+} : {};
+export default MasonryResponsive;

node_modules/react-responsive-masonry/es/index.js

@@ -0,0 +1,4 @@
+import Masonry from "./Masonry";
+import ResponsiveMasonry from "./ResponsiveMasonry";
+export default Masonry;
+export { ResponsiveMasonry };

node_modules/react-responsive-masonry/lib/Masonry/index.js

@@ -0,0 +1,197 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _react = _interopRequireDefault(require("react"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var Masonry = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Masonry, _React$Component);
+
+  function Masonry() {
+    var _this;
+
+    _this = _React$Component.call(this) || this;
+    _this.state = {
+      columns: [],
+      childRefs: [],
+      hasDistributed: false
+    };
+    return _this;
+  }
+
+  var _proto = Masonry.prototype;
+
+  _proto.componentDidUpdate = function componentDidUpdate() {
+    if (!this.state.hasDistributed && !this.props.sequential) this.distributeChildren();
+  };
+
+  Masonry.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
+    var children = props.children,
+        columnsCount = props.columnsCount;
+    var hasColumnsChanged = columnsCount !== state.columns.length;
+    if (state && children === state.children && !hasColumnsChanged) return null;
+    return _extends({}, Masonry.getEqualCountColumns(children, columnsCount), {
+      children: children,
+      hasDistributed: false
+    });
+  };
+
+  _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
+    return nextProps.children !== this.state.children || nextProps.columnsCount !== this.props.columnsCount;
+  };
+
+  _proto.distributeChildren = function distributeChildren() {
+    var _this2 = this;
+
+    var _this$props = this.props,
+        children = _this$props.children,
+        columnsCount = _this$props.columnsCount;
+    var columnHeights = Array(columnsCount).fill(0);
+    var isReady = this.state.childRefs.every(function (ref) {
+      return ref.current.getBoundingClientRect().height;
+    });
+    if (!isReady) return;
+    var columns = Array.from({
+      length: columnsCount
+    }, function () {
+      return [];
+    });
+    var validIndex = 0;
+
+    _react["default"].Children.forEach(children, function (child) {
+      if (child && _react["default"].isValidElement(child)) {
+        // .current is undefined if ref was passed to a functional component without forwardRef
+        // now passing ref into a wrapper div so it should always be defined
+        var childHeight = _this2.state.childRefs[validIndex].current.getBoundingClientRect().height;
+
+        var minHeightColumnIndex = columnHeights.indexOf(Math.min.apply(Math, columnHeights));
+        columnHeights[minHeightColumnIndex] += childHeight;
+        columns[minHeightColumnIndex].push(child);
+        validIndex++;
+      }
+    });
+
+    this.setState(function (p) {
+      return _extends({}, p, {
+        columns: columns,
+        hasDistributed: true
+      });
+    });
+  };
+
+  Masonry.getEqualCountColumns = function getEqualCountColumns(children, columnsCount) {
+    var columns = Array.from({
+      length: columnsCount
+    }, function () {
+      return [];
+    });
+    var validIndex = 0;
+    var childRefs = [];
+
+    _react["default"].Children.forEach(children, function (child) {
+      if (child && _react["default"].isValidElement(child)) {
+        var ref = _react["default"].createRef();
+
+        childRefs.push(ref);
+        columns[validIndex % columnsCount].push( /*#__PURE__*/_react["default"].createElement("div", {
+          style: {
+            display: "flex",
+            justifyContent: "stretch"
+          },
+          key: validIndex,
+          ref: ref
+        }, child) // React.cloneElement(child, {ref}) // cannot attach refs to functional components without forwardRef
+        );
+        validIndex++;
+      }
+    });
+
+    return {
+      columns: columns,
+      childRefs: childRefs
+    };
+  };
+
+  _proto.renderColumns = function renderColumns() {
+    var _this$props2 = this.props,
+        gutter = _this$props2.gutter,
+        itemTag = _this$props2.itemTag,
+        itemStyle = _this$props2.itemStyle;
+    return this.state.columns.map(function (column, i) {
+      return _react["default"].createElement(itemTag, {
+        key: i,
+        style: _extends({
+          display: "flex",
+          flexDirection: "column",
+          justifyContent: "flex-start",
+          alignContent: "stretch",
+          flex: 1,
+          width: 0,
+          gap: gutter
+        }, itemStyle)
+      }, column.map(function (item) {
+        return item;
+      }));
+    });
+  };
+
+  _proto.render = function render() {
+    var _this$props3 = this.props,
+        gutter = _this$props3.gutter,
+        className = _this$props3.className,
+        style = _this$props3.style,
+        containerTag = _this$props3.containerTag;
+    return _react["default"].createElement(containerTag, {
+      style: _extends({
+        display: "flex",
+        flexDirection: "row",
+        justifyContent: "center",
+        alignContent: "stretch",
+        boxSizing: "border-box",
+        width: "100%",
+        gap: gutter
+      }, style),
+      className: className
+    }, this.renderColumns());
+  };
+
+  return Masonry;
+}(_react["default"].Component);
+
+Masonry.propTypes = process.env.NODE_ENV !== "production" ? {
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired,
+  columnsCount: _propTypes["default"].number,
+  gutter: _propTypes["default"].string,
+  className: _propTypes["default"].string,
+  style: _propTypes["default"].object,
+  containerTag: _propTypes["default"].string,
+  itemTag: _propTypes["default"].string,
+  itemStyle: _propTypes["default"].object,
+  sequential: _propTypes["default"].bool
+} : {};
+Masonry.defaultProps = {
+  columnsCount: 3,
+  gutter: "0",
+  className: null,
+  style: {},
+  containerTag: "div",
+  itemTag: "div",
+  itemStyle: {},
+  sequential: false
+};
+var _default = Masonry;
+exports["default"] = _default;
+module.exports = exports.default;

node_modules/react-responsive-masonry/lib/ResponsiveMasonry/index.js

@@ -0,0 +1,109 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var DEFAULT_COLUMNS_COUNT = 1;
+var DEFAULT_GUTTER = "10px";
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? _react.useLayoutEffect : _react.useEffect;
+
+var useHasMounted = function useHasMounted() {
+  var _useState = (0, _react.useState)(false),
+      hasMounted = _useState[0],
+      setHasMounted = _useState[1];
+
+  useIsomorphicLayoutEffect(function () {
+    setHasMounted(true);
+  }, []);
+  return hasMounted;
+};
+
+var useWindowWidth = function useWindowWidth() {
+  var hasMounted = useHasMounted();
+
+  var _useState2 = (0, _react.useState)(typeof window !== "undefined" ? window.innerWidth : 0),
+      width = _useState2[0],
+      setWidth = _useState2[1];
+
+  var handleResize = (0, _react.useCallback)(function () {
+    if (!hasMounted) return;
+    setWidth(window.innerWidth);
+  }, [hasMounted]);
+  useIsomorphicLayoutEffect(function () {
+    if (hasMounted) {
+      window.addEventListener("resize", handleResize);
+      handleResize();
+      return function () {
+        return window.removeEventListener("resize", handleResize);
+      };
+    }
+  }, [hasMounted, handleResize]);
+  return width;
+};
+
+var MasonryResponsive = function MasonryResponsive(_ref) {
+  var _ref$columnsCountBrea = _ref.columnsCountBreakPoints,
+      columnsCountBreakPoints = _ref$columnsCountBrea === void 0 ? {
+    350: 1,
+    750: 2,
+    900: 3
+  } : _ref$columnsCountBrea,
+      _ref$gutterBreakPoint = _ref.gutterBreakPoints,
+      gutterBreakPoints = _ref$gutterBreakPoint === void 0 ? {} : _ref$gutterBreakPoint,
+      children = _ref.children,
+      _ref$className = _ref.className,
+      className = _ref$className === void 0 ? null : _ref$className,
+      _ref$style = _ref.style,
+      style = _ref$style === void 0 ? null : _ref$style;
+  var windowWidth = useWindowWidth();
+  var getResponsiveValue = (0, _react.useCallback)(function (breakPoints, defaultValue) {
+    var sortedBreakPoints = Object.keys(breakPoints).sort(function (a, b) {
+      return a - b;
+    });
+    var value = sortedBreakPoints.length > 0 ? breakPoints[sortedBreakPoints[0]] : defaultValue;
+    sortedBreakPoints.forEach(function (breakPoint) {
+      if (breakPoint < windowWidth) {
+        value = breakPoints[breakPoint];
+      }
+    });
+    return value;
+  }, [windowWidth]);
+  var columnsCount = (0, _react.useMemo)(function () {
+    return getResponsiveValue(columnsCountBreakPoints, DEFAULT_COLUMNS_COUNT);
+  }, [getResponsiveValue, columnsCountBreakPoints]);
+  var gutter = (0, _react.useMemo)(function () {
+    return getResponsiveValue(gutterBreakPoints, DEFAULT_GUTTER);
+  }, [getResponsiveValue, gutterBreakPoints]);
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: className,
+    style: style
+  }, _react["default"].Children.map(children, function (child, index) {
+    return _react["default"].cloneElement(child, {
+      key: index,
+      columnsCount: columnsCount,
+      gutter: gutter
+    });
+  }));
+};
+
+MasonryResponsive.propTypes = process.env.NODE_ENV !== "production" ? {
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired,
+  columnsCountBreakPoints: _propTypes["default"].object,
+  className: _propTypes["default"].string,
+  style: _propTypes["default"].object
+} : {};
+var _default = MasonryResponsive;
+exports["default"] = _default;
+module.exports = exports.default;

node_modules/react-responsive-masonry/lib/index.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ResponsiveMasonry", {
+  enumerable: true,
+  get: function get() {
+    return _ResponsiveMasonry["default"];
+  }
+});
+exports["default"] = void 0;
+
+var _Masonry = _interopRequireDefault(require("./Masonry"));
+
+var _ResponsiveMasonry = _interopRequireDefault(require("./ResponsiveMasonry"));
+
+exports.ResponsiveMasonry = _ResponsiveMasonry["default"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var _default = _Masonry["default"];
+exports["default"] = _default;

node_modules/react-responsive-masonry/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "react-responsive-masonry",
+  "version": "2.7.1",
+  "author": {
+    "name": "Cédric Delpoux",
+    "email": "cedric.delpoux@gmail.com"
+  },
+  "description": "React responsive masonry component built with css flexbox",
+  "files": [
+    "es",
+    "lib",
+    "umd"
+  ],
+  "homepage": "https://github.com/cedricdelpoux/react-responsive-masonry#readme",
+  "keywords": [
+    "react",
+    "masonry",
+    "css",
+    "flexbox",
+    "responsive"
+  ],
+  "license": "MIT",
+  "main": "lib/index.js",
+  "module": "es/index.js",
+  "types": "types/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/cedricdelpoux/react-responsive-masonry.git"
+  },
+  "scripts": {
+    "openssl:legacy": "NODE_OPTIONS=--openssl-legacy-provider",
+    "build": "yarn run openssl:legacy nwb build-react-component",
+    "clean": "nwb clean-module && nwb clean-demo",
+    "deploy": "gh-pages -d demo/dist",
+    "lint": "eslint src demo/src",
+    "prepublish": "yarn run clean && yarn run build",
+    "start": "yarn run openssl:legacy nwb serve-react-demo --port 1190",
+    "test": "jest --colors --no-cache",
+    "test:watch": "yarn test -- --watch",
+    "prepare": "husky install"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.25.8",
+    "@babel/preset-env": "^7.25.8",
+    "@babel/preset-react": "^7.25.7",
+    "@commitlint/cli": "^14.1.0",
+    "@commitlint/config-conventional": "^14.1.0",
+    "babel-eslint": "^10.1.0",
+    "babel-jest": "^27.3.1",
+    "cz-conventional-changelog": "3.3.0",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.6",
+    "eslint": "^8.2.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-jest": "^25.2.4",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.37.1",
+    "gh-pages": "^3.2.3",
+    "html-loader": "^1.1.0",
+    "husky": "^7.0.0",
+    "jest": "^27.3.1",
+    "jest-css-modules": "^2.1.0",
+    "jsdom": "^18.1.0",
+    "lint-staged": "^12.0.2",
+    "markdown-loader": "^6.0.0",
+    "nwb": "^0.25.2",
+    "prettier": "^2.4.1",
+    "prop-types": "^15.7.2",
+    "react": "^16.13.1",
+    "react-demo-page": "^0.3.6",
+    "react-dom": "^16.13.1",
+    "react-test-renderer": "^16.13.1"
+  },
+  "dependencies": {}
+}

node_modules/react-responsive-masonry/umd/react-responsive-masonry.js

@@ -0,0 +1,421 @@
+/*!
+ * react-responsive-masonry v2.7.1 - https://github.com/cedricdelpoux/react-responsive-masonry#readme
+ * MIT Licensed
+ */
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("react"), require("prop-types"));
+	else if(typeof define === 'function' && define.amd)
+		define(["react", "prop-types"], factory);
+	else if(typeof exports === 'object')
+		exports["ReactResponsiveMasonry"] = factory(require("react"), require("prop-types"));
+	else
+		root["ReactResponsiveMasonry"] = factory(root["React"], root["PropTypes"]);
+})(window, function(__WEBPACK_EXTERNAL_MODULE__0__, __WEBPACK_EXTERNAL_MODULE__1__) {
+return /******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 2);
+/******/ })
+/************************************************************************/
+/******/ ([
+/* 0 */
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__0__;
+
+/***/ }),
+/* 1 */
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__1__;
+
+/***/ }),
+/* 2 */
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(3);
+
+
+/***/ }),
+/* 3 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, "ResponsiveMasonry", function() { return /* reexport */ ResponsiveMasonry; });
+
+// EXTERNAL MODULE: external {"root":"PropTypes","commonjs2":"prop-types","commonjs":"prop-types","amd":"prop-types"}
+var external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_ = __webpack_require__(1);
+var external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default = /*#__PURE__*/__webpack_require__.n(external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_);
+
+// EXTERNAL MODULE: external {"root":"React","commonjs2":"react","commonjs":"react","amd":"react"}
+var external_root_React_commonjs2_react_commonjs_react_amd_react_ = __webpack_require__(0);
+var external_root_React_commonjs2_react_commonjs_react_amd_react_default = /*#__PURE__*/__webpack_require__.n(external_root_React_commonjs2_react_commonjs_react_amd_react_);
+
+// CONCATENATED MODULE: ./src/Masonry/index.js
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+
+
+
+var Masonry_Masonry = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Masonry, _React$Component);
+
+  function Masonry() {
+    var _this;
+
+    _this = _React$Component.call(this) || this;
+    _this.state = {
+      columns: [],
+      childRefs: [],
+      hasDistributed: false
+    };
+    return _this;
+  }
+
+  var _proto = Masonry.prototype;
+
+  _proto.componentDidUpdate = function componentDidUpdate() {
+    if (!this.state.hasDistributed && !this.props.sequential) this.distributeChildren();
+  };
+
+  Masonry.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
+    var children = props.children,
+        columnsCount = props.columnsCount;
+    var hasColumnsChanged = columnsCount !== state.columns.length;
+    if (state && children === state.children && !hasColumnsChanged) return null;
+    return _extends({}, Masonry.getEqualCountColumns(children, columnsCount), {
+      children: children,
+      hasDistributed: false
+    });
+  };
+
+  _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
+    return nextProps.children !== this.state.children || nextProps.columnsCount !== this.props.columnsCount;
+  };
+
+  _proto.distributeChildren = function distributeChildren() {
+    var _this2 = this;
+
+    var _this$props = this.props,
+        children = _this$props.children,
+        columnsCount = _this$props.columnsCount;
+    var columnHeights = Array(columnsCount).fill(0);
+    var isReady = this.state.childRefs.every(function (ref) {
+      return ref.current.getBoundingClientRect().height;
+    });
+    if (!isReady) return;
+    var columns = Array.from({
+      length: columnsCount
+    }, function () {
+      return [];
+    });
+    var validIndex = 0;
+    external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.Children.forEach(children, function (child) {
+      if (child && external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.isValidElement(child)) {
+        // .current is undefined if ref was passed to a functional component without forwardRef
+        // now passing ref into a wrapper div so it should always be defined
+        var childHeight = _this2.state.childRefs[validIndex].current.getBoundingClientRect().height;
+
+        var minHeightColumnIndex = columnHeights.indexOf(Math.min.apply(Math, columnHeights));
+        columnHeights[minHeightColumnIndex] += childHeight;
+        columns[minHeightColumnIndex].push(child);
+        validIndex++;
+      }
+    });
+    this.setState(function (p) {
+      return _extends({}, p, {
+        columns: columns,
+        hasDistributed: true
+      });
+    });
+  };
+
+  Masonry.getEqualCountColumns = function getEqualCountColumns(children, columnsCount) {
+    var columns = Array.from({
+      length: columnsCount
+    }, function () {
+      return [];
+    });
+    var validIndex = 0;
+    var childRefs = [];
+    external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.Children.forEach(children, function (child) {
+      if (child && external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.isValidElement(child)) {
+        var ref = external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createRef();
+        childRefs.push(ref);
+        columns[validIndex % columnsCount].push( /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+          style: {
+            display: "flex",
+            justifyContent: "stretch"
+          },
+          key: validIndex,
+          ref: ref
+        }, child) // React.cloneElement(child, {ref}) // cannot attach refs to functional components without forwardRef
+        );
+        validIndex++;
+      }
+    });
+    return {
+      columns: columns,
+      childRefs: childRefs
+    };
+  };
+
+  _proto.renderColumns = function renderColumns() {
+    var _this$props2 = this.props,
+        gutter = _this$props2.gutter,
+        itemTag = _this$props2.itemTag,
+        itemStyle = _this$props2.itemStyle;
+    return this.state.columns.map(function (column, i) {
+      return external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(itemTag, {
+        key: i,
+        style: _extends({
+          display: "flex",
+          flexDirection: "column",
+          justifyContent: "flex-start",
+          alignContent: "stretch",
+          flex: 1,
+          width: 0,
+          gap: gutter
+        }, itemStyle)
+      }, column.map(function (item) {
+        return item;
+      }));
+    });
+  };
+
+  _proto.render = function render() {
+    var _this$props3 = this.props,
+        gutter = _this$props3.gutter,
+        className = _this$props3.className,
+        style = _this$props3.style,
+        containerTag = _this$props3.containerTag;
+    return external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement(containerTag, {
+      style: _extends({
+        display: "flex",
+        flexDirection: "row",
+        justifyContent: "center",
+        alignContent: "stretch",
+        boxSizing: "border-box",
+        width: "100%",
+        gap: gutter
+      }, style),
+      className: className
+    }, this.renderColumns());
+  };
+
+  return Masonry;
+}(external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.Component);
+
+Masonry_Masonry.propTypes = {
+  children: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.oneOfType([external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.arrayOf(external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.node), external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.node]).isRequired,
+  columnsCount: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.number,
+  gutter: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.string,
+  className: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.string,
+  style: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.object,
+  containerTag: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.string,
+  itemTag: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.string,
+  itemStyle: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.object,
+  sequential: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.bool
+};
+Masonry_Masonry.defaultProps = {
+  columnsCount: 3,
+  gutter: "0",
+  className: null,
+  style: {},
+  containerTag: "div",
+  itemTag: "div",
+  itemStyle: {},
+  sequential: false
+};
+/* harmony default export */ var src_Masonry = (Masonry_Masonry);
+// CONCATENATED MODULE: ./src/ResponsiveMasonry/index.js
+
+
+var DEFAULT_COLUMNS_COUNT = 1;
+var DEFAULT_GUTTER = "10px";
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? external_root_React_commonjs2_react_commonjs_react_amd_react_["useLayoutEffect"] : external_root_React_commonjs2_react_commonjs_react_amd_react_["useEffect"];
+
+var ResponsiveMasonry_useHasMounted = function useHasMounted() {
+  var _useState = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["useState"])(false),
+      hasMounted = _useState[0],
+      setHasMounted = _useState[1];
+
+  useIsomorphicLayoutEffect(function () {
+    setHasMounted(true);
+  }, []);
+  return hasMounted;
+};
+
+var ResponsiveMasonry_useWindowWidth = function useWindowWidth() {
+  var hasMounted = ResponsiveMasonry_useHasMounted();
+
+  var _useState2 = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["useState"])(typeof window !== "undefined" ? window.innerWidth : 0),
+      width = _useState2[0],
+      setWidth = _useState2[1];
+
+  var handleResize = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["useCallback"])(function () {
+    if (!hasMounted) return;
+    setWidth(window.innerWidth);
+  }, [hasMounted]);
+  useIsomorphicLayoutEffect(function () {
+    if (hasMounted) {
+      window.addEventListener("resize", handleResize);
+      handleResize();
+      return function () {
+        return window.removeEventListener("resize", handleResize);
+      };
+    }
+  }, [hasMounted, handleResize]);
+  return width;
+};
+
+var ResponsiveMasonry_MasonryResponsive = function MasonryResponsive(_ref) {
+  var _ref$columnsCountBrea = _ref.columnsCountBreakPoints,
+      columnsCountBreakPoints = _ref$columnsCountBrea === void 0 ? {
+    350: 1,
+    750: 2,
+    900: 3
+  } : _ref$columnsCountBrea,
+      _ref$gutterBreakPoint = _ref.gutterBreakPoints,
+      gutterBreakPoints = _ref$gutterBreakPoint === void 0 ? {} : _ref$gutterBreakPoint,
+      children = _ref.children,
+      _ref$className = _ref.className,
+      className = _ref$className === void 0 ? null : _ref$className,
+      _ref$style = _ref.style,
+      style = _ref$style === void 0 ? null : _ref$style;
+  var windowWidth = ResponsiveMasonry_useWindowWidth();
+  var getResponsiveValue = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["useCallback"])(function (breakPoints, defaultValue) {
+    var sortedBreakPoints = Object.keys(breakPoints).sort(function (a, b) {
+      return a - b;
+    });
+    var value = sortedBreakPoints.length > 0 ? breakPoints[sortedBreakPoints[0]] : defaultValue;
+    sortedBreakPoints.forEach(function (breakPoint) {
+      if (breakPoint < windowWidth) {
+        value = breakPoints[breakPoint];
+      }
+    });
+    return value;
+  }, [windowWidth]);
+  var columnsCount = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["useMemo"])(function () {
+    return getResponsiveValue(columnsCountBreakPoints, DEFAULT_COLUMNS_COUNT);
+  }, [getResponsiveValue, columnsCountBreakPoints]);
+  var gutter = Object(external_root_React_commonjs2_react_commonjs_react_amd_react_["useMemo"])(function () {
+    return getResponsiveValue(gutterBreakPoints, DEFAULT_GUTTER);
+  }, [getResponsiveValue, gutterBreakPoints]);
+  return /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.createElement("div", {
+    className: className,
+    style: style
+  }, external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.Children.map(children, function (child, index) {
+    return external_root_React_commonjs2_react_commonjs_react_amd_react_default.a.cloneElement(child, {
+      key: index,
+      columnsCount: columnsCount,
+      gutter: gutter
+    });
+  }));
+};
+
+ResponsiveMasonry_MasonryResponsive.propTypes = {
+  children: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.oneOfType([external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.arrayOf(external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.node), external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.node]).isRequired,
+  columnsCountBreakPoints: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.object,
+  className: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.string,
+  style: external_root_PropTypes_commonjs2_prop_types_commonjs_prop_types_amd_prop_types_default.a.object
+};
+/* harmony default export */ var ResponsiveMasonry = (ResponsiveMasonry_MasonryResponsive);
+// CONCATENATED MODULE: ./src/index.js
+
+
+/* harmony default export */ var src = __webpack_exports__["default"] = (src_Masonry);
+
+
+/***/ })
+/******/ ])["default"];
+});