luna-one 1.0.236 → 1.0.237

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.
@@ -1,178 +1,196 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- import React, { lazy, Suspense, useState } from "react";
1
+ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
2
+ import _createClass from "@babel/runtime/helpers/esm/createClass";
3
+ import _inherits from "@babel/runtime/helpers/esm/inherits";
4
+ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
5
+ import React, { Component, lazy, Suspense } from "react";
3
6
  import "./NavBarTop.scss";
4
7
  import globe from "../../images/worldwide.svg";
5
8
  import search from "../../images/search.svg";
6
9
  import searchHighlighted from "../../images/search-highlighted.svg";
7
- import { NavLink } from "react-router-dom";
10
+ import { NavLink } from "react-router-dom"; // import NavSearch from "../NavSearch/NavSearch";
11
+
8
12
  import formatID from "../../utils/formatID";
9
13
  var NavSearch = lazy(function () {
10
14
  return import("../NavSearch/NavSearch");
11
15
  });
12
16
 
13
- var NavBarTop = function NavBarTop(_ref) {
14
- var _logo$link;
15
-
16
- var language = _ref.language,
17
- divisionName = _ref.divisionName,
18
- logo = _ref.logo,
19
- location = _ref.location,
20
- rightLinks = _ref.rightLinks,
21
- handleHamburgerClick = _ref.handleHamburgerClick,
22
- hamburgerIsOpen = _ref.hamburgerIsOpen,
23
- searchField = _ref.searchField,
24
- handleSearchFieldChange = _ref.handleSearchFieldChange,
25
- placeholder = _ref.placeholder,
26
- searchSubmit = _ref.searchSubmit,
27
- toggleRegionLanguageDeployed = _ref.toggleRegionLanguageDeployed,
28
- _ref$disableSearch = _ref.disableSearch,
29
- disableSearch = _ref$disableSearch === void 0 ? false : _ref$disableSearch;
30
-
31
- var _useState = useState(false),
32
- _useState2 = _slicedToArray(_useState, 2),
33
- desktopSearchDeployed = _useState2[0],
34
- setDesktopSearchDeployed = _useState2[1];
35
-
36
- var _useState3 = useState(null),
37
- _useState4 = _slicedToArray(_useState3, 2),
38
- searchState = _useState4[0],
39
- setSearchState = _useState4[1];
40
-
41
- var toggleDesktopSearch = function toggleDesktopSearch() {
42
- if (!desktopSearchDeployed) {
43
- setDesktopSearchDeployed(true);
44
- } else if ((searchField === null || searchField === void 0 ? void 0 : searchField.length) > 0) {
45
- searchSubmit();
46
- setDesktopSearchDeployed(false);
47
- } else {
48
- setDesktopSearchDeployed(false);
49
- }
50
- };
51
-
52
- var handleSubmit = function handleSubmit() {
53
- searchSubmit();
54
- toggleDesktopSearch();
55
- };
56
-
57
- var generateRightLinks = function generateRightLinks() {
58
- return rightLinks === null || rightLinks === void 0 ? void 0 : rightLinks.map(function (link) {
59
- var url = link.url,
60
- text = link.text;
61
-
62
- if ((url === null || url === void 0 ? void 0 : url.substring(0, 4)) === "http") {
63
- return /*#__PURE__*/React.createElement("a", {
64
- id: formatID("".concat(text, "-navbar-top-link")),
65
- key: text,
66
- href: url,
67
- className: "ter-navbar-top__link",
68
- target: (link === null || link === void 0 ? void 0 : link.external) === false ? "_self" : "_blank",
69
- rel: (link === null || link === void 0 ? void 0 : link.external) === false ? "" : "noopener nofollow"
70
- }, text);
17
+ var NavBarTop = /*#__PURE__*/function (_Component) {
18
+ _inherits(NavBarTop, _Component);
19
+
20
+ var _super = _createSuper(NavBarTop);
21
+
22
+ function NavBarTop() {
23
+ var _this;
24
+
25
+ _classCallCheck(this, NavBarTop);
26
+
27
+ _this = _super.call(this);
28
+
29
+ _this.toggleDesktopSearch = function () {
30
+ if (!_this.state.desktopSearchDeployed) {
31
+ _this.setState({
32
+ desktopSearchDeployed: true
33
+ });
34
+ } else if (_this.props.searchField.length > 0) {
35
+ _this.props.searchSubmit();
36
+
37
+ _this.setState({
38
+ desktopSearchDeployed: false
39
+ });
71
40
  } else {
72
- return /*#__PURE__*/React.createElement(NavLink, {
73
- id: formatID("".concat(text, "-navbar-top-link")),
74
- key: text,
75
- "aria-label": "link to ".concat(text),
76
- to: url,
77
- style: {
78
- textDecoration: "none"
79
- },
80
- className: "ter-navbar-top__link"
81
- }, text);
41
+ _this.setState({
42
+ desktopSearchDeployed: false
43
+ });
82
44
  }
83
- });
84
- };
85
-
86
- var mouseOverSearch = function mouseOverSearch() {
87
- setSearchState("hover");
88
- };
89
-
90
- var mouseLeaveSearch = function mouseLeaveSearch() {
91
- setSearchState(null);
92
- };
93
-
94
- var getSearchIcon = function getSearchIcon() {
95
- if (searchState === "hover" || desktopSearchDeployed) {
96
- return searchHighlighted;
97
- } else {
98
- return search;
99
- }
100
- };
101
-
102
- var getSearchStatus = function getSearchStatus() {
103
- if (searchState === "hover") {
104
- return "hover";
105
- } else if (desktopSearchDeployed) {
106
- return "deployed";
107
- } else {
108
- return "default";
109
- }
110
- };
111
-
112
- return /*#__PURE__*/React.createElement("div", {
113
- className: "ter-navbar-top__wrapper"
114
- }, /*#__PURE__*/React.createElement("section", {
115
- className: "ter-navbar-top"
116
- }, /*#__PURE__*/React.createElement("div", {
117
- className: "ter-navbar-top__left"
118
- }, /*#__PURE__*/React.createElement(NavLink, {
119
- id: formatID("".concat(divisionName, "-navbar-link")),
120
- className: "ter-navbar-top__logo-link",
121
- to: logo === null || logo === void 0 ? void 0 : (_logo$link = logo.link) === null || _logo$link === void 0 ? void 0 : _logo$link.url
122
- }, /*#__PURE__*/React.createElement("img", {
123
- className: "ter-navbar-top__logo",
124
- src: logo === null || logo === void 0 ? void 0 : logo.url,
125
- alt: (logo === null || logo === void 0 ? void 0 : logo.altText) ? logo === null || logo === void 0 ? void 0 : logo.altText : "",
126
- loading: "lazy"
127
- }), /*#__PURE__*/React.createElement("p", {
128
- className: "ter-navbar-top__division-name"
129
- }, divisionName))), /*#__PURE__*/React.createElement("div", {
130
- className: "ter-navbar-top__right"
131
- }, /*#__PURE__*/React.createElement("p", {
132
- className: "ter-navbar-top__location",
133
- onClick: function onClick() {
134
- return toggleRegionLanguageDeployed;
45
+ };
46
+
47
+ _this.handleSubmit = function () {
48
+ _this.props.searchSubmit();
49
+
50
+ _this.toggleDesktopSearch();
51
+ };
52
+
53
+ _this.generateRightLinks = function () {
54
+ return _this.props.rightLinks.map(function (link) {
55
+ var url = link.url,
56
+ text = link.text;
57
+
58
+ if (url.substring(0, 4) === "http") {
59
+ return /*#__PURE__*/React.createElement("a", {
60
+ id: formatID("".concat(text, "-navbar-top-link")),
61
+ key: text,
62
+ href: url,
63
+ className: "ter-navbar-top__link",
64
+ target: link.external === false ? "_self" : "_blank",
65
+ rel: link.external === false ? "" : "noopener nofollow"
66
+ }, text);
67
+ } else {
68
+ return /*#__PURE__*/React.createElement(NavLink, {
69
+ id: formatID("".concat(text, "-navbar-top-link")),
70
+ key: text,
71
+ "aria-label": "link to ".concat(text),
72
+ to: url,
73
+ style: {
74
+ textDecoration: "none"
75
+ },
76
+ className: "ter-navbar-top__link"
77
+ }, text);
78
+ }
79
+ });
80
+ };
81
+
82
+ _this.mouseOverSearch = function () {
83
+ _this.setState({
84
+ searchState: "hover"
85
+ });
86
+ };
87
+
88
+ _this.mouseLeaveSearch = function () {
89
+ _this.setState({
90
+ searchState: null
91
+ });
92
+ };
93
+
94
+ _this.getSearchIcon = function () {
95
+ if (_this.state.searchState === "hover" || _this.state.desktopSearchDeployed) {
96
+ return searchHighlighted;
97
+ } else {
98
+ return search;
99
+ }
100
+ };
101
+
102
+ _this.getSearchStatus = function () {
103
+ if (_this.state.searchState === "hover") {
104
+ return "hover";
105
+ } else if (_this.state.desktopSearchDeployed) {
106
+ return "deployed";
107
+ } else {
108
+ return "default";
109
+ }
110
+ };
111
+
112
+ _this.state = {
113
+ desktopSearchDeployed: false,
114
+ searchState: null
115
+ };
116
+ return _this;
117
+ }
118
+
119
+ _createClass(NavBarTop, [{
120
+ key: "render",
121
+ value: function render() {
122
+ var _this2 = this;
123
+
124
+ return /*#__PURE__*/React.createElement("div", {
125
+ className: "ter-navbar-top__wrapper"
126
+ }, /*#__PURE__*/React.createElement("section", {
127
+ className: "ter-navbar-top"
128
+ }, /*#__PURE__*/React.createElement("div", {
129
+ className: "ter-navbar-top__left"
130
+ }, /*#__PURE__*/React.createElement(NavLink, {
131
+ id: formatID("".concat(this.props.divisionName, "-navbar-link")),
132
+ className: "ter-navbar-top__logo-link",
133
+ to: this.props.logo.link.url
134
+ }, /*#__PURE__*/React.createElement("img", {
135
+ className: "ter-navbar-top__logo",
136
+ src: this.props.logo.url,
137
+ alt: this.props.logo.altText // width="80"
138
+ // height="20"
139
+ // loading="lazy"
140
+
141
+ }), /*#__PURE__*/React.createElement("p", {
142
+ className: "ter-navbar-top__division-name"
143
+ }, /*#__PURE__*/React.createElement("span", null), this.props.divisionName))), /*#__PURE__*/React.createElement("div", {
144
+ className: "ter-navbar-top__right"
145
+ }, /*#__PURE__*/React.createElement("p", {
146
+ className: "ter-navbar-top__location",
147
+ onClick: function onClick() {
148
+ return _this2.props.toggleRegionLanguageDeployed();
149
+ }
150
+ }, this.props.location && this.props.location, this.props.language && " | ".concat(this.props.language.toUpperCase())), /*#__PURE__*/React.createElement("img", {
151
+ onClick: function onClick() {
152
+ return _this2.props.toggleRegionLanguageDeployed();
153
+ },
154
+ className: "ter-navbar-top__globe",
155
+ loading: "lazy",
156
+ src: globe,
157
+ alt: "globe wireframe"
158
+ }), /*#__PURE__*/React.createElement(Suspense, {
159
+ fallback: "Loading..."
160
+ }, /*#__PURE__*/React.createElement(NavSearch, {
161
+ deployed: this.state.desktopSearchDeployed,
162
+ searchField: this.props.searchField,
163
+ placeholder: this.props.placeholder,
164
+ handleChange: this.props.handleSearchFieldChange,
165
+ handleSubmit: this.handleSubmit
166
+ })), /*#__PURE__*/React.createElement("figure", {
167
+ className: "ter-navbar-top__search-wrapper ter-navbar-top__search-wrapper--".concat(this.getSearchStatus()),
168
+ onClick: this.toggleDesktopSearch,
169
+ onMouseOver: this.mouseOverSearch,
170
+ onMouseLeave: this.mouseLeaveSearch
171
+ }, /*#__PURE__*/React.createElement("img", {
172
+ className: "ter-navbar-top__search",
173
+ src: this.getSearchIcon(),
174
+ alt: "magnifying glass",
175
+ width: "15",
176
+ height: "15",
177
+ loading: "lazy"
178
+ })), this.generateRightLinks()), /*#__PURE__*/React.createElement("div", {
179
+ className: "ter-navbar-top__right--mobile"
180
+ }, /*#__PURE__*/React.createElement("div", {
181
+ onClick: this.props.handleHamburgerClick,
182
+ className: "ter-navbar-top__right--mobile-hamburger ".concat(this.props.hamburgerIsOpen ? "ter-navbar-top__right--mobile-hamburger--is-open" : "")
183
+ }, /*#__PURE__*/React.createElement("div", {
184
+ className: "ter-navbar-top__right--mobile-hamburger-top"
185
+ }), /*#__PURE__*/React.createElement("div", {
186
+ className: "ter-navbar-top__right--mobile-hamburger-middle"
187
+ }), /*#__PURE__*/React.createElement("div", {
188
+ className: "ter-navbar-top__right--mobile-hamburger-bottom"
189
+ })))));
135
190
  }
136
- }, location && location, language && " | ".concat(language === null || language === void 0 ? void 0 : language.toUpperCase())), /*#__PURE__*/React.createElement("img", {
137
- onClick: function onClick() {
138
- return toggleRegionLanguageDeployed;
139
- },
140
- className: "ter-navbar-top__globe",
141
- loading: "lazy",
142
- src: globe,
143
- alt: "globe wireframe"
144
- }), !disableSearch && /*#__PURE__*/React.createElement(Suspense, {
145
- fallback: "Loading..."
146
- }, /*#__PURE__*/React.createElement(NavSearch, {
147
- deployed: desktopSearchDeployed,
148
- searchField: searchField,
149
- placeholder: placeholder,
150
- handleChange: handleSearchFieldChange,
151
- handleSubmit: handleSubmit
152
- })), !disableSearch && /*#__PURE__*/React.createElement("figure", {
153
- className: "ter-navbar-top__search-wrapper ter-navbar-top__search-wrapper--".concat(getSearchStatus()),
154
- onClick: toggleDesktopSearch,
155
- onMouseOver: mouseOverSearch,
156
- onMouseLeave: mouseLeaveSearch
157
- }, /*#__PURE__*/React.createElement("img", {
158
- className: "ter-navbar-top__search",
159
- src: getSearchIcon(),
160
- alt: "magnifying glass",
161
- width: "15",
162
- height: "15",
163
- loading: "lazy"
164
- })), generateRightLinks()), /*#__PURE__*/React.createElement("div", {
165
- className: "ter-navbar-top__right--mobile"
166
- }, /*#__PURE__*/React.createElement("div", {
167
- onClick: handleHamburgerClick,
168
- className: "ter-navbar-top__right--mobile-hamburger ".concat(hamburgerIsOpen ? "ter-navbar-top__right--mobile-hamburger--is-open" : "")
169
- }, /*#__PURE__*/React.createElement("div", {
170
- className: "ter-navbar-top__right--mobile-hamburger-top"
171
- }), /*#__PURE__*/React.createElement("div", {
172
- className: "ter-navbar-top__right--mobile-hamburger-middle"
173
- }), /*#__PURE__*/React.createElement("div", {
174
- className: "ter-navbar-top__right--mobile-hamburger-bottom"
175
- })))));
176
- };
191
+ }]);
192
+
193
+ return NavBarTop;
194
+ }(Component);
177
195
 
178
196
  export default NavBarTop;
@@ -1,284 +1,404 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- import React, { useEffect, useState, lazy, Suspense } from "react";
1
+ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
2
+ import _createClass from "@babel/runtime/helpers/esm/createClass";
3
+ import _inherits from "@babel/runtime/helpers/esm/inherits";
4
+ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
5
+ import React, { Component } from "react";
3
6
  import "./NavBar.scss";
4
7
  import { NavLink } from "react-router-dom";
8
+ import MegaMenu from "../../components/MegaMenu/MegaMenu";
9
+ import { Button } from "terra-component-lib";
10
+ import NavBarTop from "../../components/NavBarTop/NavBarTop";
11
+ import MobileNav from "../../components/MobileNav/MobileNav";
12
+ import LanguageSelector from "../../components/LanguageSelector/LanguageSelector";
13
+ import darkDownCaret from "../../images/down-caret-dark-gray.svg";
14
+ import skipIcon from "../../images/skipicon.svg";
5
15
  import "../../../global-styles/fonts/benton.scss";
16
+ import { Link, animateScroll as scroll } from "react-scroll";
6
17
  import { Fade } from "react-awesome-reveal";
7
18
  import formatID from "../../utils/formatID";
8
- import { NavMiniMenu, UtilityNav } from "./NavBarMethods";
9
- var MegaMenu = lazy(function () {
10
- return import("../../components/MegaMenu/MegaMenu");
11
- });
12
- var NavBarTop = lazy(function () {
13
- return import("../../components/NavBarTop/NavBarTop");
14
- });
15
- var MobileNav = lazy(function () {
16
- return import("../../components/MobileNav/MobileNav");
17
- });
18
- var LanguageSelector = lazy(function () {
19
- return import("../../components/LanguageSelector/LanguageSelector");
20
- });
21
-
22
- var NavBar = function NavBar(_ref) {
23
- var location = _ref.location,
24
- navOptions = _ref.navOptions,
25
- languageSelectorData = _ref.languageSelectorData,
26
- currentLanguage = _ref.currentLanguage,
27
- language = _ref.language,
28
- divisionName = _ref.divisionName,
29
- logo = _ref.logo,
30
- rightLinks = _ref.rightLinks,
31
- toggleDesktopSearch = _ref.toggleDesktopSearch,
32
- searchPlaceholder = _ref.searchPlaceholder,
33
- utilityNav = _ref.utilityNav,
34
- navCTA = _ref.navCTA,
35
- lastLocation = _ref.lastLocation,
36
- searchSubmit = _ref.searchSubmit,
37
- _ref$disableSearch = _ref.disableSearch,
38
- disableSearch = _ref$disableSearch === void 0 ? false : _ref$disableSearch;
39
-
40
- var _useState = useState(null),
41
- _useState2 = _slicedToArray(_useState, 2),
42
- isOpen = _useState2[0],
43
- setIsOpen = _useState2[1];
44
-
45
- var _useState3 = useState(0),
46
- _useState4 = _slicedToArray(_useState3, 2),
47
- lastPosition = _useState4[0],
48
- setLastPosition = _useState4[1];
49
-
50
- var _useState5 = useState(false),
51
- _useState6 = _slicedToArray(_useState5, 2),
52
- isHidden = _useState6[0],
53
- setIsHidden = _useState6[1];
54
-
55
- var _useState7 = useState(false),
56
- _useState8 = _slicedToArray(_useState7, 2),
57
- hamburgerIsOpen = _useState8[0],
58
- setHamburgerIsOpen = _useState8[1];
59
-
60
- var _useState9 = useState(""),
61
- _useState10 = _slicedToArray(_useState9, 2),
62
- searchField = _useState10[0],
63
- setSearchField = _useState10[1];
64
-
65
- var _useState11 = useState(false),
66
- _useState12 = _slicedToArray(_useState11, 2),
67
- regionLanguageDeployed = _useState12[0],
68
- setRegionLanguageDeployed = _useState12[1];
69
-
70
- useEffect(function () {
71
- window.addEventListener("click", closeDropdowns);
72
- window.addEventListener("scroll", checkScroll);
73
- checkRoute(lastLocation);
74
- return function () {
75
- window.removeEventListener("click", closeDropdowns);
76
- window.removeEventListener("scroll", checkScroll);
77
- };
78
- });
79
19
 
80
- var checkRoute = function checkRoute(previousLocation) {
81
- if (location && location.pathname && previousLocation && location.pathname !== previousLocation && hamburgerIsOpen) {
82
- closeHamburger();
83
- }
84
- };
20
+ var NavBar = /*#__PURE__*/function (_Component) {
21
+ _inherits(NavBar, _Component);
85
22
 
86
- var closeHamburger = function closeHamburger() {
87
- setHamburgerIsOpen(false);
88
- setSearchField("");
89
- }; // Don't need
23
+ var _super = _createSuper(NavBar);
90
24
 
25
+ function NavBar() {
26
+ var _this;
91
27
 
92
- var closeRegionLanguageDeployed = function closeRegionLanguageDeployed() {
93
- setRegionLanguageDeployed(false);
94
- }; // Don't need
28
+ _classCallCheck(this, NavBar);
95
29
 
30
+ _this = _super.call(this);
96
31
 
97
- var toggleRegionLanguageDeployed = function toggleRegionLanguageDeployed() {
98
- setRegionLanguageDeployed(!regionLanguageDeployed);
99
- }; // Don't need
32
+ _this.checkRoute = function (prevProps) {
33
+ if (_this.props.location && _this.props.location.pathname && _this.props.location.pathname !== prevProps.location.pathname && _this.state.hamburgerIsOpen) {
34
+ _this.closeHamburger();
35
+ }
36
+ };
100
37
 
38
+ _this.closeHamburger = function () {
39
+ _this.setState({
40
+ hamburgerIsOpen: false,
41
+ searchField: ""
42
+ });
43
+ };
101
44
 
102
- var closeModal = function closeModal() {
103
- closeRegionLanguageDeployed();
104
- };
45
+ _this.closeRegionLanguageDeployed = function () {
46
+ _this.setState({
47
+ regionLanguageDeployed: false
48
+ });
49
+ };
105
50
 
106
- var handleSearchFieldChange = function handleSearchFieldChange(e) {
107
- setSearchField(e.target.value);
108
- };
51
+ _this.toggleRegionLanguageDeployed = function () {
52
+ _this.setState({
53
+ regionLanguageDeployed: !_this.state.regionLanguageDeployed
54
+ });
55
+ };
109
56
 
110
- var navSearchSubmit = function navSearchSubmit() {
111
- if (searchField) {
112
- searchSubmit(searchField);
113
- closeHamburger();
114
- }
115
- };
57
+ _this.closeModal = function () {
58
+ _this.closeRegionLanguageDeployed();
59
+ };
116
60
 
117
- var checkScroll = function checkScroll(e) {
118
- if (hamburgerIsOpen) {
119
- return;
120
- }
61
+ _this.handleSearchFieldChange = function (e) {
62
+ _this.setState({
63
+ searchField: e.target.value
64
+ });
65
+ };
121
66
 
122
- var position = window.scrollY;
67
+ _this.searchSubmit = function () {
68
+ if (_this.state.searchFieldValue) {
69
+ return;
70
+ }
123
71
 
124
- if (position > lastPosition + 100) {
125
- setIsHidden(true);
126
- setLastPosition(position);
127
- setIsOpen(null);
128
- } else if (position < lastPosition) {
129
- setIsHidden(false);
130
- setLastPosition(position);
131
- }
132
- };
72
+ _this.props.searchSubmit(_this.state.searchField);
133
73
 
134
- var closeDropdowns = function closeDropdowns() {
135
- setIsOpen(null);
136
- };
74
+ _this.closeHamburger();
75
+ };
137
76
 
138
- var deployDropDown = function deployDropDown(menu) {
139
- if (isOpen === menu) {
140
- setIsOpen(null);
141
- } else {
142
- setIsOpen(menu);
143
- }
144
- };
77
+ _this.checkScroll = function (e) {
78
+ if (_this.state.hamburgerIsOpen) {
79
+ return;
80
+ }
145
81
 
146
- var openDropDown = function openDropDown(menu) {
147
- setIsOpen(menu);
148
- };
82
+ var position = window.scrollY;
149
83
 
150
- var closeDropDown = function closeDropDown(menu) {
151
- if (isOpen === menu || !menu) {
152
- setIsOpen(null);
153
- }
154
- };
84
+ if (position > _this.state.lastPosition + 100) {
85
+ _this.setState({
86
+ isHidden: true,
87
+ lastPosition: position,
88
+ isOpen: null
89
+ });
90
+ } else if (position < _this.state.lastPosition) {
91
+ _this.setState({
92
+ isHidden: false,
93
+ lastPosition: position
94
+ });
95
+ }
96
+ };
155
97
 
156
- var stopProp = function stopProp(e) {
157
- e.stopPropagation();
158
- };
98
+ _this.closeDropdowns = function () {
99
+ _this.setState({
100
+ isOpen: null
101
+ });
102
+ };
159
103
 
160
- var generateNavOptions = function generateNavOptions() {
161
- return navOptions.map(function (option) {
162
- if (option.type === "mega menu") {
163
- return /*#__PURE__*/React.createElement(Suspense, {
164
- fallback: "Loading...",
165
- key: option.text
166
- }, /*#__PURE__*/React.createElement(MegaMenu, {
167
- key: option.text,
168
- isOpen: isOpen === option.text ? true : false,
169
- megaMenuContent: option,
170
- deployDropDown: deployDropDown,
171
- openDropDown: openDropDown,
172
- closeDropDown: closeDropDown,
173
- searchFieldValue: searchField
174
- }));
175
- } else if (option.type === "mini menu") {
176
- return /*#__PURE__*/React.createElement(NavMiniMenu, {
177
- navText: option.text,
178
- links: option.links,
179
- key: option.text,
180
- isOpen: isOpen === option.text ? true : false,
181
- deployDropDown: deployDropDown,
182
- openDropDown: openDropDown,
183
- closeDropDown: closeDropDown
104
+ _this.pushHistory = function () {};
105
+
106
+ _this.deployDropDown = function (menu) {
107
+ if (_this.state.isOpen === menu) {
108
+ _this.setState({
109
+ isOpen: null
110
+ });
111
+ } else {
112
+ _this.setState({
113
+ isOpen: menu
114
+ });
115
+ }
116
+ };
117
+
118
+ _this.openDropDown = function (menu) {
119
+ _this.setState({
120
+ isOpen: menu
121
+ });
122
+ };
123
+
124
+ _this.closeDropDown = function (menu) {
125
+ if (_this.state.isOpen === menu || !menu) {
126
+ _this.setState({
127
+ isOpen: null
184
128
  });
185
- } else if (option.type === "link") {
186
- if (option.url.substring(0, 4) === "http") {
187
- return /*#__PURE__*/React.createElement("a", {
188
- href: option.url,
129
+ }
130
+ };
131
+
132
+ _this.stopProp = function (e) {
133
+ e.stopPropagation();
134
+ };
135
+
136
+ _this.generateNavOptions = function () {
137
+ return _this.props.navOptions.map(function (option) {
138
+ if (option.type === "mega menu") {
139
+ return /*#__PURE__*/React.createElement(MegaMenu, {
189
140
  key: option.text,
190
- className: "ter-navbar__nav-link",
191
- target: option.external === false ? "_self" : "_blank",
192
- rel: option.external === false ? "" : "noopener nofollow",
193
- id: formatID("".concat(option.text, "-navbar-nav-link")),
194
- "aria-label": option.ariaLabel && option.ariaLabel
195
- }, /*#__PURE__*/React.createElement("p", null, option.text));
196
- } else {
197
- return /*#__PURE__*/React.createElement(NavLink, {
198
- to: option.url,
141
+ isOpen: _this.state.isOpen === option.text ? true : false,
142
+ megaMenuContent: option,
143
+ deployDropDown: _this.deployDropDown,
144
+ openDropDown: _this.openDropDown,
145
+ closeDropDown: _this.closeDropDown,
146
+ searchFieldValue: _this.state.searchField
147
+ });
148
+ } else if (option.type === "mini menu") {
149
+ return /*#__PURE__*/React.createElement(NavMiniMenu, {
150
+ navText: option.text,
151
+ links: option.links,
199
152
  key: option.text,
200
- className: "ter-navbar__nav-link",
201
- target: option.external === false ? "_self" : "_blank",
202
- id: formatID("".concat(option.text, "-navbar-nav-link")),
203
- "aria-label": option.ariaLabel && option.ariaLabel
204
- }, /*#__PURE__*/React.createElement("p", null, option.text));
153
+ isOpen: _this.state.isOpen === option.text ? true : false,
154
+ deployDropDown: _this.deployDropDown,
155
+ openDropDown: _this.openDropDown,
156
+ closeDropDown: _this.closeDropDown
157
+ });
158
+ } else if (option.type === "link") {
159
+ if (option.url.substring(0, 4) === "http") {
160
+ return /*#__PURE__*/React.createElement("a", {
161
+ href: option.url,
162
+ key: option.text,
163
+ className: "ter-navbar__nav-link",
164
+ target: option.external === false ? "_self" : "_blank",
165
+ rel: option.external === false ? "" : "noopener nofollow",
166
+ id: formatID("".concat(option.text, "-navbar-nav-link")),
167
+ "aria-label": option.ariaLabel && option.ariaLabel
168
+ }, /*#__PURE__*/React.createElement("p", null, option.text));
169
+ } else {
170
+ return /*#__PURE__*/React.createElement(NavLink, {
171
+ to: option.url,
172
+ key: option.text,
173
+ className: "ter-navbar__nav-link",
174
+ target: option.external === false ? "_self" : "_blank",
175
+ id: formatID("".concat(option.text, "-navbar-nav-link")),
176
+ "aria-label": option.ariaLabel && option.ariaLabel
177
+ }, /*#__PURE__*/React.createElement("p", null, option.text));
178
+ }
205
179
  }
206
- }
207
- });
208
- };
180
+ });
181
+ };
209
182
 
210
- var hamburgerClick = function hamburgerClick() {
211
- setHamburgerIsOpen(!hamburgerIsOpen);
212
- setSearchField("");
213
- };
183
+ _this.hamburgerClick = function () {
184
+ _this.setState({
185
+ hamburgerIsOpen: !_this.state.hamburgerIsOpen,
186
+ searchField: ""
187
+ });
188
+ };
189
+
190
+ _this.handleSearchFieldChange = function (e) {
191
+ _this.setState({
192
+ searchField: e.target.value
193
+ });
194
+ };
195
+
196
+ _this.closeHamburger = function () {
197
+ _this.setState({
198
+ hamburgerIsOpen: !_this.state.hamburgerIsOpen,
199
+ searchField: ""
200
+ });
201
+ };
202
+
203
+ _this.setLanguage = function (region) {
204
+ _this.setState({
205
+ regionLanguageDeployed: false
206
+ });
207
+
208
+ _this.props.setLanguage(region);
209
+ };
214
210
 
215
- var setLanguage = function setLanguage(region) {
216
- setRegionLanguageDeployed(false);
217
- setLanguage(region);
211
+ _this.state = {
212
+ isOpen: null,
213
+ lastPosition: 0,
214
+ isHidden: false,
215
+ hamburgerIsOpen: false,
216
+ searchField: "",
217
+ regionLanguageDeployed: false
218
+ };
219
+ return _this;
220
+ }
221
+
222
+ _createClass(NavBar, [{
223
+ key: "componentDidMount",
224
+ value: function componentDidMount() {
225
+ window.addEventListener("click", this.closeDropdowns);
226
+ window.addEventListener("scroll", this.checkScroll);
227
+ }
228
+ }, {
229
+ key: "componentWillUnmount",
230
+ value: function componentWillUnmount() {
231
+ window.removeEventListener("click", this.closeDropdowns);
232
+ window.removeEventListener("scroll", this.checkScroll);
233
+ }
234
+ }, {
235
+ key: "componentDidUpdate",
236
+ value: function componentDidUpdate(prevProps) {
237
+ this.checkRoute(prevProps);
238
+ }
239
+ }, {
240
+ key: "render",
241
+ value: function render() {
242
+ var _this2 = this;
243
+
244
+ return /*#__PURE__*/React.createElement(React.Fragment, null, this.props.languageSelectorData && this.props.regionLanguageDeployed && /*#__PURE__*/React.createElement("div", {
245
+ className: "ter-navbar__fullscreen-dark-backer",
246
+ onClick: function onClick(e) {
247
+ return _this2.closeModal(e);
248
+ }
249
+ }, /*#__PURE__*/React.createElement(Fade, {
250
+ delay: 400,
251
+ direction: "up",
252
+ triggerOnce: true
253
+ }, /*#__PURE__*/React.createElement(LanguageSelector, {
254
+ currentRegionLanguage: this.props.currentLanguage,
255
+ labels: this.props.languageSelectorData.labels,
256
+ regions: this.props.languageSelectorData.regions,
257
+ activeRegion: this.props.languageSelectorData.activeRegion,
258
+ companyDivision: this.props.languageSelectorData.companyDivision,
259
+ close: this.props.closeModal,
260
+ setLanguage: this.setLanguage
261
+ }))), /*#__PURE__*/React.createElement("nav", {
262
+ className: "ter-navbar ter-navbar".concat(this.state.isHidden && window.scrollY > 100 ? "--is-hidden" : "--is-showing"),
263
+ onClick: this.stopProp
264
+ }, /*#__PURE__*/React.createElement(NavBarTop, {
265
+ language: this.props.language,
266
+ divisionName: this.props.divisionName,
267
+ logo: this.props.logo,
268
+ location: this.props.currentLanguage.region,
269
+ rightLinks: this.props.rightLinks || [],
270
+ handleHamburgerClick: this.hamburgerClick,
271
+ hamburgerIsOpen: this.state.hamburgerIsOpen,
272
+ toggleDesktopSearch: this.toggleDesktopSearch,
273
+ searchField: this.state.searchField,
274
+ handleSearchFieldChange: this.handleSearchFieldChange,
275
+ placeholder: this.props.searchPlaceholder,
276
+ searchSubmit: this.searchSubmit,
277
+ toggleRegionLanguageDeployed: this.props.toggleRegionLanguageDeployed
278
+ }), /*#__PURE__*/React.createElement("div", {
279
+ className: "ter-navbar__wrapper"
280
+ }, /*#__PURE__*/React.createElement("div", {
281
+ className: "ter-navbar__menus-wrapper"
282
+ }, this.generateNavOptions())), /*#__PURE__*/React.createElement(MobileNav, {
283
+ language: this.props.language,
284
+ rightLinks: this.props.rightLinks,
285
+ isOpen: this.state.hamburgerIsOpen,
286
+ location: this.props.currentLanguage.region,
287
+ handleSearchFieldChange: this.handleSearchFieldChange,
288
+ searchFieldValue: this.state.searchField,
289
+ navOptions: this.props.navOptions,
290
+ closeHamburger: this.closeHamburger,
291
+ searchSubmit: this.searchSubmit,
292
+ toggleRegionLanguageDeployed: this.props.toggleRegionLanguageDeployed
293
+ }), this.props.utilityNav && /*#__PURE__*/React.createElement(UtilityNav, {
294
+ pageTitle: this.props.utilityNav.pageTitle,
295
+ links: this.props.utilityNav.links,
296
+ navCTA: this.props.navCTA,
297
+ pageTitleModifier: this.props.utilityNav.pageTitleModifier
298
+ })));
299
+ }
300
+ }]);
301
+
302
+ return NavBar;
303
+ }(Component);
304
+
305
+ export default NavBar;
306
+
307
+ var NavMiniMenu = function NavMiniMenu(props) {
308
+ var generateLinks = function generateLinks() {
309
+ return props.links.map(function (link, index) {
310
+ if (link.url.substring(0, 4) === "http") {
311
+ return /*#__PURE__*/React.createElement("a", {
312
+ className: "ter-link-group__link",
313
+ href: link.url,
314
+ key: link.text + " " + index,
315
+ onClick: function onClick() {
316
+ return props.closeDropDown(null);
317
+ },
318
+ target: link.external === false ? "_self" : "_blank",
319
+ rel: link.external === false ? "" : "noopener",
320
+ id: formatID("".concat(link.text, "-navbar-group-link")),
321
+ "aria-label": link.ariaLabel && link.ariaLabel
322
+ }, link.text, " ", /*#__PURE__*/React.createElement("img", {
323
+ src: skipIcon,
324
+ alt: "skip icon",
325
+ loading: "lazy"
326
+ }));
327
+ } else {
328
+ return /*#__PURE__*/React.createElement(NavLink, {
329
+ to: link.url,
330
+ className: "ter-link-group__link",
331
+ key: link.text + " " + index,
332
+ onClick: function onClick() {
333
+ return props.closeDropDown(null);
334
+ },
335
+ id: formatID("".concat(link.text, "-navbar-group-link")),
336
+ "aria-label": link.ariaLabel && link.ariaLabel
337
+ }, link.text, " ", /*#__PURE__*/React.createElement("img", {
338
+ src: skipIcon,
339
+ alt: "skip icon",
340
+ loading: "lazy"
341
+ }));
342
+ }
343
+ });
218
344
  };
219
345
 
220
- return /*#__PURE__*/React.createElement(React.Fragment, null, languageSelectorData && regionLanguageDeployed && /*#__PURE__*/React.createElement("div", {
221
- className: "ter-navbar__fullscreen-dark-backer",
222
- onClick: function onClick(e) {
223
- return closeModal(e);
346
+ return /*#__PURE__*/React.createElement("div", {
347
+ className: "ter-nav-mini-menu",
348
+ onMouseOver: function onMouseOver() {
349
+ return props.openDropDown(props.navText);
350
+ },
351
+ onMouseLeave: function onMouseLeave() {
352
+ return props.closeDropDown(props.navText);
224
353
  }
225
- }, /*#__PURE__*/React.createElement(Fade, {
226
- delay: 400,
227
- direction: "up",
228
- triggerOnce: true
229
- }, /*#__PURE__*/React.createElement(Suspense, {
230
- fallback: "Loading..."
231
- }, /*#__PURE__*/React.createElement(LanguageSelector, {
232
- currentRegionLanguage: currentLanguage,
233
- labels: languageSelectorData.labels,
234
- regions: languageSelectorData.regions,
235
- activeRegion: languageSelectorData.activeRegion,
236
- companyDivision: languageSelectorData.companyDivision,
237
- close: closeModal,
238
- setLanguage: setLanguage
239
- })))), /*#__PURE__*/React.createElement("nav", {
240
- className: "ter-navbar ter-navbar".concat(isHidden && window.scrollY > 100 ? "--is-hidden" : "--is-showing"),
241
- onClick: stopProp
242
- }, /*#__PURE__*/React.createElement(Suspense, {
243
- fallback: "Loading..."
244
- }, /*#__PURE__*/React.createElement(NavBarTop, {
245
- language: language,
246
- divisionName: divisionName,
247
- logo: logo,
248
- location: currentLanguage.region,
249
- rightLinks: rightLinks || [],
250
- handleHamburgerClick: hamburgerClick,
251
- hamburgerIsOpen: hamburgerIsOpen,
252
- toggleDesktopSearch: toggleDesktopSearch,
253
- searchField: searchField,
254
- handleSearchFieldChange: handleSearchFieldChange,
255
- placeholder: searchPlaceholder,
256
- searchSubmit: navSearchSubmit,
257
- toggleRegionLanguageDeployed: toggleRegionLanguageDeployed,
258
- disableSearch: disableSearch
259
- })), /*#__PURE__*/React.createElement("div", {
260
- className: "ter-navbar__wrapper"
261
- }, /*#__PURE__*/React.createElement("div", {
262
- className: "ter-navbar__menus-wrapper"
263
- }, generateNavOptions())), /*#__PURE__*/React.createElement(Suspense, {
264
- fallback: "Loading..."
265
- }, /*#__PURE__*/React.createElement(MobileNav, {
266
- language: language,
267
- rightLinks: rightLinks,
268
- isOpen: hamburgerIsOpen,
269
- location: currentLanguage.region,
270
- handleSearchFieldChange: handleSearchFieldChange,
271
- searchFieldValue: searchField,
272
- navOptions: navOptions,
273
- closeHamburger: closeHamburger,
274
- searchSubmit: navSearchSubmit,
275
- toggleRegionLanguageDeployed: toggleRegionLanguageDeployed
276
- })), utilityNav && /*#__PURE__*/React.createElement(UtilityNav, {
277
- pageTitle: utilityNav.pageTitle,
278
- links: utilityNav.links,
279
- navCTA: navCTA,
280
- pageTitleModifier: utilityNav.pageTitleModifier
281
- })));
354
+ }, /*#__PURE__*/React.createElement("p", {
355
+ id: formatID("".concat(props.navText, "-ter-nav-mini-menu-text")),
356
+ onClick: function onClick() {
357
+ return props.deployDropDown(props.navText);
358
+ },
359
+ className: "ter-nav-mini-menu__text ".concat(props.isOpen && " ter-nav-mini-menu__text--is-open")
360
+ }, props.navText, /*#__PURE__*/React.createElement("img", {
361
+ src: darkDownCaret,
362
+ alt: "caret icon",
363
+ loading: "lazy"
364
+ })), /*#__PURE__*/React.createElement("section", {
365
+ className: "ter-nav-mini-menu__drop-down".concat(props.isOpen ? " ter-nav-mini-menu__drop-down--is-open" : "")
366
+ }, generateLinks()));
282
367
  };
283
368
 
284
- export default NavBar;
369
+ var UtilityNav = function UtilityNav(_ref) {
370
+ var pageTitle = _ref.pageTitle,
371
+ pageTitleModifier = _ref.pageTitleModifier,
372
+ links = _ref.links,
373
+ navCTA = _ref.navCTA;
374
+ return /*#__PURE__*/React.createElement("div", {
375
+ className: "ter-utility-nav__wrapper"
376
+ }, /*#__PURE__*/React.createElement("section", {
377
+ className: "ter-utility-nav"
378
+ }, /*#__PURE__*/React.createElement("div", {
379
+ className: "ter-utility-nav__title-wrapper"
380
+ }, /*#__PURE__*/React.createElement("p", {
381
+ className: "ter-utility-nav__page-title"
382
+ }, pageTitle, " ", pageTitleModifier && /*#__PURE__*/React.createElement("span", null, pageTitleModifier))), /*#__PURE__*/React.createElement("div", {
383
+ className: "ter-utility-nav__link-container"
384
+ }, links && links.map(function (link, index) {
385
+ return /*#__PURE__*/React.createElement(Link, {
386
+ className: "ter-utility-nav__link",
387
+ to: link.url,
388
+ key: "".concat(link.text, "-").concat(index),
389
+ smooth: true,
390
+ duration: 500,
391
+ delay: 200,
392
+ offset: -48,
393
+ id: formatID("".concat(link.text, "-utility-nav-link")),
394
+ "aria-label": link.ariaLabel && link.ariaLabel
395
+ }, /*#__PURE__*/React.createElement("p", null, link.text));
396
+ })), navCTA && /*#__PURE__*/React.createElement(Button, {
397
+ url: navCTA.link.url,
398
+ text: navCTA.link.text,
399
+ className: "ter-button--secondary--3",
400
+ external: navCTA.link.external,
401
+ id: formatID("".concat(navCTA.link.text, "-utility-bar-right-link")),
402
+ "aria-label": navCTA.link.ariaLabel && navCTA.link.ariaLabel
403
+ })));
404
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "luna-one",
3
- "version": "1.0.236",
3
+ "version": "1.0.237",
4
4
  "dependencies": {
5
5
  "@vidyard/embed-code": "^4.2.22",
6
6
  "node-sass": "^4.12.0",