@occmundial/occ-atomic 3.0.0-beta.59 → 3.0.0-beta.60

Sign up to get free protection for your applications and to get access to all the features.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ # [3.0.0-beta.60](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.59...v3.0.0-beta.60) (2024-09-23)
2
+
3
+
4
+ ### Features
5
+
6
+ * Add menu componente and delete deprecated header comps ([572334c](https://github.com/occmundial/occ-atomic/commit/572334ce94949fbcbf7dfaa165cfb349d6c4f762))
7
+
1
8
  # [3.0.0-beta.59](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.58...v3.0.0-beta.59) (2024-09-10)
2
9
 
3
10
 
@@ -0,0 +1,111 @@
1
+ "use strict";
2
+
3
+ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = Menu;
9
+
10
+ var _react = _interopRequireWildcard(require("react"));
11
+
12
+ var _propTypes = _interopRequireDefault(require("prop-types"));
13
+
14
+ var _react2 = require("@floating-ui/react");
15
+
16
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
17
+
18
+ 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); }
19
+
20
+ 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; }
21
+
22
+ 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); }
23
+
24
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
25
+
26
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
27
+
28
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
29
+
30
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
31
+
32
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
33
+
34
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
35
+
36
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
37
+
38
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
39
+
40
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
41
+
42
+ function Menu(_ref) {
43
+ var children = _ref.children,
44
+ id = _ref.id,
45
+ classes = _ref.classes,
46
+ className = _ref.className,
47
+ triggerElement = _ref.triggerElement,
48
+ _ref$placement = _ref.placement,
49
+ placement = _ref$placement === void 0 ? 'left' : _ref$placement;
50
+
51
+ var _useState = (0, _react.useState)(false),
52
+ _useState2 = _slicedToArray(_useState, 2),
53
+ open = _useState2[0],
54
+ setOpen = _useState2[1];
55
+
56
+ var _useFloating = (0, _react2.useFloating)({
57
+ open: open,
58
+ onOpenChange: setOpen,
59
+ placement: placement === 'left' ? 'bottom-start' : 'bottom-end',
60
+ middleware: [(0, _react2.offset)(16), (0, _react2.shift)()],
61
+ whileElementsMounted: _react2.autoUpdate
62
+ }),
63
+ refs = _useFloating.refs,
64
+ floatingStyles = _useFloating.floatingStyles,
65
+ context = _useFloating.context;
66
+
67
+ var click = (0, _react2.useClick)(context);
68
+ var dismiss = (0, _react2.useDismiss)(context);
69
+ var role = (0, _react2.useRole)(context);
70
+
71
+ var _useInteractions = (0, _react2.useInteractions)([click, dismiss, role]),
72
+ getReferenceProps = _useInteractions.getReferenceProps,
73
+ getFloatingProps = _useInteractions.getFloatingProps;
74
+
75
+ return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, triggerElement ? /*#__PURE__*/(0, _react.cloneElement)(triggerElement, _objectSpread({
76
+ ref: refs.setReference
77
+ }, getReferenceProps())) : '', open && /*#__PURE__*/_react["default"].createElement(_react2.FloatingPortal, null, /*#__PURE__*/_react["default"].createElement(_react2.FloatingFocusManager, {
78
+ context: context,
79
+ modal: false
80
+ }, /*#__PURE__*/_react["default"].createElement("div", _extends({
81
+ className: "".concat(classes.contentWrapper).concat(className ? " ".concat(className) : ''),
82
+ id: id,
83
+ ref: refs.setFloating,
84
+ style: floatingStyles
85
+ }, getFloatingProps()), children))));
86
+ }
87
+
88
+ Menu.defaultProps = {
89
+ placement: 'left'
90
+ };
91
+ Menu.propTypes = {
92
+ classes: _propTypes["default"].object,
93
+
94
+ /** React element to render inside the Menu. */
95
+ children: _propTypes["default"].node,
96
+
97
+ /** React element that triggers the Menu status. */
98
+ triggerElement: _propTypes["default"].node,
99
+
100
+ /** Boolean value to show or hide the Menu component. */
101
+ open: _propTypes["default"].bool,
102
+
103
+ /** Id that sets to Children container */
104
+ id: _propTypes["default"].string,
105
+
106
+ /** Adds root container classes. */
107
+ className: _propTypes["default"].string,
108
+
109
+ /** Determines the placement of the Menu */
110
+ placement: _propTypes["default"].oneOf(['left', 'right'])
111
+ };
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _reactJss = _interopRequireDefault(require("react-jss"));
9
+
10
+ var _Menu = _interopRequireDefault(require("./Menu"));
11
+
12
+ var _styles = _interopRequireDefault(require("./styles"));
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
15
+
16
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
17
+
18
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
19
+
20
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
21
+
22
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
23
+
24
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
25
+
26
+ var StyledMenu = (0, _reactJss["default"])(_styles["default"])(_Menu["default"]); // eslint-disable-next-line
27
+
28
+ var _Menu$propTypes = _Menu["default"].propTypes,
29
+ classes = _Menu$propTypes.classes,
30
+ propTypes = _objectWithoutProperties(_Menu$propTypes, ["classes"]);
31
+
32
+ StyledMenu.propTypes = _objectSpread(_objectSpread({}, propTypes), StyledMenu.propTypes);
33
+ var _default = StyledMenu;
34
+ exports["default"] = _default;
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports["default"] = void 0;
7
+
8
+ var _colors = _interopRequireDefault(require("../tokens/colors.json"));
9
+
10
+ var _spacing = _interopRequireDefault(require("../tokens/spacing.json"));
11
+
12
+ var _borderRadius = _interopRequireDefault(require("../tokens/borderRadius.json"));
13
+
14
+ var _shadows = _interopRequireDefault(require("../tokens/shadows.json"));
15
+
16
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
17
+
18
+ var _default = {
19
+ contentWrapper: {
20
+ width: 280,
21
+ backgroundColor: _colors["default"].bg.surface["default"],
22
+ borderRadius: _borderRadius["default"]['br-sm'],
23
+ border: "1px solid ".concat(_colors["default"].border["default"]["default"]),
24
+ padding: _spacing["default"]['size-2'],
25
+ boxShadow: _shadows["default"]['elevation-elevation-5']
26
+ }
27
+ };
28
+ exports["default"] = _default;
package/build/index.js CHANGED
@@ -100,13 +100,9 @@ var _Tabs = _interopRequireDefault(require("./Tabs"));
100
100
 
101
101
  var _context = require("./Tabs/context");
102
102
 
103
- var _Footer = _interopRequireDefault(require("./Footer"));
104
-
105
- var _Header = _interopRequireDefault(require("./Header"));
106
-
107
- var _Nav = _interopRequireDefault(require("./Header/Nav"));
103
+ var _Menu = _interopRequireDefault(require("./Menu"));
108
104
 
109
- var _Menu = _interopRequireDefault(require("./Header/Menu"));
105
+ var _Footer = _interopRequireDefault(require("./Footer"));
110
106
 
111
107
  var _SightLogo = _interopRequireDefault(require("./SightLogo"));
112
108
 
@@ -136,14 +132,9 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
136
132
 
137
133
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
138
134
 
139
- // Layout elements
140
- // UI elements
141
- // UI molecules
142
- // UI organisms
143
- // R12 elements, molecules & organisms
144
- // Subatomic values
145
- // HOC
146
- module.exports = {
135
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
136
+
137
+ module.exports = _defineProperty({
147
138
  Container: _Container["default"],
148
139
  Row: _Row["default"],
149
140
  Column: _Column["default"],
@@ -188,8 +179,6 @@ module.exports = {
188
179
  Toaster: _Toaster["default"],
189
180
  toaster: _functions.toaster,
190
181
  Footer: _Footer["default"],
191
- Header: _Header["default"],
192
- Nav: _Nav["default"],
193
182
  Menu: _Menu["default"],
194
183
  SightLogo: _SightLogo["default"],
195
184
  colors: _colors["default"],
@@ -209,4 +198,4 @@ module.exports = {
209
198
  TabsProviderUncontrolled: _context.TabsProviderUncontrolled,
210
199
  Tab: _Tab["default"],
211
200
  TabContent: _TabContent["default"]
212
- };
201
+ }, "Menu", _Menu["default"]);
@@ -35,8 +35,6 @@ function importModule(path) {
35
35
 
36
36
  if (importName === 'toaster') {
37
37
  return importDeclaration(specifier, '@occmundial/occ-atomic/build/Toaster/functions');
38
- } else if (importName === 'Nav' || importName === 'Menu') {
39
- return importDeclaration(specifier, "@occmundial/occ-atomic/build/Header/".concat(importName));
40
38
  } else if (importName === 'AtomicProvider') {
41
39
  return importDeclaration(types.importDefaultSpecifier(types.identifier('AtomicProvider')), '@occmundial/occ-atomic/build/Provider');
42
40
  } else if (subatomic.includes(importName)) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@occmundial/occ-atomic",
3
- "version": "3.0.0-beta.59",
3
+ "version": "3.0.0-beta.60",
4
4
  "description": "Collection of shareable styled React components for OCC applications.",
5
5
  "homepage": "http://occmundial.github.io/occ-atomic",
6
6
  "main": "build/index.js",
@@ -95,7 +95,7 @@
95
95
  "webpack-dev-server": "^4.2.0"
96
96
  },
97
97
  "dependencies": {
98
- "@floating-ui/react": "^0.24.1",
98
+ "@floating-ui/react": "0.24.1",
99
99
  "class-autobind": "^0.1.4",
100
100
  "hex-rgba": "^1.0.2",
101
101
  "idx": "^2.5.6",
@@ -1,163 +0,0 @@
1
- "use strict";
2
-
3
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var _propTypes = _interopRequireDefault(require("prop-types"));
13
-
14
- var _reactWaypoint = _interopRequireDefault(require("react-waypoint"));
15
-
16
- var _Hidden = _interopRequireDefault(require("../Hidden"));
17
-
18
- var _Visible = _interopRequireDefault(require("../Visible"));
19
-
20
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
21
-
22
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
23
-
24
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
25
-
26
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
27
-
28
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
29
-
30
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
31
-
32
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
33
-
34
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
35
-
36
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
37
-
38
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
39
-
40
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
41
-
42
- /**
43
- * This header component should be filled with a logo section, a nav section and a user menu.
44
- * For the nav section, use the Nav component of this library. In desktop it will be displayed rght next to the logo. In mobile it will appear below the logo and user menu.
45
- * For the user menu, use the Menu component of this library.
46
- * This header includes a Messages/Chat icon, which you can configure with the messageIcon property.
47
- * (NOTE: The example will not work properly in mobile, since it uses fixed positioning, breaking the Header because is not in the top of the page.)
48
- * The documentation for Nav and Menu is not included here, since they are completely dependant of Header. Use the example below to see how to implement them.
49
- */
50
- var Header = /*#__PURE__*/function (_React$Component) {
51
- _inherits(Header, _React$Component);
52
-
53
- var _super = _createSuper(Header);
54
-
55
- function Header(props) {
56
- var _this;
57
-
58
- _classCallCheck(this, Header);
59
-
60
- _this = _super.call(this, props);
61
- _this.state = {
62
- shadow: true
63
- };
64
- _this.removeShadow = _this.removeShadow.bind(_assertThisInitialized(_this));
65
- _this.addShadow = _this.addShadow.bind(_assertThisInitialized(_this));
66
- return _this;
67
- }
68
-
69
- _createClass(Header, [{
70
- key: "componentDidMount",
71
- value: function componentDidMount() {
72
- if (process.env.NODE_ENV === 'development') {
73
- console.warn('DEPRECATED: The Header component will be removed soon. Use the NavTab component instead.');
74
- }
75
- }
76
- }, {
77
- key: "removeShadow",
78
- value: function removeShadow() {
79
- this.setState({
80
- shadow: false
81
- });
82
- }
83
- }, {
84
- key: "addShadow",
85
- value: function addShadow() {
86
- this.setState({
87
- shadow: true
88
- });
89
- }
90
- }, {
91
- key: "render",
92
- value: function render() {
93
- var shadow = this.state.shadow;
94
- var _this$props = this.props,
95
- classes = _this$props.classes,
96
- logo = _this$props.logo,
97
- nav = _this$props.nav,
98
- menu = _this$props.menu,
99
- title = _this$props.title,
100
- messagesIcon = _this$props.messagesIcon;
101
- return /*#__PURE__*/_react["default"].createElement("div", {
102
- id: "mainNav",
103
- className: classes.navbar
104
- }, /*#__PURE__*/_react["default"].createElement("div", {
105
- className: "".concat(classes.master, " ").concat(shadow ? classes.shadow : '')
106
- }, /*#__PURE__*/_react["default"].createElement("div", {
107
- className: classes.content
108
- }, /*#__PURE__*/_react["default"].createElement(_Hidden["default"], {
109
- xs: true
110
- }, logo), /*#__PURE__*/_react["default"].createElement(_Visible["default"], {
111
- xs: true
112
- }, /*#__PURE__*/_react["default"].createElement("div", {
113
- className: classes.title
114
- }, title)), /*#__PURE__*/_react["default"].createElement("div", {
115
- className: classes.user
116
- }, messagesIcon.hasOwnProperty('active') && messagesIcon.active && /*#__PURE__*/_react["default"].createElement("a", {
117
- id: messagesIcon.id,
118
- href: messagesIcon.href,
119
- className: classes.messages
120
- }, /*#__PURE__*/_react["default"].createElement("i", {
121
- className: classes.bubble
122
- })), menu), /*#__PURE__*/_react["default"].createElement(_Hidden["default"], {
123
- xs: true
124
- }, nav))), /*#__PURE__*/_react["default"].createElement(_Visible["default"], {
125
- xs: true
126
- }, /*#__PURE__*/_react["default"].createElement("div", {
127
- className: classes.separate
128
- }, /*#__PURE__*/_react["default"].createElement(_reactWaypoint["default"], {
129
- topOffset: 60,
130
- onEnter: this.removeShadow,
131
- onLeave: this.addShadow
132
- }, /*#__PURE__*/_react["default"].createElement("div", {
133
- className: !shadow ? classes.shadow : ''
134
- }, nav)))));
135
- }
136
- }]);
137
-
138
- return Header;
139
- }(_react["default"].Component);
140
-
141
- Header.defaultProps = {
142
- messagesIcon: {}
143
- };
144
- Header.propTypes = {
145
- classes: _propTypes["default"].object,
146
-
147
- /** Send any content as the logo of your app. */
148
- logo: _propTypes["default"].node,
149
-
150
- /** The title of the section you're in. This will be visible in mobile. */
151
- title: _propTypes["default"].string,
152
-
153
- /** Nav component with the required props. */
154
- nav: _propTypes["default"].node,
155
-
156
- /** Menu component with the required props. */
157
- menu: _propTypes["default"].node,
158
-
159
- /** Object with the properties to display the message/chat icon. To show it, pass an object with active: true, an id and the href property. */
160
- messagesIcon: _propTypes["default"].object
161
- };
162
- var _default = Header;
163
- exports["default"] = _default;
@@ -1,118 +0,0 @@
1
- "use strict";
2
-
3
- var _react = _interopRequireDefault(require("react"));
4
-
5
- var _enzyme = require("enzyme");
6
-
7
- var _Header = _interopRequireDefault(require("./Header"));
8
-
9
- var _styles = _interopRequireDefault(require("./styles"));
10
-
11
- var _index = _interopRequireDefault(require("./index"));
12
-
13
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
14
-
15
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
16
-
17
- var reduceClasses = function reduceClasses(prev, curr) {
18
- return Object.assign({}, prev, _defineProperty({}, curr, curr));
19
- };
20
-
21
- var classes = Object.keys(_styles["default"]).reduce(reduceClasses, {});
22
- describe("Header", function () {
23
- it('matches the snapshot', function () {
24
- var wrapper = (0, _enzyme.shallow)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
25
- classes: classes
26
- }));
27
- expect(wrapper).toMatchSnapshot();
28
- });
29
- it('shows the shadow at the right place', function () {
30
- var wrapper = (0, _enzyme.shallow)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
31
- classes: classes
32
- }));
33
- global.innerWidth = 500;
34
- global.dispatchEvent(new Event('resize'));
35
- wrapper.update();
36
- expect(wrapper.find('.master').hasClass('shadow')).toBe(true);
37
- expect(wrapper.find('.separate .shadow').length).toBe(0);
38
- wrapper.setState({
39
- shadow: false
40
- });
41
- expect(wrapper.find('.master').hasClass('shadow')).toBe(false);
42
- expect(wrapper.find('.separate .shadow').length).toBe(1);
43
- });
44
- it('shows and hides the logo', function () {
45
- var wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
46
- classes: classes,
47
- logo: "Logo"
48
- }));
49
- global.innerWidth = 1200;
50
- global.dispatchEvent(new Event('resize'));
51
- expect(wrapper.find('.content').text()).toBe('Logo');
52
- global.innerWidth = 500;
53
- global.dispatchEvent(new Event('resize'));
54
- expect(wrapper.find('.content').text()).toBe('');
55
- });
56
- it('shows and hides the title', function () {
57
- var wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
58
- classes: classes,
59
- title: "Title"
60
- }));
61
- global.innerWidth = 1200;
62
- global.dispatchEvent(new Event('resize'));
63
- expect(wrapper.find('.content').text()).toBe('');
64
- global.innerWidth = 500;
65
- global.dispatchEvent(new Event('resize'));
66
- expect(wrapper.find('.content').text()).toBe('Title');
67
- });
68
- it('renders the message icon', function () {
69
- var wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
70
- classes: classes,
71
- messagesIcon: {
72
- active: true,
73
- id: 'messagesIcon',
74
- href: '#'
75
- }
76
- }));
77
- expect(wrapper.find('#messagesIcon').at(0).length).toBe(1);
78
- wrapper.setProps({
79
- messagesIcon: {}
80
- });
81
- expect(wrapper.find('#messagesIcon').at(0).length).toBe(0);
82
- });
83
- it('renders the menu', function () {
84
- var wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
85
- classes: classes,
86
- menu: "Menu"
87
- }));
88
- expect(wrapper.find('.user').text()).toBe('Menu');
89
- });
90
- it('renders the nav menu', function () {
91
- var wrapper = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(_Header["default"], {
92
- classes: classes,
93
- nav: "Nav"
94
- }));
95
- global.innerWidth = 1200;
96
- global.dispatchEvent(new Event('resize'));
97
- wrapper.update();
98
- expect(wrapper.find('.content').text()).toBe('Nav');
99
- expect(wrapper.find('.separate').length).toBe(0);
100
- global.innerWidth = 500;
101
- global.dispatchEvent(new Event('resize'));
102
- wrapper.update();
103
- expect(wrapper.find('.content').text()).toBe('');
104
- expect(wrapper.find('.separate').length).toBe(1);
105
- expect(wrapper.find('.separate').text()).toBe('Nav');
106
- });
107
- });
108
- describe("HeaderJSS", function () {
109
- it('matches the snapshot', function () {
110
- var wrapper = (0, _enzyme.shallow)( /*#__PURE__*/_react["default"].createElement(_index["default"], null));
111
- expect(wrapper).toMatchSnapshot();
112
- });
113
- });
114
- describe("Header styles", function () {
115
- it('matches the snapshot', function () {
116
- expect(_styles["default"]).toMatchSnapshot();
117
- });
118
- });