@micromag/element-stack 0.3.531 → 0.3.547

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/element-stack",
-    "version": "0.3.531",
+    "version": "0.3.547",
     "private": false,
     "description": "",
     "keywords": [
@@ -30,11 +30,10 @@
         }
     ],
     "license": "ISC",
-    "main": "lib/index.js",
+    "type": "module",
     "module": "es/index.js",
     "exports": {
         ".": {
-            "require": "./lib/index.js",
             "import": "./es/index.js"
         },
         "./assets/css/styles": "./assets/css/styles.css",
@@ -60,7 +59,7 @@
     },
     "dependencies": {
         "@babel/runtime": "^7.13.10",
-        "@micromag/core": "^0.3.531",
+        "@micromag/core": "^0.3.547",
         "classnames": "^2.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -71,5 +70,5 @@
         "access": "public",
         "registry": "https://registry.npmjs.org/"
     },
-    "gitHead": "e3a59c467ad33528b38eb4badd78b6ed0e38a3a6"
+    "gitHead": "3c2f5904ce61fcfa61f673c38c2a5ec56e9e2b07"
 }

package/lib/index.js

@@ -1,179 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var classNames = require('classnames');
-var isNumber = require('lodash/isNumber');
-var isString = require('lodash/isString');
-var PropTypes = require('prop-types');
-var core = require('@micromag/core');
-
-/* eslint-disable react/jsx-props-no-spreading */
-var StackContext = /*#__PURE__*/React.createContext({
-  direction: 'horizontal'
-});
-var useStack = function useStack() {
-  return React.useContext(StackContext);
-};
-var useStackDirection = function useStackDirection() {
-  var _useContext = React.useContext(StackContext),
-    direction = _useContext.direction;
-  return direction;
-};
-var propTypes$4 = {
-  children: PropTypes.node.isRequired,
-  direction: PropTypes.oneOf(['vertical', 'horizontal'])
-};
-var defaultProps$4 = {
-  direction: 'vertical'
-};
-
-// Note: this is done to avoid excessive renders on the screens that use the context
-
-function StackProvider(_ref) {
-  var direction = _ref.direction,
-    children = _ref.children;
-  var value = React.useMemo(function () {
-    return {
-      direction: direction
-    };
-  }, [direction]);
-  return /*#__PURE__*/React.createElement(StackContext.Provider, {
-    value: value
-  }, children);
-}
-StackProvider.propTypes = propTypes$4;
-StackProvider.defaultProps = defaultProps$4;
-
-var styles$1 = {"container":"micromag-element-stack-spacer-container","hasSize":"micromag-element-stack-spacer-hasSize"};
-
-var propTypes$3 = {
-  size: PropTypes.number,
-  minSize: PropTypes.number,
-  maxSize: PropTypes.number,
-  className: PropTypes.string
-};
-var defaultProps$3 = {
-  size: null,
-  minSize: null,
-  maxSize: null,
-  className: null
-};
-function Spacer(_ref) {
-  var size = _ref.size,
-    minSize = _ref.minSize,
-    maxSize = _ref.maxSize,
-    className = _ref.className;
-  var direction = useStackDirection();
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames([styles$1.container, _defineProperty(_defineProperty({}, styles$1.hasSize, size !== null), className, className !== null)]),
-    style: {
-      width: direction === 'horizontal' ? size : null,
-      minWidth: direction === 'horizontal' ? minSize : null,
-      maxWidth: direction === 'horizontal' ? maxSize : null,
-      height: direction === 'vertical' ? size : null,
-      minHeight: direction === 'vertical' ? minSize : null,
-      maxHeight: direction === 'vertical' ? maxSize : null
-    }
-  });
-}
-Spacer.propTypes = propTypes$3;
-Spacer.defaultProps = defaultProps$3;
-Spacer.withoutTransitionsWrapper = true;
-
-var styles = {"container":"micromag-element-stack-container"};
-
-var propTypes$2 = {
-  direction: core.PropTypes.stackDirection,
-  align: core.PropTypes.stackAlign,
-  spacing: core.PropTypes.stackSpacing,
-  reverse: PropTypes.bool,
-  size: PropTypes.number,
-  minSize: PropTypes.number,
-  maxSize: PropTypes.number,
-  className: PropTypes.string,
-  children: PropTypes.node
-};
-var defaultProps$2 = {
-  direction: 'horizontal',
-  align: 'center',
-  spacing: null,
-  reverse: false,
-  size: null,
-  minSize: null,
-  maxSize: null,
-  className: null,
-  children: null
-};
-function Stack(_ref) {
-  var direction = _ref.direction,
-    align = _ref.align,
-    spacing = _ref.spacing,
-    reverse = _ref.reverse,
-    size = _ref.size,
-    minSize = _ref.minSize,
-    maxSize = _ref.maxSize,
-    className = _ref.className,
-    children = _ref.children;
-  var flexDirection = (direction === 'vertical' ? 'column' : 'row') + (reverse ? '-reverse' : '');
-  var alignItems = align === 'center' ? align : "flex-".concat(align);
-  var justifyContent = isString(spacing) ? "space-".concat(spacing) : null;
-  var space = isNumber(spacing) ? spacing : null;
-  var lastIndex = children !== null && children.length ? children.length - 1 : null;
-  return /*#__PURE__*/React.createElement(StackProvider, {
-    direction: direction
-  }, /*#__PURE__*/React.createElement("div", {
-    className: classNames([styles.container, _defineProperty({}, className, className !== null)]),
-    style: {
-      flexDirection: flexDirection,
-      alignItems: alignItems,
-      justifyContent: justifyContent,
-      width: direction === 'horizontal' ? size : null,
-      minWidth: direction === 'horizontal' ? minSize : null,
-      maxWidth: direction === 'horizontal' ? maxSize : null,
-      height: direction === 'vertical' ? size : null,
-      minHeight: direction === 'vertical' ? minSize : null,
-      maxHeight: direction === 'vertical' ? maxSize : null
-    }
-  }, React.Children.toArray(children).reduce(function (allChildren, child, index) {
-    return child.type !== Spacer && space !== null && index < lastIndex ? [].concat(_toConsumableArray(allChildren), [child, /*#__PURE__*/React.createElement(Spacer, {
-      key: "spacer-".concat(index),
-      size: space
-    })]) : [].concat(_toConsumableArray(allChildren), [child]);
-  }, [])));
-}
-Stack.propTypes = propTypes$2;
-Stack.defaultProps = defaultProps$2;
-
-/* eslint-disable react/jsx-props-no-spreading */
-var propTypes$1 = {};
-var defaultProps$1 = {};
-function HStack(props) {
-  return /*#__PURE__*/React.createElement(Stack, Object.assign({}, props, {
-    direction: "horizontal"
-  }));
-}
-HStack.propTypes = propTypes$1;
-HStack.defaultProps = defaultProps$1;
-
-/* eslint-disable react/jsx-props-no-spreading */
-var propTypes = {};
-var defaultProps = {};
-function VStack(props) {
-  return /*#__PURE__*/React.createElement(Stack, Object.assign({}, props, {
-    direction: "vertical"
-  }));
-}
-VStack.propTypes = propTypes;
-VStack.defaultProps = defaultProps;
-
-exports.HStack = HStack;
-exports.Spacer = Spacer;
-exports.StackProvider = StackProvider;
-exports.VStack = VStack;
-exports.default = Stack;
-exports.useStack = useStack;
-exports.useStackDirection = useStackDirection;