@panneau/element-menu 1.0.0-y.0 → 1.0.3-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/es/index.js +10 -8
  2. package/lib/index.js +49 -45
  3. package/package.json +12 -12
package/es/index.js CHANGED
@@ -2,13 +2,13 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
2
2
  import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
3
3
  import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
4
4
  import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
5
- import React, { useState } from 'react';
6
- import PropTypes$1 from 'prop-types';
7
5
  import classNames from 'classnames';
6
+ import PropTypes$1 from 'prop-types';
7
+ import React, { useState } from 'react';
8
8
  import { PropTypes } from '@panneau/core';
9
- import Link from '@panneau/element-link';
10
- import Label from '@panneau/element-label';
11
9
  import Dropdown from '@panneau/element-dropdown';
10
+ import Label from '@panneau/element-label';
11
+ import Link from '@panneau/element-link';
12
12
 
13
13
  var _excluded = ["id", "className", "linkClassName", "href", "label", "external", "items", "dropdown", "active", "onClick"];
14
14
  var propTypes = {
@@ -104,6 +104,7 @@ var Menu = function Menu(_ref) {
104
104
 
105
105
  var onClickItem = dropdown !== null ? function (e) {
106
106
  e.preventDefault();
107
+ e.stopPropagation();
107
108
  setDropdownsVisible([].concat(_toConsumableArray(dropdownsVisible.slice(0, index)), [!(dropdownsVisible[index] || false)], _toConsumableArray(dropdownsVisible.slice(index + 1))));
108
109
 
109
110
  if (customOnClick !== null) {
@@ -114,6 +115,7 @@ var Menu = function Menu(_ref) {
114
115
  setDropdownsVisible([].concat(_toConsumableArray(dropdownsVisible.slice(0, index)), [false], _toConsumableArray(dropdownsVisible.slice(index + 1))));
115
116
  } : null;
116
117
  var ItemComponent = itemTagName;
118
+ var dropdownVisible = dropdownsVisible[index] || false;
117
119
  return linkAsItem ? /*#__PURE__*/React.createElement(Link, Object.assign({}, itemProps, {
118
120
  key: "item-".concat(id || index),
119
121
  onClick: onClickItem,
@@ -128,9 +130,9 @@ var Menu = function Menu(_ref) {
128
130
  dropdown: dropdown !== null,
129
131
  active: active
130
132
  }, _defineProperty(_classNames2, itemClassName, itemClassName !== null), _defineProperty(_classNames2, customClassName, customClassName !== null), _defineProperty(_classNames2, hasSubMenuClassName, subItems !== null && hasSubMenuClassName !== null), _defineProperty(_classNames2, hasDropdownClassName, subItems !== null && hasDropdownClassName !== null), _classNames2))
131
- }, href !== null ? /*#__PURE__*/React.createElement(Link, Object.assign({}, itemProps, {
133
+ }, href !== null || dropdown !== null ? /*#__PURE__*/React.createElement(Link, Object.assign({}, itemProps, {
132
134
  onClick: onClickItem,
133
- href: href,
135
+ href: href || '#',
134
136
  external: external,
135
137
  className: classNames((_classNames3 = {}, _defineProperty(_classNames3, linkClassName, linkClassName !== null), _defineProperty(_classNames3, 'dropdown-toggle', dropdown !== null), _defineProperty(_classNames3, customLinkClassName, customLinkClassName !== null), _classNames3))
136
138
  }), label) : /*#__PURE__*/React.createElement(Label, itemProps, label), subItems !== null ? /*#__PURE__*/React.createElement(Menu, {
@@ -140,7 +142,7 @@ var Menu = function Menu(_ref) {
140
142
  linkClassName: classNames((_classNames5 = {}, _defineProperty(_classNames5, subMenuLinkClassName, subMenuLinkClassName !== null), _defineProperty(_classNames5, linkClassName, subMenuLinkClassName === null && linkClassName !== null), _classNames5))
141
143
  }) : null, dropdown !== null ? /*#__PURE__*/React.createElement(Dropdown, {
142
144
  items: dropdown,
143
- visible: dropdownsVisible[index] || false,
145
+ visible: dropdownVisible,
144
146
  className: dropdownClassName,
145
147
  itemClassName: classNames((_classNames6 = {}, _defineProperty(_classNames6, dropdownItemClassName, dropdownItemClassName !== null), _defineProperty(_classNames6, itemClassName, dropdownItemClassName === null && itemClassName !== null), _classNames6)),
146
148
  linkClassName: classNames((_classNames7 = {}, _defineProperty(_classNames7, dropdownLinkClassName, dropdownLinkClassName !== null), _defineProperty(_classNames7, linkClassName, dropdownLinkClassName === null && linkClassName !== null), _classNames7)),
@@ -154,4 +156,4 @@ var Menu = function Menu(_ref) {
154
156
  Menu.propTypes = propTypes;
155
157
  Menu.defaultProps = defaultProps;
156
158
 
157
- export default Menu;
159
+ export { Menu as default };
package/lib/index.js CHANGED
@@ -1,16 +1,18 @@
1
1
  'use strict';
2
2
 
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
3
5
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
4
6
  var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
5
7
  var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
6
8
  var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
7
- var React = require('react');
8
- var PropTypes = require('prop-types');
9
9
  var classNames = require('classnames');
10
+ var PropTypes = require('prop-types');
11
+ var React = require('react');
10
12
  var core = require('@panneau/core');
11
- var Link = require('@panneau/element-link');
12
- var Label = require('@panneau/element-label');
13
13
  var Dropdown = require('@panneau/element-dropdown');
14
+ var Label = require('@panneau/element-label');
15
+ var Link = require('@panneau/element-link');
14
16
 
15
17
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
16
18
 
@@ -18,31 +20,31 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
18
20
  var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
19
21
  var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
20
22
  var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
21
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
22
- var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
23
23
  var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
24
- var Link__default = /*#__PURE__*/_interopDefaultLegacy(Link);
25
- var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
24
+ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
25
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
26
26
  var Dropdown__default = /*#__PURE__*/_interopDefaultLegacy(Dropdown);
27
+ var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
28
+ var Link__default = /*#__PURE__*/_interopDefaultLegacy(Link);
27
29
 
28
30
  var _excluded = ["id", "className", "linkClassName", "href", "label", "external", "items", "dropdown", "active", "onClick"];
29
31
  var propTypes = {
30
32
  items: core.PropTypes.menuItems,
31
- tagName: PropTypes__default['default'].string,
32
- itemTagName: PropTypes__default['default'].string,
33
- children: PropTypes__default['default'].node,
34
- linkAsItem: PropTypes__default['default'].bool,
35
- className: PropTypes__default['default'].string,
36
- itemClassName: PropTypes__default['default'].string,
37
- linkClassName: PropTypes__default['default'].string,
38
- hasSubMenuClassName: PropTypes__default['default'].string,
39
- subMenuClassName: PropTypes__default['default'].string,
40
- subMenuItemClassName: PropTypes__default['default'].string,
41
- subMenuLinkClassName: PropTypes__default['default'].string,
42
- hasDropdownClassName: PropTypes__default['default'].string,
43
- dropdownClassName: PropTypes__default['default'].string,
44
- dropdownItemClassName: PropTypes__default['default'].string,
45
- dropdownLinkClassName: PropTypes__default['default'].string,
33
+ tagName: PropTypes__default["default"].string,
34
+ itemTagName: PropTypes__default["default"].string,
35
+ children: PropTypes__default["default"].node,
36
+ linkAsItem: PropTypes__default["default"].bool,
37
+ className: PropTypes__default["default"].string,
38
+ itemClassName: PropTypes__default["default"].string,
39
+ linkClassName: PropTypes__default["default"].string,
40
+ hasSubMenuClassName: PropTypes__default["default"].string,
41
+ subMenuClassName: PropTypes__default["default"].string,
42
+ subMenuItemClassName: PropTypes__default["default"].string,
43
+ subMenuLinkClassName: PropTypes__default["default"].string,
44
+ hasDropdownClassName: PropTypes__default["default"].string,
45
+ dropdownClassName: PropTypes__default["default"].string,
46
+ dropdownItemClassName: PropTypes__default["default"].string,
47
+ dropdownLinkClassName: PropTypes__default["default"].string,
46
48
  dropdownAlign: core.PropTypes.dropdownAlign
47
49
  };
48
50
  var defaultProps = {
@@ -87,12 +89,12 @@ var Menu = function Menu(_ref) {
87
89
  var _useState = React.useState(items.map(function () {
88
90
  return false;
89
91
  })),
90
- _useState2 = _slicedToArray__default['default'](_useState, 2),
92
+ _useState2 = _slicedToArray__default["default"](_useState, 2),
91
93
  dropdownsVisible = _useState2[0],
92
94
  setDropdownsVisible = _useState2[1];
93
95
 
94
96
  var ListComponent = linkAsItem ? 'div' : tagName;
95
- return /*#__PURE__*/React__default['default'].createElement(ListComponent, {
97
+ return /*#__PURE__*/React__default["default"].createElement(ListComponent, {
96
98
  className: className
97
99
  }, children !== null ? children : items.map(function (it, index) {
98
100
  var _classNames, _classNames2, _classNames3, _classNames4, _classNames5, _classNames6, _classNames7;
@@ -115,50 +117,52 @@ var Menu = function Menu(_ref) {
115
117
  active = _it$active === void 0 ? false : _it$active,
116
118
  _it$onClick = it.onClick,
117
119
  customOnClick = _it$onClick === void 0 ? null : _it$onClick,
118
- itemProps = _objectWithoutProperties__default['default'](it, _excluded);
120
+ itemProps = _objectWithoutProperties__default["default"](it, _excluded);
119
121
 
120
122
  var onClickItem = dropdown !== null ? function (e) {
121
123
  e.preventDefault();
122
- setDropdownsVisible([].concat(_toConsumableArray__default['default'](dropdownsVisible.slice(0, index)), [!(dropdownsVisible[index] || false)], _toConsumableArray__default['default'](dropdownsVisible.slice(index + 1))));
124
+ e.stopPropagation();
125
+ setDropdownsVisible([].concat(_toConsumableArray__default["default"](dropdownsVisible.slice(0, index)), [!(dropdownsVisible[index] || false)], _toConsumableArray__default["default"](dropdownsVisible.slice(index + 1))));
123
126
 
124
127
  if (customOnClick !== null) {
125
128
  customOnClick(e);
126
129
  }
127
130
  } : customOnClick;
128
131
  var closeDropdown = dropdown !== null ? function () {
129
- setDropdownsVisible([].concat(_toConsumableArray__default['default'](dropdownsVisible.slice(0, index)), [false], _toConsumableArray__default['default'](dropdownsVisible.slice(index + 1))));
132
+ setDropdownsVisible([].concat(_toConsumableArray__default["default"](dropdownsVisible.slice(0, index)), [false], _toConsumableArray__default["default"](dropdownsVisible.slice(index + 1))));
130
133
  } : null;
131
134
  var ItemComponent = itemTagName;
132
- return linkAsItem ? /*#__PURE__*/React__default['default'].createElement(Link__default['default'], Object.assign({}, itemProps, {
135
+ var dropdownVisible = dropdownsVisible[index] || false;
136
+ return linkAsItem ? /*#__PURE__*/React__default["default"].createElement(Link__default["default"], Object.assign({}, itemProps, {
133
137
  key: "item-".concat(id || index),
134
138
  onClick: onClickItem,
135
139
  href: href,
136
140
  external: external,
137
- className: classNames__default['default']((_classNames = {
141
+ className: classNames__default["default"]((_classNames = {
138
142
  active: active
139
- }, _defineProperty__default['default'](_classNames, itemClassName, itemClassName !== null), _defineProperty__default['default'](_classNames, customClassName, customClassName !== null), _defineProperty__default['default'](_classNames, linkClassName, linkClassName !== null), _defineProperty__default['default'](_classNames, customLinkClassName, customLinkClassName !== null), _classNames))
140
- }), /*#__PURE__*/React__default['default'].createElement(Label__default['default'], itemProps, label)) : /*#__PURE__*/React__default['default'].createElement(ItemComponent, {
143
+ }, _defineProperty__default["default"](_classNames, itemClassName, itemClassName !== null), _defineProperty__default["default"](_classNames, customClassName, customClassName !== null), _defineProperty__default["default"](_classNames, linkClassName, linkClassName !== null), _defineProperty__default["default"](_classNames, customLinkClassName, customLinkClassName !== null), _classNames))
144
+ }), /*#__PURE__*/React__default["default"].createElement(Label__default["default"], itemProps, label)) : /*#__PURE__*/React__default["default"].createElement(ItemComponent, {
141
145
  key: "item-".concat(id || index),
142
- className: classNames__default['default']((_classNames2 = {
146
+ className: classNames__default["default"]((_classNames2 = {
143
147
  dropdown: dropdown !== null,
144
148
  active: active
145
- }, _defineProperty__default['default'](_classNames2, itemClassName, itemClassName !== null), _defineProperty__default['default'](_classNames2, customClassName, customClassName !== null), _defineProperty__default['default'](_classNames2, hasSubMenuClassName, subItems !== null && hasSubMenuClassName !== null), _defineProperty__default['default'](_classNames2, hasDropdownClassName, subItems !== null && hasDropdownClassName !== null), _classNames2))
146
- }, href !== null ? /*#__PURE__*/React__default['default'].createElement(Link__default['default'], Object.assign({}, itemProps, {
149
+ }, _defineProperty__default["default"](_classNames2, itemClassName, itemClassName !== null), _defineProperty__default["default"](_classNames2, customClassName, customClassName !== null), _defineProperty__default["default"](_classNames2, hasSubMenuClassName, subItems !== null && hasSubMenuClassName !== null), _defineProperty__default["default"](_classNames2, hasDropdownClassName, subItems !== null && hasDropdownClassName !== null), _classNames2))
150
+ }, href !== null || dropdown !== null ? /*#__PURE__*/React__default["default"].createElement(Link__default["default"], Object.assign({}, itemProps, {
147
151
  onClick: onClickItem,
148
- href: href,
152
+ href: href || '#',
149
153
  external: external,
150
- className: classNames__default['default']((_classNames3 = {}, _defineProperty__default['default'](_classNames3, linkClassName, linkClassName !== null), _defineProperty__default['default'](_classNames3, 'dropdown-toggle', dropdown !== null), _defineProperty__default['default'](_classNames3, customLinkClassName, customLinkClassName !== null), _classNames3))
151
- }), label) : /*#__PURE__*/React__default['default'].createElement(Label__default['default'], itemProps, label), subItems !== null ? /*#__PURE__*/React__default['default'].createElement(Menu, {
154
+ className: classNames__default["default"]((_classNames3 = {}, _defineProperty__default["default"](_classNames3, linkClassName, linkClassName !== null), _defineProperty__default["default"](_classNames3, 'dropdown-toggle', dropdown !== null), _defineProperty__default["default"](_classNames3, customLinkClassName, customLinkClassName !== null), _classNames3))
155
+ }), label) : /*#__PURE__*/React__default["default"].createElement(Label__default["default"], itemProps, label), subItems !== null ? /*#__PURE__*/React__default["default"].createElement(Menu, {
152
156
  items: subItems,
153
157
  className: subMenuClassName,
154
- itemClassName: classNames__default['default']((_classNames4 = {}, _defineProperty__default['default'](_classNames4, subMenuItemClassName, subMenuItemClassName !== null), _defineProperty__default['default'](_classNames4, itemClassName, subMenuItemClassName === null && itemClassName !== null), _classNames4)),
155
- linkClassName: classNames__default['default']((_classNames5 = {}, _defineProperty__default['default'](_classNames5, subMenuLinkClassName, subMenuLinkClassName !== null), _defineProperty__default['default'](_classNames5, linkClassName, subMenuLinkClassName === null && linkClassName !== null), _classNames5))
156
- }) : null, dropdown !== null ? /*#__PURE__*/React__default['default'].createElement(Dropdown__default['default'], {
158
+ itemClassName: classNames__default["default"]((_classNames4 = {}, _defineProperty__default["default"](_classNames4, subMenuItemClassName, subMenuItemClassName !== null), _defineProperty__default["default"](_classNames4, itemClassName, subMenuItemClassName === null && itemClassName !== null), _classNames4)),
159
+ linkClassName: classNames__default["default"]((_classNames5 = {}, _defineProperty__default["default"](_classNames5, subMenuLinkClassName, subMenuLinkClassName !== null), _defineProperty__default["default"](_classNames5, linkClassName, subMenuLinkClassName === null && linkClassName !== null), _classNames5))
160
+ }) : null, dropdown !== null ? /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"], {
157
161
  items: dropdown,
158
- visible: dropdownsVisible[index] || false,
162
+ visible: dropdownVisible,
159
163
  className: dropdownClassName,
160
- itemClassName: classNames__default['default']((_classNames6 = {}, _defineProperty__default['default'](_classNames6, dropdownItemClassName, dropdownItemClassName !== null), _defineProperty__default['default'](_classNames6, itemClassName, dropdownItemClassName === null && itemClassName !== null), _classNames6)),
161
- linkClassName: classNames__default['default']((_classNames7 = {}, _defineProperty__default['default'](_classNames7, dropdownLinkClassName, dropdownLinkClassName !== null), _defineProperty__default['default'](_classNames7, linkClassName, dropdownLinkClassName === null && linkClassName !== null), _classNames7)),
164
+ itemClassName: classNames__default["default"]((_classNames6 = {}, _defineProperty__default["default"](_classNames6, dropdownItemClassName, dropdownItemClassName !== null), _defineProperty__default["default"](_classNames6, itemClassName, dropdownItemClassName === null && itemClassName !== null), _classNames6)),
165
+ linkClassName: classNames__default["default"]((_classNames7 = {}, _defineProperty__default["default"](_classNames7, dropdownLinkClassName, dropdownLinkClassName !== null), _defineProperty__default["default"](_classNames7, linkClassName, dropdownLinkClassName === null && linkClassName !== null), _classNames7)),
162
166
  align: dropdownAlign,
163
167
  onClickItem: closeDropdown,
164
168
  onClickOutside: closeDropdown
@@ -169,4 +173,4 @@ var Menu = function Menu(_ref) {
169
173
  Menu.propTypes = propTypes;
170
174
  Menu.defaultProps = defaultProps;
171
175
 
172
- module.exports = Menu;
176
+ exports["default"] = Menu;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panneau/element-menu",
3
- "version": "1.0.0-y.0",
3
+ "version": "1.0.3-alpha.2",
4
4
  "description": "Menu element",
5
5
  "keywords": [
6
6
  "javascript"
@@ -44,26 +44,26 @@
44
44
  "prepare": "../../scripts/prepare-package.sh"
45
45
  },
46
46
  "devDependencies": {
47
- "react": "^16.8.0",
48
- "react-dom": "^16.8.0",
49
- "react-router-dom": "^5.2.0"
47
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
48
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
49
+ "react-router-dom": "^6.2.1"
50
50
  },
51
51
  "peerDependencies": {
52
- "react": "^16.8.0",
53
- "react-dom": "^16.8.0"
52
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
53
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
54
54
  },
55
55
  "dependencies": {
56
56
  "@babel/runtime": "^7.12.5",
57
- "@panneau/core": "^1.0.0-y.0",
58
- "@panneau/element-dropdown": "^1.0.0-y.0",
59
- "@panneau/element-label": "^1.0.0-y.0",
60
- "@panneau/element-link": "^1.0.0-y.0",
57
+ "@panneau/core": "^1.0.3-alpha.1",
58
+ "@panneau/element-dropdown": "^1.0.3-alpha.2",
59
+ "@panneau/element-label": "^1.0.3-alpha.1",
60
+ "@panneau/element-link": "^1.0.3-alpha.2",
61
61
  "classnames": "^2.2.6",
62
62
  "prop-types": "^15.7.2",
63
- "react-intl": "^5.15.8"
63
+ "react-intl": "^5.15.8||^6.0.0"
64
64
  },
65
65
  "publishConfig": {
66
66
  "access": "public"
67
67
  },
68
- "gitHead": "168d858d58681ee6c96f00ec460a456576cb512b"
68
+ "gitHead": "3fb9865bb17e8ddc0b2d372d38f39700c90e2605"
69
69
  }