PluginProbe
Elementor Website Builder – more than just a page builder / 3.30.0-beta1
Elementor Website Builder – more than just a page builder v3.30.0-beta1
4.3.4 4.3.3 4.3.2 4.3.1 4.3.0 4.3.0-beta3 4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 All 457 releases
elementor / assets / js / onboarding.bb53949526c949ea5365.bundle.js

onboarding.bb53949526c949ea5365.bundle.js in Elementor Website Builder – more than just a page builder 3.30.0-beta1, at assets/js/onboarding.bb53949526c949ea5365.bundle.js

2,658 lines 127.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*! elementor - v3.30.0 - 10-06-2025 */
2 "use strict";
3 (self["webpackChunkelementor"] = self["webpackChunkelementor"] || []).push([["onboarding"],{
4
5 /***/ "../app/assets/js/ui/popover-dialog/popover-dialog.js":
6 /*!************************************************************!*\
7 !*** ../app/assets/js/ui/popover-dialog/popover-dialog.js ***!
8 \************************************************************/
9 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
10
11 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
12
13
14 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
15 Object.defineProperty(exports, "__esModule", ({
16 value: true
17 }));
18 exports["default"] = PopoverDialog;
19 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
20 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
21 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
22 function PopoverDialog(props) {
23 var targetRef = props.targetRef,
24 offsetTop = props.offsetTop,
25 offsetLeft = props.offsetLeft,
26 wrapperClass = props.wrapperClass,
27 trigger = props.trigger,
28 hideAfter = props.hideAfter,
29 popoverRef = (0, _react.useCallback)(function (popoverEl) {
30 var target = targetRef === null || targetRef === void 0 ? void 0 : targetRef.current;
31
32 // If the target or the popover element does not exist on the page anymore after a re-render, do nothing.
33 if (!target || !popoverEl) {
34 return;
35 }
36
37 /**
38 * Show Popover
39 */
40 var showPopover = function showPopover() {
41 popoverEl.style.display = 'block';
42 popoverEl.setAttribute('aria-expanded', true);
43 var targetRect = target.getBoundingClientRect(),
44 popoverRect = popoverEl.getBoundingClientRect(),
45 widthDifference = popoverRect.width - targetRect.width;
46 popoverEl.style.top = targetRect.bottom + offsetTop + 'px';
47 popoverEl.style.left = targetRect.left - widthDifference / 2 - offsetLeft + 'px';
48
49 // 16px to compensate for the arrow width.
50 popoverEl.style.setProperty('--popover-arrow-offset-end', (popoverRect.width - 16) / 2 + 'px');
51 };
52
53 /**
54 * Hide Popover
55 */
56 var hidePopover = function hidePopover() {
57 popoverEl.style.display = 'none';
58 popoverEl.setAttribute('aria-expanded', false);
59 };
60
61 /**
62 * Handle the Popover's hover functionality
63 */
64 var handlePopoverHover = function handlePopoverHover() {
65 var hideOnMouseOut = true,
66 timeOut = null;
67
68 // Show popover on hover of the target
69 target.addEventListener('mouseover', function () {
70 hideOnMouseOut = true;
71 showPopover();
72 });
73
74 // Hide popover when not overing over the target or the popover itself
75 target.addEventListener('mouseleave', function () {
76 timeOut = setTimeout(function () {
77 if (hideOnMouseOut) {
78 if ('block' === popoverEl.style.display) {
79 hidePopover();
80 }
81 }
82 }, hideAfter);
83 });
84
85 // Don't hide the popover if the user is still hovering over it.
86 popoverEl.addEventListener('mouseover', function () {
87 hideOnMouseOut = false;
88 if (timeOut) {
89 clearTimeout(timeOut);
90 timeOut = null;
91 }
92 });
93
94 // Once the user stops hovering over the popover, hide it.
95 popoverEl.addEventListener('mouseleave', function () {
96 timeOut = setTimeout(function () {
97 if (hideOnMouseOut) {
98 if ('block' === popoverEl.style.display) {
99 hidePopover();
100 }
101 }
102 }, hideAfter);
103 hideOnMouseOut = true;
104 });
105 };
106
107 /**
108 * Handle the Popover's click functionality
109 */
110 var handlePopoverClick = function handlePopoverClick() {
111 var popoverIsActive = false;
112 target.addEventListener('click', function (e) {
113 e.preventDefault();
114 e.stopPropagation();
115 if (popoverIsActive) {
116 hidePopover();
117 popoverIsActive = false;
118 } else {
119 showPopover();
120 popoverIsActive = true;
121 }
122 });
123
124 // Make sure the popover doesn't close when it is clicked on.
125 popoverEl.addEventListener('click', function (e) {
126 e.stopPropagation();
127 });
128
129 // Hide the popover when clicking outside of it.
130 document.body.addEventListener('click', function () {
131 if (popoverIsActive) {
132 hidePopover();
133 popoverIsActive = false;
134 }
135 });
136 };
137 if ('hover' === trigger) {
138 handlePopoverHover();
139 } else if ('click' === trigger) {
140 handlePopoverClick();
141 }
142 }, [targetRef]);
143 var wrapperClasses = 'e-app__popover';
144 if (wrapperClass) {
145 wrapperClasses += ' ' + wrapperClass;
146 }
147 return /*#__PURE__*/_react.default.createElement("div", {
148 className: wrapperClasses,
149 ref: popoverRef
150 }, props.children);
151 }
152 PopoverDialog.propTypes = {
153 targetRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
154 current: PropTypes.any
155 })]).isRequired,
156 trigger: PropTypes.string,
157 direction: PropTypes.string,
158 offsetTop: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
159 offsetLeft: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
160 wrapperClass: PropTypes.string,
161 children: PropTypes.any,
162 hideAfter: PropTypes.number
163 };
164 PopoverDialog.defaultProps = {
165 direction: 'bottom',
166 trigger: 'hover',
167 offsetTop: 10,
168 offsetLeft: 0,
169 hideAfter: 300
170 };
171
172 /***/ }),
173
174 /***/ "../app/modules/onboarding/assets/js/app.js":
175 /*!**************************************************!*\
176 !*** ../app/modules/onboarding/assets/js/app.js ***!
177 \**************************************************/
178 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
179
180
181
182 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
183 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
184 Object.defineProperty(exports, "__esModule", ({
185 value: true
186 }));
187 exports["default"] = App;
188 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
189 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
190 var _router2 = _interopRequireDefault(__webpack_require__(/*! @elementor/router */ "@elementor/router"));
191 var _context = __webpack_require__(/*! ./context/context */ "../app/modules/onboarding/assets/js/context/context.js");
192 var _account = _interopRequireDefault(__webpack_require__(/*! ./pages/account */ "../app/modules/onboarding/assets/js/pages/account.js"));
193 var _helloTheme = _interopRequireDefault(__webpack_require__(/*! ./pages/hello-theme */ "../app/modules/onboarding/assets/js/pages/hello-theme.js"));
194 var _siteName = _interopRequireDefault(__webpack_require__(/*! ./pages/site-name */ "../app/modules/onboarding/assets/js/pages/site-name.js"));
195 var _siteLogo = _interopRequireDefault(__webpack_require__(/*! ./pages/site-logo */ "../app/modules/onboarding/assets/js/pages/site-logo.js"));
196 var _goodToGo = _interopRequireDefault(__webpack_require__(/*! ./pages/good-to-go */ "../app/modules/onboarding/assets/js/pages/good-to-go.js"));
197 var _uploadAndInstallPro = _interopRequireDefault(__webpack_require__(/*! ./pages/upload-and-install-pro */ "../app/modules/onboarding/assets/js/pages/upload-and-install-pro.js"));
198 var _chooseFeatures = _interopRequireDefault(__webpack_require__(/*! ./pages/choose-features */ "../app/modules/onboarding/assets/js/pages/choose-features.js"));
199 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
200 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
201 function App() {
202 // Send an AJAX request to update the database option which makes sure the Onboarding process only runs once,
203 // for new Elementor sites.
204 (0, _react.useEffect)(function () {
205 // This is to prevent dark theme in onboarding app from the frontend and not backend
206 var darkThemeClassName = 'eps-theme-dark';
207 var hasDarkMode = document.body.classList.contains(darkThemeClassName);
208 if (hasDarkMode) {
209 document.body.classList.remove(darkThemeClassName);
210 }
211 if (!elementorAppConfig.onboarding.onboardingAlreadyRan) {
212 var formData = new FormData();
213 formData.append('_nonce', elementorCommon.config.ajax.nonce);
214 formData.append('action', 'elementor_update_onboarding_option');
215 fetch(elementorCommon.config.ajax.url, {
216 method: 'POST',
217 body: formData
218 });
219 }
220 elementorAppConfig.return_url = elementorAppConfig.admin_url;
221 return function () {
222 if (hasDarkMode) {
223 document.body.classList.add(darkThemeClassName);
224 }
225 };
226 }, []);
227 return /*#__PURE__*/_react.default.createElement(_context.ContextProvider, null, /*#__PURE__*/_react.default.createElement(_router.LocationProvider, {
228 history: _router2.default.appHistory
229 }, /*#__PURE__*/_react.default.createElement(_router.Router, null, /*#__PURE__*/_react.default.createElement(_account.default, {
230 default: true
231 }), /*#__PURE__*/_react.default.createElement(_helloTheme.default, {
232 path: "hello"
233 }), /*#__PURE__*/_react.default.createElement(_chooseFeatures.default, {
234 path: "chooseFeatures"
235 }), /*#__PURE__*/_react.default.createElement(_siteName.default, {
236 path: "siteName"
237 }), /*#__PURE__*/_react.default.createElement(_siteLogo.default, {
238 path: "siteLogo"
239 }), /*#__PURE__*/_react.default.createElement(_goodToGo.default, {
240 path: "goodToGo"
241 }), /*#__PURE__*/_react.default.createElement(_uploadAndInstallPro.default, {
242 path: "uploadAndInstallPro"
243 }))));
244 }
245
246 /***/ }),
247
248 /***/ "../app/modules/onboarding/assets/js/components/button.js":
249 /*!****************************************************************!*\
250 !*** ../app/modules/onboarding/assets/js/components/button.js ***!
251 \****************************************************************/
252 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
253
254 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
255
256
257 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
258 Object.defineProperty(exports, "__esModule", ({
259 value: true
260 }));
261 exports["default"] = Button;
262 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
263 function Button(props) {
264 var buttonSettings = props.buttonSettings,
265 type = props.type;
266 var buttonClasses = 'e-onboarding__button';
267 if (type) {
268 buttonClasses += " e-onboarding__button-".concat(type);
269 }
270 if (buttonSettings.className) {
271 buttonSettings.className += ' ' + buttonClasses;
272 } else {
273 buttonSettings.className = buttonClasses;
274 }
275 if (buttonSettings.href) {
276 return /*#__PURE__*/_react.default.createElement("a", buttonSettings, buttonSettings.text);
277 }
278 return /*#__PURE__*/_react.default.createElement("div", buttonSettings, buttonSettings.text);
279 }
280 Button.propTypes = {
281 buttonSettings: PropTypes.object.isRequired,
282 type: PropTypes.string
283 };
284
285 /***/ }),
286
287 /***/ "../app/modules/onboarding/assets/js/components/card.js":
288 /*!**************************************************************!*\
289 !*** ../app/modules/onboarding/assets/js/components/card.js ***!
290 \**************************************************************/
291 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
292
293 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
294
295
296 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
297 Object.defineProperty(exports, "__esModule", ({
298 value: true
299 }));
300 exports["default"] = Card;
301 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
302 function Card(_ref) {
303 var image = _ref.image,
304 imageAlt = _ref.imageAlt,
305 text = _ref.text,
306 link = _ref.link,
307 name = _ref.name,
308 clickAction = _ref.clickAction,
309 _ref$target = _ref.target,
310 target = _ref$target === void 0 ? '_self' : _ref$target;
311 var onClick = function onClick() {
312 elementorCommon.events.dispatchEvent({
313 event: 'starting canvas click',
314 version: '',
315 details: {
316 placement: elementorAppConfig.onboarding.eventPlacement,
317 selection: name
318 }
319 });
320 if (clickAction) {
321 clickAction();
322 }
323 };
324 return /*#__PURE__*/_react.default.createElement("a", {
325 target: target,
326 className: "e-onboarding__card",
327 href: link,
328 onClick: onClick
329 }, /*#__PURE__*/_react.default.createElement("img", {
330 className: "e-onboarding__card-image",
331 src: image,
332 alt: imageAlt
333 }), /*#__PURE__*/_react.default.createElement("div", {
334 className: "e-onboarding__card-text"
335 }, text));
336 }
337 Card.propTypes = {
338 image: PropTypes.string.isRequired,
339 imageAlt: PropTypes.string.isRequired,
340 text: PropTypes.string.isRequired,
341 link: PropTypes.string.isRequired,
342 name: PropTypes.string.isRequired,
343 clickAction: PropTypes.func,
344 target: PropTypes.string
345 };
346
347 /***/ }),
348
349 /***/ "../app/modules/onboarding/assets/js/components/checklist-item.js":
350 /*!************************************************************************!*\
351 !*** ../app/modules/onboarding/assets/js/components/checklist-item.js ***!
352 \************************************************************************/
353 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
354
355 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
356
357
358 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
359 Object.defineProperty(exports, "__esModule", ({
360 value: true
361 }));
362 exports["default"] = ChecklistItem;
363 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
364 function ChecklistItem(props) {
365 return /*#__PURE__*/_react.default.createElement("li", {
366 className: "e-onboarding__checklist-item"
367 }, /*#__PURE__*/_react.default.createElement("i", {
368 className: "eicon-check-circle"
369 }), props.children);
370 }
371 ChecklistItem.propTypes = {
372 children: PropTypes.string
373 };
374
375 /***/ }),
376
377 /***/ "../app/modules/onboarding/assets/js/components/checklist.js":
378 /*!*******************************************************************!*\
379 !*** ../app/modules/onboarding/assets/js/components/checklist.js ***!
380 \*******************************************************************/
381 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
382
383 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
384
385
386 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
387 Object.defineProperty(exports, "__esModule", ({
388 value: true
389 }));
390 exports["default"] = Checklist;
391 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
392 function Checklist(props) {
393 return /*#__PURE__*/_react.default.createElement("ul", {
394 className: "e-onboarding__checklist"
395 }, props.children);
396 }
397 Checklist.propTypes = {
398 children: PropTypes.any.isRequired
399 };
400
401 /***/ }),
402
403 /***/ "../app/modules/onboarding/assets/js/components/go-pro-popover.js":
404 /*!************************************************************************!*\
405 !*** ../app/modules/onboarding/assets/js/components/go-pro-popover.js ***!
406 \************************************************************************/
407 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
408
409 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
410 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
411
412
413 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
414 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
415 Object.defineProperty(exports, "__esModule", ({
416 value: true
417 }));
418 exports["default"] = GoProPopover;
419 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
420 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
421 var _popoverDialog = _interopRequireDefault(__webpack_require__(/*! elementor-app/ui/popover-dialog/popover-dialog */ "../app/assets/js/ui/popover-dialog/popover-dialog.js"));
422 var _checklist = _interopRequireDefault(__webpack_require__(/*! ./checklist */ "../app/modules/onboarding/assets/js/components/checklist.js"));
423 var _checklistItem = _interopRequireDefault(__webpack_require__(/*! ./checklist-item */ "../app/modules/onboarding/assets/js/components/checklist-item.js"));
424 var _button = _interopRequireDefault(__webpack_require__(/*! ./button */ "../app/modules/onboarding/assets/js/components/button.js"));
425 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
426 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
427 function GoProPopover(props) {
428 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
429 state = _useContext.state,
430 updateState = _useContext.updateState;
431
432 // Handle the Pro Upload popup window.
433 var alreadyHaveProButtonRef = (0, _react.useCallback)(function (alreadyHaveProButton) {
434 if (!alreadyHaveProButton) {
435 return;
436 }
437 alreadyHaveProButton.addEventListener('click', function (event) {
438 event.preventDefault();
439 elementorCommon.events.dispatchEvent({
440 event: 'already have pro',
441 version: '',
442 details: {
443 placement: elementorAppConfig.onboarding.eventPlacement,
444 step: state.currentStep
445 }
446 });
447
448 // Open the Pro Upload screen in a popup.
449 window.open(alreadyHaveProButton.href + '&mode=popup', 'elementorUploadPro', "toolbar=no, menubar=no, width=728, height=531, top=100, left=100");
450
451 // Run the callback for when the upload succeeds.
452 elementorCommon.elements.$body.on('elementor/upload-and-install-pro/success', function () {
453 updateState({
454 hasPro: true,
455 proNotice: {
456 type: 'success',
457 icon: 'eicon-check-circle-o',
458 message: __('Elementor Pro has been successfully installed.', 'elementor')
459 }
460 });
461 });
462 });
463 }, []);
464
465 // The buttonsConfig prop is an array of objects. To find the 'Upgrade Now' button, we need to iterate over the object.
466 var goProButton = props.buttonsConfig.find(function (button) {
467 return 'go-pro' === button.id;
468 }),
469 getElProButton = {
470 text: elementorAppConfig.onboarding.experiment ? __('Upgrade now', 'elementor') : __('Upgrade Now', 'elementor'),
471 className: 'e-onboarding__go-pro-cta',
472 target: '_blank',
473 href: 'https://elementor.com/pro/?utm_source=onboarding-wizard&utm_campaign=gopro&utm_medium=wp-dash&utm_content=top-bar-dropdown&utm_term=' + elementorAppConfig.onboarding.onboardingVersion,
474 tabIndex: 0,
475 onClick: function onClick() {
476 elementorCommon.events.dispatchEvent({
477 event: 'get elementor pro',
478 version: '',
479 details: {
480 placement: elementorAppConfig.onboarding.eventPlacement,
481 step: state.currentStep
482 }
483 });
484 }
485 };
486 return /*#__PURE__*/_react.default.createElement(_popoverDialog.default, {
487 targetRef: goProButton.elRef,
488 wrapperClass: "e-onboarding__go-pro"
489 }, /*#__PURE__*/_react.default.createElement("div", {
490 className: "e-onboarding__go-pro-content"
491 }, /*#__PURE__*/_react.default.createElement("h2", {
492 className: "e-onboarding__go-pro-title"
493 }, __('Ready to Get Elementor Pro?', 'elementor')), /*#__PURE__*/_react.default.createElement(_checklist.default, null, /*#__PURE__*/_react.default.createElement(_checklistItem.default, null, __('90+ Basic & Pro widgets', 'elementor')), /*#__PURE__*/_react.default.createElement(_checklistItem.default, null, __('300+ Basic & Pro templates', 'elementor')), /*#__PURE__*/_react.default.createElement(_checklistItem.default, null, __('Premium Support', 'elementor'))), /*#__PURE__*/_react.default.createElement("div", {
494 className: "e-onboarding__go-pro-paragraph"
495 }, __('And so much more!', 'elementor')), /*#__PURE__*/_react.default.createElement("div", {
496 className: "e-onboarding__go-pro-paragraph"
497 }, /*#__PURE__*/_react.default.createElement(_button.default, {
498 buttonSettings: getElProButton
499 })), /*#__PURE__*/_react.default.createElement("div", {
500 className: "e-onboarding__go-pro-paragraph"
501 }, /*#__PURE__*/_react.default.createElement("a", {
502 tabIndex: "0",
503 className: "e-onboarding__go-pro-already-have",
504 ref: alreadyHaveProButtonRef,
505 href: elementorAppConfig.onboarding.urls.uploadPro,
506 rel: "opener"
507 }, __('Already have Elementor Pro?', 'elementor')))));
508 }
509 GoProPopover.propTypes = {
510 buttonsConfig: PropTypes.array.isRequired
511 };
512
513 /***/ }),
514
515 /***/ "../app/modules/onboarding/assets/js/components/layout/footer-buttons.js":
516 /*!*******************************************************************************!*\
517 !*** ../app/modules/onboarding/assets/js/components/layout/footer-buttons.js ***!
518 \*******************************************************************************/
519 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
520
521 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
522
523
524 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
525 Object.defineProperty(exports, "__esModule", ({
526 value: true
527 }));
528 exports["default"] = FooterButtons;
529 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
530 var _grid = _interopRequireDefault(__webpack_require__(/*! elementor-app/ui/grid/grid */ "../app/assets/js/ui/grid/grid.js"));
531 var _button = _interopRequireDefault(__webpack_require__(/*! ../button */ "../app/modules/onboarding/assets/js/components/button.js"));
532 var _skipButton = _interopRequireDefault(__webpack_require__(/*! ../skip-button */ "../app/modules/onboarding/assets/js/components/skip-button.js"));
533 function FooterButtons(_ref) {
534 var actionButton = _ref.actionButton,
535 skipButton = _ref.skipButton,
536 className = _ref.className;
537 var classNames = 'e-onboarding__footer';
538 if (className) {
539 classNames += ' ' + className;
540 }
541 return /*#__PURE__*/_react.default.createElement(_grid.default, {
542 container: true,
543 alignItems: "center",
544 justify: "space-between",
545 className: classNames
546 }, actionButton && /*#__PURE__*/_react.default.createElement(_button.default, {
547 buttonSettings: actionButton,
548 type: "action"
549 }), skipButton && /*#__PURE__*/_react.default.createElement(_skipButton.default, {
550 button: skipButton
551 }));
552 }
553 FooterButtons.propTypes = {
554 actionButton: PropTypes.object,
555 skipButton: PropTypes.object,
556 className: PropTypes.string
557 };
558
559 /***/ }),
560
561 /***/ "../app/modules/onboarding/assets/js/components/layout/header.js":
562 /*!***********************************************************************!*\
563 !*** ../app/modules/onboarding/assets/js/components/layout/header.js ***!
564 \***********************************************************************/
565 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
566
567 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
568 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
569
570
571 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
572 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
573 Object.defineProperty(exports, "__esModule", ({
574 value: true
575 }));
576 exports["default"] = Header;
577 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
578 var _context = __webpack_require__(/*! ../../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
579 var _grid = _interopRequireDefault(__webpack_require__(/*! elementor-app/ui/grid/grid */ "../app/assets/js/ui/grid/grid.js"));
580 var _goProPopover = _interopRequireDefault(__webpack_require__(/*! ../go-pro-popover */ "../app/modules/onboarding/assets/js/components/go-pro-popover.js"));
581 var _headerButtons = _interopRequireDefault(__webpack_require__(/*! elementor-app/layout/header-buttons */ "../app/assets/js/layout/header-buttons.js"));
582 var _usePageTitle = _interopRequireDefault(__webpack_require__(/*! elementor-app/hooks/use-page-title */ "../app/assets/js/hooks/use-page-title.js"));
583 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
584 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
585 function Header(props) {
586 (0, _usePageTitle.default)({
587 title: props.title
588 });
589 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
590 state = _useContext.state;
591 var onClose = function onClose() {
592 elementorCommon.events.dispatchEvent({
593 event: 'close modal',
594 version: '',
595 details: {
596 placement: elementorAppConfig.onboarding.eventPlacement,
597 step: state.currentStep
598 }
599 });
600 window.top.location = elementorAppConfig.admin_url;
601 };
602 return /*#__PURE__*/_react.default.createElement(_grid.default, {
603 container: true,
604 alignItems: "center",
605 justify: "space-between",
606 className: "eps-app__header e-onboarding__header"
607 }, /*#__PURE__*/_react.default.createElement("div", {
608 className: "eps-app__logo-title-wrapper e-onboarding__header-logo"
609 }, /*#__PURE__*/_react.default.createElement("i", {
610 className: "eps-app__logo eicon-elementor"
611 }), /*#__PURE__*/_react.default.createElement("img", {
612 src: elementorCommon.config.urls.assets + 'images/logo-platform.svg',
613 alt: __('Elementor Logo', 'elementor')
614 })), /*#__PURE__*/_react.default.createElement(_headerButtons.default, {
615 buttons: props.buttons,
616 onClose: onClose
617 }), !state.hasPro && /*#__PURE__*/_react.default.createElement(_goProPopover.default, {
618 buttonsConfig: props.buttons
619 }));
620 }
621 Header.propTypes = {
622 title: PropTypes.string,
623 buttons: PropTypes.arrayOf(PropTypes.object)
624 };
625 Header.defaultProps = {
626 buttons: []
627 };
628
629 /***/ }),
630
631 /***/ "../app/modules/onboarding/assets/js/components/layout/layout.js":
632 /*!***********************************************************************!*\
633 !*** ../app/modules/onboarding/assets/js/components/layout/layout.js ***!
634 \***********************************************************************/
635 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
636
637 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
638 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
639
640
641 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
642 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
643 Object.defineProperty(exports, "__esModule", ({
644 value: true
645 }));
646 exports["default"] = Layout;
647 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
648 var _context = __webpack_require__(/*! ../../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
649 var _header = _interopRequireDefault(__webpack_require__(/*! ./header */ "../app/modules/onboarding/assets/js/components/layout/header.js"));
650 var _progressBar = _interopRequireDefault(__webpack_require__(/*! ../progress-bar/progress-bar */ "../app/modules/onboarding/assets/js/components/progress-bar/progress-bar.js"));
651 var _content = _interopRequireDefault(__webpack_require__(/*! ../../../../../../assets/js/layout/content */ "../app/assets/js/layout/content.js"));
652 var _connect = _interopRequireDefault(__webpack_require__(/*! ../../utils/connect */ "../app/modules/onboarding/assets/js/utils/connect.js"));
653 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
654 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
655 function Layout(props) {
656 (0, _react.useEffect)(function () {
657 // Send modal load event for current step.
658 elementorCommon.events.dispatchEvent({
659 event: 'modal load',
660 version: '',
661 details: {
662 placement: elementorAppConfig.onboarding.eventPlacement,
663 step: props.pageId,
664 user_state: elementorCommon.config.library_connect.is_connected ? 'logged' : 'anon'
665 }
666 });
667 updateState({
668 currentStep: props.pageId,
669 nextStep: props.nextStep || '',
670 proNotice: null
671 });
672 }, [props.pageId]);
673 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
674 state = _useContext.state,
675 updateState = _useContext.updateState,
676 headerButtons = [],
677 goProButtonRef = (0, _react.useRef)(),
678 createAccountButton = {
679 id: 'create-account',
680 text: __('Create Account', 'elementor'),
681 hideText: false,
682 elRef: (0, _react.useRef)(),
683 url: elementorAppConfig.onboarding.urls.signUp + elementorAppConfig.onboarding.utms.connectTopBar,
684 target: '_blank',
685 rel: 'opener',
686 onClick: function onClick() {
687 elementorCommon.events.dispatchEvent({
688 event: 'create account',
689 version: '',
690 details: {
691 placement: elementorAppConfig.onboarding.eventPlacement,
692 step: state.currentStep,
693 source: 'header'
694 }
695 });
696 }
697 };
698 if (state.isLibraryConnected) {
699 headerButtons.push({
700 id: 'my-elementor',
701 text: __('My Elementor', 'elementor'),
702 hideText: false,
703 icon: 'eicon-user-circle-o',
704 url: 'https://my.elementor.com/websites/?utm_source=onboarding-wizard&utm_medium=wp-dash&utm_campaign=my-account&utm_content=top-bar&utm_term=' + elementorAppConfig.onboarding.onboardingVersion,
705 target: '_blank',
706 onClick: function onClick() {
707 elementorCommon.events.dispatchEvent({
708 event: 'my elementor click',
709 version: '',
710 details: {
711 placement: elementorAppConfig.onboarding.eventPlacement,
712 step: state.currentStep,
713 source: 'header'
714 }
715 });
716 }
717 });
718 } else {
719 headerButtons.push(createAccountButton);
720 }
721 if (!state.hasPro) {
722 headerButtons.push({
723 id: 'go-pro',
724 text: __('Upgrade', 'elementor'),
725 hideText: false,
726 className: 'eps-button__go-pro-btn',
727 url: 'https://elementor.com/pro/?utm_source=onboarding-wizard&utm_campaign=gopro&utm_medium=wp-dash&utm_content=top-bar&utm_term=' + elementorAppConfig.onboarding.onboardingVersion,
728 target: '_blank',
729 elRef: goProButtonRef,
730 onClick: function onClick() {
731 elementorCommon.events.dispatchEvent({
732 event: 'go pro',
733 version: '',
734 details: {
735 placement: elementorAppConfig.onboarding.eventPlacement,
736 step: state.currentStep
737 }
738 });
739 }
740 });
741 }
742 return /*#__PURE__*/_react.default.createElement("div", {
743 className: "eps-app__lightbox"
744 }, /*#__PURE__*/_react.default.createElement("div", {
745 className: "eps-app e-onboarding"
746 }, !state.isLibraryConnected && /*#__PURE__*/_react.default.createElement(_connect.default, {
747 buttonRef: createAccountButton.elRef
748 }), /*#__PURE__*/_react.default.createElement(_header.default, {
749 title: __('Getting Started', 'elementor'),
750 buttons: headerButtons
751 }), /*#__PURE__*/_react.default.createElement("div", {
752 className: 'eps-app__main e-onboarding__page-' + props.pageId
753 }, /*#__PURE__*/_react.default.createElement(_content.default, {
754 className: "e-onboarding__content"
755 }, /*#__PURE__*/_react.default.createElement(_progressBar.default, null), props.children))));
756 }
757 Layout.propTypes = {
758 pageId: PropTypes.string.isRequired,
759 nextStep: PropTypes.string,
760 className: PropTypes.string,
761 children: PropTypes.any.isRequired
762 };
763
764 /***/ }),
765
766 /***/ "../app/modules/onboarding/assets/js/components/layout/page-content-layout.js":
767 /*!************************************************************************************!*\
768 !*** ../app/modules/onboarding/assets/js/components/layout/page-content-layout.js ***!
769 \************************************************************************************/
770 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
771
772 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
773
774
775 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
776 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
777 Object.defineProperty(exports, "__esModule", ({
778 value: true
779 }));
780 exports["default"] = PageContentLayout;
781 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
782 var _context = __webpack_require__(/*! ../../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
783 var _grid = _interopRequireDefault(__webpack_require__(/*! elementor-app/ui/grid/grid */ "../app/assets/js/ui/grid/grid.js"));
784 var _notice = _interopRequireDefault(__webpack_require__(/*! ../notice */ "../app/modules/onboarding/assets/js/components/notice.js"));
785 var _footerButtons = _interopRequireDefault(__webpack_require__(/*! ./footer-buttons */ "../app/modules/onboarding/assets/js/components/layout/footer-buttons.js"));
786 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
787 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
788 function PageContentLayout(props) {
789 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
790 state = _useContext.state;
791 var printNotices = function printNotices() {
792 return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, props.noticeState && /*#__PURE__*/_react.default.createElement(_notice.default, {
793 noticeState: props.noticeState
794 }), state.proNotice && /*#__PURE__*/_react.default.createElement(_notice.default, {
795 noticeState: state.proNotice
796 }));
797 };
798 return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_grid.default, {
799 container: true,
800 alignItems: "center",
801 justify: "space-between",
802 className: "e-onboarding__page-content"
803 }, /*#__PURE__*/_react.default.createElement("div", {
804 className: "e-onboarding__page-content-start"
805 }, /*#__PURE__*/_react.default.createElement("h1", {
806 className: "e-onboarding__page-content-section-title"
807 }, props.title, props.secondLineTitle && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("br", null), props.secondLineTitle)), /*#__PURE__*/_react.default.createElement("div", {
808 className: "e-onboarding__page-content-section-text"
809 }, props.children)), /*#__PURE__*/_react.default.createElement("div", {
810 className: "e-onboarding__page-content-end"
811 }, /*#__PURE__*/_react.default.createElement("img", {
812 src: props.image,
813 alt: "Information"
814 }))), props.noticeState && /*#__PURE__*/_react.default.createElement("div", {
815 className: "e-onboarding__notice-container"
816 }, props.noticeState || state.proNotice ? printNotices() : /*#__PURE__*/_react.default.createElement("div", {
817 className: "e-onboarding__notice-empty-spacer"
818 })), /*#__PURE__*/_react.default.createElement(_footerButtons.default, {
819 actionButton: props.actionButton,
820 skipButton: props.skipButton
821 }));
822 }
823 PageContentLayout.propTypes = {
824 title: PropTypes.string,
825 secondLineTitle: PropTypes.string,
826 children: PropTypes.any,
827 image: PropTypes.string,
828 actionButton: PropTypes.object,
829 skipButton: PropTypes.object,
830 noticeState: PropTypes.any
831 };
832
833 /***/ }),
834
835 /***/ "../app/modules/onboarding/assets/js/components/message.js":
836 /*!*****************************************************************!*\
837 !*** ../app/modules/onboarding/assets/js/components/message.js ***!
838 \*****************************************************************/
839 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
840
841 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
842 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
843
844
845 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
846 Object.defineProperty(exports, "__esModule", ({
847 value: true
848 }));
849 exports["default"] = Message;
850 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
851 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
852 function Message(_ref) {
853 var tier = _ref.tier;
854 /* Translators: %s: Plan name */
855 var translatedString = __('Based on the features you chose, we recommend the %s plan, or higher', 'elementor');
856 var _translatedString$spl = translatedString.split('%s'),
857 _translatedString$spl2 = (0, _slicedToArray2.default)(_translatedString$spl, 2),
858 messageFirstPart = _translatedString$spl2[0],
859 messageSecondPart = _translatedString$spl2[1];
860 return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, messageFirstPart, /*#__PURE__*/_react.default.createElement("strong", null, tier), messageSecondPart);
861 }
862 Message.propTypes = {
863 tier: PropTypes.string.isRequired
864 };
865
866 /***/ }),
867
868 /***/ "../app/modules/onboarding/assets/js/components/notice.js":
869 /*!****************************************************************!*\
870 !*** ../app/modules/onboarding/assets/js/components/notice.js ***!
871 \****************************************************************/
872 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
873
874 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
875
876
877 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
878 Object.defineProperty(exports, "__esModule", ({
879 value: true
880 }));
881 exports["default"] = Notice;
882 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
883 function Notice(props) {
884 return /*#__PURE__*/_react.default.createElement("div", {
885 className: "e-onboarding__notice e-onboarding__notice--".concat(props.noticeState.type)
886 }, /*#__PURE__*/_react.default.createElement("i", {
887 className: props.noticeState.icon
888 }), /*#__PURE__*/_react.default.createElement("span", {
889 className: "e-onboarding__notice-text"
890 }, props.noticeState.message));
891 }
892 Notice.propTypes = {
893 noticeState: PropTypes.object
894 };
895
896 /***/ }),
897
898 /***/ "../app/modules/onboarding/assets/js/components/progress-bar/progress-bar-item.js":
899 /*!****************************************************************************************!*\
900 !*** ../app/modules/onboarding/assets/js/components/progress-bar/progress-bar-item.js ***!
901 \****************************************************************************************/
902 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
903
904 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
905
906
907 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
908 Object.defineProperty(exports, "__esModule", ({
909 value: true
910 }));
911 exports["default"] = ProgressBarItem;
912 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
913 var _context = __webpack_require__(/*! ../../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
914 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
915 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
916 function ProgressBarItem(props) {
917 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
918 state = _useContext.state,
919 stepCompleted = 'completed' === state.steps[props.id],
920 stepSkipped = 'skipped' === state.steps[props.id];
921 var itemClasses = 'e-onboarding__progress-bar-item';
922 if (props.id === state.currentStep) {
923 itemClasses += ' e-onboarding__progress-bar-item--active';
924 } else if (stepCompleted) {
925 itemClasses += ' e-onboarding__progress-bar-item--completed';
926 } else if (stepSkipped) {
927 itemClasses += ' e-onboarding__progress-bar-item--skipped';
928 }
929 return (
930 /*#__PURE__*/
931 // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
932 _react.default.createElement("div", {
933 onClick: props.onClick,
934 className: itemClasses
935 }, /*#__PURE__*/_react.default.createElement("div", {
936 className: "e-onboarding__progress-bar-item-icon"
937 }, stepCompleted ? /*#__PURE__*/_react.default.createElement("i", {
938 className: "eicon-check"
939 }) : props.index + 1), props.title)
940 );
941 }
942 ProgressBarItem.propTypes = {
943 index: PropTypes.number.isRequired,
944 id: PropTypes.string.isRequired,
945 title: PropTypes.string.isRequired,
946 route: PropTypes.string,
947 onClick: PropTypes.func
948 };
949
950 /***/ }),
951
952 /***/ "../app/modules/onboarding/assets/js/components/progress-bar/progress-bar.js":
953 /*!***********************************************************************************!*\
954 !*** ../app/modules/onboarding/assets/js/components/progress-bar/progress-bar.js ***!
955 \***********************************************************************************/
956 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
957
958 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
959
960
961 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
962 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
963 Object.defineProperty(exports, "__esModule", ({
964 value: true
965 }));
966 exports["default"] = ProgressBar;
967 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
968 var _extends2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/extends */ "../node_modules/@babel/runtime/helpers/extends.js"));
969 var _context = __webpack_require__(/*! ../../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
970 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
971 var _progressBarItem = _interopRequireDefault(__webpack_require__(/*! ./progress-bar-item */ "../app/modules/onboarding/assets/js/components/progress-bar/progress-bar-item.js"));
972 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
973 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
974 function ProgressBar() {
975 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
976 state = _useContext.state,
977 navigate = (0, _router.useNavigate)(),
978 progressBarItemsConfig = [{
979 id: 'account',
980 title: __('Elementor Account', 'elementor'),
981 route: 'account'
982 }];
983
984 // If hello theme is already activated when onboarding starts, don't show this step in the onboarding.
985 if (!elementorAppConfig.onboarding.helloActivated) {
986 progressBarItemsConfig.push({
987 id: 'hello',
988 title: __('Hello Biz Theme', 'elementor'),
989 route: 'hello'
990 });
991 }
992 if (elementorAppConfig.onboarding.experiment) {
993 progressBarItemsConfig.push({
994 id: 'chooseFeatures',
995 title: __('Choose Features', 'elementor'),
996 route: 'chooseFeatures'
997 });
998 } else {
999 progressBarItemsConfig.push({
1000 id: 'siteName',
1001 title: __('Site Name', 'elementor'),
1002 route: 'site-name'
1003 }, {
1004 id: 'siteLogo',
1005 title: __('Site Logo', 'elementor'),
1006 route: 'site-logo'
1007 });
1008 }
1009 progressBarItemsConfig.push({
1010 id: 'goodToGo',
1011 title: __('Good to Go', 'elementor'),
1012 route: 'good-to-go'
1013 });
1014 var progressBarItems = progressBarItemsConfig.map(function (itemConfig, index) {
1015 itemConfig.index = index;
1016 if (state.steps[itemConfig.id]) {
1017 itemConfig.onClick = function () {
1018 elementorCommon.events.dispatchEvent({
1019 event: 'step click',
1020 version: '',
1021 details: {
1022 placement: elementorAppConfig.onboarding.eventPlacement,
1023 step: state.currentStep,
1024 next_step: itemConfig.id
1025 }
1026 });
1027 navigate('/onboarding/' + itemConfig.id);
1028 };
1029 }
1030 return /*#__PURE__*/_react.default.createElement(_progressBarItem.default, (0, _extends2.default)({
1031 key: itemConfig.id
1032 }, itemConfig));
1033 });
1034 return /*#__PURE__*/_react.default.createElement("div", {
1035 className: "e-onboarding__progress-bar"
1036 }, progressBarItems);
1037 }
1038
1039 /***/ }),
1040
1041 /***/ "../app/modules/onboarding/assets/js/components/skip-button.js":
1042 /*!*********************************************************************!*\
1043 !*** ../app/modules/onboarding/assets/js/components/skip-button.js ***!
1044 \*********************************************************************/
1045 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1046
1047 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
1048
1049
1050 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1051 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
1052 Object.defineProperty(exports, "__esModule", ({
1053 value: true
1054 }));
1055 exports["default"] = SkipButton;
1056 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
1057 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
1058 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
1059 var _button = _interopRequireDefault(__webpack_require__(/*! ./button */ "../app/modules/onboarding/assets/js/components/button.js"));
1060 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
1061 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
1062 function SkipButton(props) {
1063 var button = props.button,
1064 className = props.className,
1065 _useContext = (0, _react.useContext)(_context.OnboardingContext),
1066 state = _useContext.state,
1067 updateState = _useContext.updateState,
1068 navigate = (0, _router.useNavigate)(),
1069 skipStep = function skipStep() {
1070 var mutatedState = JSON.parse(JSON.stringify(state));
1071 mutatedState.steps[state.currentStep] = 'skipped';
1072 updateState(mutatedState);
1073 if (state.nextStep) {
1074 navigate('onboarding/' + state.nextStep);
1075 }
1076 },
1077 action = button.action || skipStep;
1078
1079 // Make sure the 'action' prop doesn't get printed on the button markup which causes an error.
1080 delete button.action;
1081
1082 // If the button is a link, no onClick functionality should be added.
1083 button.onClick = function () {
1084 elementorCommon.events.dispatchEvent({
1085 event: 'skip',
1086 version: '',
1087 details: {
1088 placement: elementorAppConfig.onboarding.eventPlacement,
1089 step: state.currentStep
1090 }
1091 });
1092 if (!button.href) {
1093 action();
1094 }
1095 };
1096 return /*#__PURE__*/_react.default.createElement(_button.default, {
1097 buttonSettings: button,
1098 className: className,
1099 type: "skip"
1100 });
1101 }
1102 SkipButton.propTypes = {
1103 button: PropTypes.object.isRequired,
1104 className: PropTypes.string
1105 };
1106
1107 /***/ }),
1108
1109 /***/ "../app/modules/onboarding/assets/js/context/context.js":
1110 /*!**************************************************************!*\
1111 !*** ../app/modules/onboarding/assets/js/context/context.js ***!
1112 \**************************************************************/
1113 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1114
1115 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
1116
1117
1118 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1119 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
1120 Object.defineProperty(exports, "__esModule", ({
1121 value: true
1122 }));
1123 exports.ContextProvider = ContextProvider;
1124 exports.OnboardingContext = void 0;
1125 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
1126 var _defineProperty2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ "../node_modules/@babel/runtime/helpers/defineProperty.js"));
1127 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
1128 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
1129 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
1130 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
1131 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1132 var OnboardingContext = exports.OnboardingContext = (0, _react.createContext)({});
1133 function ContextProvider(props) {
1134 var onboardingConfig = elementorAppConfig.onboarding,
1135 initialState = {
1136 // eslint-disable-next-line camelcase
1137 hasPro: elementorAppConfig.hasPro,
1138 isLibraryConnected: onboardingConfig.isLibraryConnected,
1139 isHelloThemeInstalled: onboardingConfig.helloInstalled,
1140 isHelloThemeActivated: onboardingConfig.helloActivated,
1141 siteName: onboardingConfig.siteName,
1142 siteLogo: onboardingConfig.siteLogo,
1143 proNotice: '',
1144 currentStep: '',
1145 nextStep: '',
1146 steps: {
1147 account: false,
1148 hello: false,
1149 chooseFeatures: false,
1150 siteName: false,
1151 siteLogo: false,
1152 goodToGo: false
1153 }
1154 },
1155 _useState = (0, _react.useState)(initialState),
1156 _useState2 = (0, _slicedToArray2.default)(_useState, 2),
1157 state = _useState2[0],
1158 setState = _useState2[1],
1159 updateState = (0, _react.useCallback)(function (newState) {
1160 setState(function (prev) {
1161 return _objectSpread(_objectSpread({}, prev), newState);
1162 });
1163 }, [setState]),
1164 getStateObjectToUpdate = function getStateObjectToUpdate(stateObject, mainChangedPropertyKey, subChangedPropertyKey, subChangedPropertyValue) {
1165 var mutatedStateCopy = JSON.parse(JSON.stringify(stateObject));
1166 mutatedStateCopy[mainChangedPropertyKey][subChangedPropertyKey] = subChangedPropertyValue;
1167 return mutatedStateCopy;
1168 };
1169 return /*#__PURE__*/_react.default.createElement(OnboardingContext.Provider, {
1170 value: {
1171 state: state,
1172 setState: setState,
1173 updateState: updateState,
1174 getStateObjectToUpdate: getStateObjectToUpdate
1175 }
1176 }, props.children);
1177 }
1178 ContextProvider.propTypes = {
1179 children: PropTypes.any
1180 };
1181
1182 /***/ }),
1183
1184 /***/ "../app/modules/onboarding/assets/js/pages/account.js":
1185 /*!************************************************************!*\
1186 !*** ../app/modules/onboarding/assets/js/pages/account.js ***!
1187 \************************************************************/
1188 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1189
1190 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
1191
1192
1193 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1194 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
1195 Object.defineProperty(exports, "__esModule", ({
1196 value: true
1197 }));
1198 exports["default"] = Account;
1199 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
1200 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
1201 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
1202 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
1203 var _connect = _interopRequireDefault(__webpack_require__(/*! ../utils/connect */ "../app/modules/onboarding/assets/js/utils/connect.js"));
1204 var _layout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/layout */ "../app/modules/onboarding/assets/js/components/layout/layout.js"));
1205 var _pageContentLayout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/page-content-layout */ "../app/modules/onboarding/assets/js/components/layout/page-content-layout.js"));
1206 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
1207 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
1208 function Account() {
1209 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
1210 state = _useContext.state,
1211 updateState = _useContext.updateState,
1212 getStateObjectToUpdate = _useContext.getStateObjectToUpdate,
1213 _useState = (0, _react.useState)(null),
1214 _useState2 = (0, _slicedToArray2.default)(_useState, 2),
1215 noticeState = _useState2[0],
1216 setNoticeState = _useState2[1],
1217 nextStep = getNextStep(),
1218 navigate = (0, _router.useNavigate)(),
1219 pageId = 'account',
1220 actionButtonRef = (0, _react.useRef)(),
1221 alreadyHaveAccountLinkRef = (0, _react.useRef)();
1222 var skipButton;
1223 if ('completed' !== state.steps[pageId]) {
1224 skipButton = {
1225 text: __('Skip', 'elementor')
1226 };
1227 }
1228 var pageTexts = {};
1229 if (state.isLibraryConnected) {
1230 pageTexts = {
1231 firstLine: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, __('To get the most out of Elementor, we\'ll help you take your', 'elementor'), " ", /*#__PURE__*/_react.default.createElement("br", null), " ", __('first steps:', 'elementor')),
1232 listItems: elementorAppConfig.onboarding.experiment ? [__('Set your site\'s theme', 'elementor'), __('Choose additional features', 'elementor'), __('Choose how to start creating', 'elementor')] : [__('Set your site\'s theme', 'elementor'), __('Give your site a name & logo', 'elementor'), __('Choose how to start creating', 'elementor')]
1233 };
1234 } else {
1235 pageTexts = elementorAppConfig.onboarding.experiment ? {
1236 firstLine: __('Once you connect your Elementor account, you can choose from dozens of professional templates and manage your site with the My Elementor dashboard.', 'elementor'),
1237 listItems: []
1238 } : {
1239 firstLine: __('To get the most out of Elementor, we’ll connect your account.', 'elementor') + ' ' + __('Then you can:', 'elementor'),
1240 listItems: [__('Choose from countless professional templates', 'elementor'), __('Manage your site with our handy dashboard', 'elementor'), __('Take part in the community forum, share & grow together', 'elementor')]
1241 };
1242 }
1243
1244 // If the user is not connected, the on-click action is handled by the <Connect> component, so there is no onclick
1245 // property.
1246 var actionButton = {
1247 role: 'button'
1248 };
1249 if (state.isLibraryConnected) {
1250 actionButton.text = __('Let’s do it', 'elementor');
1251 actionButton.onClick = function () {
1252 elementorCommon.events.dispatchEvent({
1253 event: 'next',
1254 version: '',
1255 details: {
1256 placement: elementorAppConfig.onboarding.eventPlacement,
1257 step: state.currentStep
1258 }
1259 });
1260 updateState(getStateObjectToUpdate(state, 'steps', pageId, 'completed'));
1261 navigate('onboarding/' + nextStep);
1262 };
1263 } else {
1264 actionButton.text = __('Create my account', 'elementor');
1265 actionButton.href = elementorAppConfig.onboarding.urls.signUp + elementorAppConfig.onboarding.utms.connectCta;
1266 actionButton.ref = actionButtonRef;
1267 actionButton.onClick = function () {
1268 elementorCommon.events.dispatchEvent({
1269 event: 'create account',
1270 version: '',
1271 details: {
1272 placement: elementorAppConfig.onboarding.eventPlacement,
1273 source: 'cta'
1274 }
1275 });
1276 };
1277 }
1278 var connectSuccessCallback = function connectSuccessCallback(data) {
1279 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'completed');
1280 stateToUpdate.isLibraryConnected = true;
1281 elementorCommon.config.library_connect.is_connected = true;
1282 elementorCommon.config.library_connect.current_access_level = data.kits_access_level || data.access_level || 0;
1283 elementorCommon.config.library_connect.current_access_tier = data.access_tier;
1284 updateState(stateToUpdate);
1285 elementorCommon.events.dispatchEvent({
1286 event: 'indication prompt',
1287 version: '',
1288 details: {
1289 placement: elementorAppConfig.onboarding.eventPlacement,
1290 step: state.currentStep,
1291 action_state: 'success',
1292 action: 'connect account'
1293 }
1294 });
1295 setNoticeState({
1296 type: 'success',
1297 icon: 'eicon-check-circle-o',
1298 message: 'Alrighty - your account is connected.'
1299 });
1300 navigate('onboarding/' + nextStep);
1301 };
1302 function getNextStep() {
1303 if (!state.isHelloThemeActivated) {
1304 return 'hello';
1305 }
1306 return elementorAppConfig.onboarding.experiment ? 'chooseFeatures' : 'siteName';
1307 }
1308 var connectFailureCallback = function connectFailureCallback() {
1309 elementorCommon.events.dispatchEvent({
1310 event: 'indication prompt',
1311 version: '',
1312 details: {
1313 placement: elementorAppConfig.onboarding.eventPlacement,
1314 step: state.currentStep,
1315 action_state: 'failure',
1316 action: 'connect account'
1317 }
1318 });
1319 setNoticeState({
1320 type: 'error',
1321 icon: 'eicon-warning',
1322 message: __('Oops, the connection failed. Try again.', 'elementor')
1323 });
1324 navigate('onboarding/' + nextStep);
1325 };
1326 return /*#__PURE__*/_react.default.createElement(_layout.default, {
1327 pageId: pageId,
1328 nextStep: nextStep
1329 }, /*#__PURE__*/_react.default.createElement(_pageContentLayout.default, {
1330 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Illustration_Account.svg',
1331 title: elementorAppConfig.onboarding.experiment ? __('You\'re here!', 'elementor') : __('You\'re here! Let\'s set things up.', 'elementor'),
1332 secondLineTitle: elementorAppConfig.onboarding.experiment ? __(' Let\'s get connected.', 'elementor') : '',
1333 actionButton: actionButton,
1334 skipButton: skipButton,
1335 noticeState: noticeState
1336 }, actionButton.ref && !state.isLibraryConnected && /*#__PURE__*/_react.default.createElement(_connect.default, {
1337 buttonRef: actionButton.ref,
1338 successCallback: function successCallback(data) {
1339 return connectSuccessCallback(data);
1340 },
1341 errorCallback: connectFailureCallback
1342 }), /*#__PURE__*/_react.default.createElement("span", null, pageTexts.firstLine), /*#__PURE__*/_react.default.createElement("ul", null, pageTexts.listItems.map(function (listItem, index) {
1343 return /*#__PURE__*/_react.default.createElement("li", {
1344 key: 'listItem' + index
1345 }, listItem);
1346 }))), !state.isLibraryConnected && /*#__PURE__*/_react.default.createElement("div", {
1347 className: "e-onboarding__footnote"
1348 }, /*#__PURE__*/_react.default.createElement("p", null, __('Already have one?', 'elementor') + ' ', /*#__PURE__*/_react.default.createElement("a", {
1349 ref: alreadyHaveAccountLinkRef,
1350 href: elementorAppConfig.onboarding.urls.connect + elementorAppConfig.onboarding.utms.connectCtaLink,
1351 onClick: function onClick() {
1352 elementorCommon.events.dispatchEvent({
1353 event: 'connect account',
1354 version: '',
1355 details: {
1356 placement: elementorAppConfig.onboarding.eventPlacement
1357 }
1358 });
1359 }
1360 }, __('Connect your account', 'elementor'))), /*#__PURE__*/_react.default.createElement(_connect.default, {
1361 buttonRef: alreadyHaveAccountLinkRef,
1362 successCallback: connectSuccessCallback,
1363 errorCallback: connectFailureCallback
1364 })));
1365 }
1366
1367 /***/ }),
1368
1369 /***/ "../app/modules/onboarding/assets/js/pages/choose-features.js":
1370 /*!********************************************************************!*\
1371 !*** ../app/modules/onboarding/assets/js/pages/choose-features.js ***!
1372 \********************************************************************/
1373 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1374
1375 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
1376
1377
1378 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1379 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
1380 Object.defineProperty(exports, "__esModule", ({
1381 value: true
1382 }));
1383 exports["default"] = ChooseFeatures;
1384 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
1385 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
1386 var _useAjax2 = _interopRequireDefault(__webpack_require__(/*! elementor-app/hooks/use-ajax */ "../app/assets/js/hooks/use-ajax.js"));
1387 var _message = _interopRequireDefault(__webpack_require__(/*! ../components/message */ "../app/modules/onboarding/assets/js/components/message.js"));
1388 var _utils = __webpack_require__(/*! ../utils/utils */ "../app/modules/onboarding/assets/js/utils/utils.js");
1389 var _layout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/layout */ "../app/modules/onboarding/assets/js/components/layout/layout.js"));
1390 var _pageContentLayout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/page-content-layout */ "../app/modules/onboarding/assets/js/components/layout/page-content-layout.js"));
1391 var _useButtonAction2 = _interopRequireDefault(__webpack_require__(/*! ../utils/use-button-action */ "../app/modules/onboarding/assets/js/utils/use-button-action.js"));
1392 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
1393 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
1394 function ChooseFeatures() {
1395 var _useAjax = (0, _useAjax2.default)(),
1396 setAjax = _useAjax.setAjax,
1397 tiers = {
1398 advanced: __('Advanced', 'elementor'),
1399 essential: __('Essential', 'elementor')
1400 },
1401 _useState = (0, _react.useState)({
1402 essential: [],
1403 advanced: []
1404 }),
1405 _useState2 = (0, _slicedToArray2.default)(_useState, 2),
1406 selectedFeatures = _useState2[0],
1407 setSelectedFeatures = _useState2[1],
1408 _useState3 = (0, _react.useState)(tiers.essential),
1409 _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
1410 tierName = _useState4[0],
1411 setTierName = _useState4[1],
1412 pageId = 'chooseFeatures',
1413 nextStep = 'goodToGo',
1414 _useButtonAction = (0, _useButtonAction2.default)(pageId, nextStep),
1415 state = _useButtonAction.state,
1416 handleAction = _useButtonAction.handleAction,
1417 actionButton = {
1418 text: __('Upgrade Now', 'elementor'),
1419 href: elementorAppConfig.onboarding.urls.upgrade,
1420 target: '_blank',
1421 onClick: function onClick() {
1422 elementorCommon.events.dispatchEvent({
1423 event: 'next',
1424 version: '',
1425 details: {
1426 placement: elementorAppConfig.onboarding.eventPlacement,
1427 step: state.currentStep
1428 }
1429 });
1430 setAjax({
1431 data: {
1432 action: 'elementor_save_onboarding_features',
1433 data: JSON.stringify({
1434 features: selectedFeatures
1435 })
1436 }
1437 });
1438 handleAction('completed');
1439 }
1440 };
1441 var skipButton;
1442 if ('completed' !== state.steps[pageId]) {
1443 skipButton = {
1444 text: __('Skip', 'elementor'),
1445 action: function action() {
1446 setAjax({
1447 data: {
1448 action: 'elementor_save_onboarding_features',
1449 data: JSON.stringify({
1450 features: selectedFeatures
1451 })
1452 }
1453 });
1454 handleAction('skipped');
1455 }
1456 };
1457 }
1458 if (!isFeatureSelected(selectedFeatures)) {
1459 actionButton.className = 'e-onboarding__button--disabled';
1460 }
1461 (0, _react.useEffect)(function () {
1462 if (selectedFeatures.advanced.length > 0) {
1463 setTierName(tiers.advanced);
1464 } else {
1465 setTierName(tiers.essential);
1466 }
1467 }, [selectedFeatures]);
1468 function isFeatureSelected(features) {
1469 return !!features.advanced.length || !!features.essential.length;
1470 }
1471 return /*#__PURE__*/_react.default.createElement(_layout.default, {
1472 pageId: pageId,
1473 nextStep: nextStep
1474 }, /*#__PURE__*/_react.default.createElement(_pageContentLayout.default, {
1475 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Illustration_Setup.svg',
1476 title: __('Elevate your website with additional Pro features.', 'elementor'),
1477 actionButton: actionButton,
1478 skipButton: skipButton
1479 }, /*#__PURE__*/_react.default.createElement("p", null, __('Which Elementor Pro features do you need to bring your creative vision to life?', 'elementor')), /*#__PURE__*/_react.default.createElement("form", {
1480 className: "e-onboarding__choose-features-section"
1481 }, _utils.options.map(function (option, index) {
1482 var itemId = "".concat(option.plan, "-").concat(index);
1483 return /*#__PURE__*/_react.default.createElement("label", {
1484 key: itemId,
1485 className: "e-onboarding__choose-features-section__label",
1486 htmlFor: itemId
1487 }, /*#__PURE__*/_react.default.createElement("input", {
1488 className: "e-onboarding__choose-features-section__checkbox",
1489 type: "checkbox",
1490 onChange: function onChange(event) {
1491 return (0, _utils.setSelectedFeatureList)({
1492 checked: event.currentTarget.checked,
1493 id: event.target.value,
1494 text: option.text,
1495 selectedFeatures: selectedFeatures,
1496 setSelectedFeatures: setSelectedFeatures
1497 });
1498 },
1499 id: itemId,
1500 value: itemId
1501 }), option.text);
1502 })), /*#__PURE__*/_react.default.createElement("p", {
1503 className: "e-onboarding__choose-features-section__message"
1504 }, isFeatureSelected(selectedFeatures) && /*#__PURE__*/_react.default.createElement(_message.default, {
1505 tier: tierName
1506 }))));
1507 }
1508
1509 /***/ }),
1510
1511 /***/ "../app/modules/onboarding/assets/js/pages/good-to-go.js":
1512 /*!***************************************************************!*\
1513 !*** ../app/modules/onboarding/assets/js/pages/good-to-go.js ***!
1514 \***************************************************************/
1515 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1516
1517 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
1518
1519
1520 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1521 Object.defineProperty(exports, "__esModule", ({
1522 value: true
1523 }));
1524 exports["default"] = GoodToGo;
1525 var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react"));
1526 var _defineProperty2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ "../node_modules/@babel/runtime/helpers/defineProperty.js"));
1527 var _grid = _interopRequireDefault(__webpack_require__(/*! elementor-app/ui/grid/grid */ "../app/assets/js/ui/grid/grid.js"));
1528 var _layout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/layout */ "../app/modules/onboarding/assets/js/components/layout/layout.js"));
1529 var _card = _interopRequireDefault(__webpack_require__(/*! ../components/card */ "../app/modules/onboarding/assets/js/components/card.js"));
1530 var _footerButtons = _interopRequireDefault(__webpack_require__(/*! ../components/layout/footer-buttons */ "../app/modules/onboarding/assets/js/components/layout/footer-buttons.js"));
1531 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
1532 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
1533 function GoodToGo() {
1534 var pageId = 'goodToGo',
1535 skipButton = {
1536 text: __('Skip', 'elementor'),
1537 href: elementorAppConfig.onboarding.urls.createNewPage
1538 },
1539 kitLibraryLink = elementorAppConfig.onboarding.urls.kitLibrary + '&referrer=onboarding';
1540 return /*#__PURE__*/_react.default.createElement(_layout.default, {
1541 pageId: pageId
1542 }, /*#__PURE__*/_react.default.createElement("h1", {
1543 className: "e-onboarding__page-content-section-title"
1544 }, elementorAppConfig.onboarding.experiment ? __('Welcome aboard! What\'s next?', 'elementor') : __('That\'s a wrap! What\'s next?', 'elementor')), /*#__PURE__*/_react.default.createElement("div", {
1545 className: "e-onboarding__page-content-section-text"
1546 }, __('There are three ways to get started with Elementor:', 'elementor')), /*#__PURE__*/_react.default.createElement(_grid.default, {
1547 container: true,
1548 alignItems: "center",
1549 justify: "space-between",
1550 className: "e-onboarding__cards-grid e-onboarding__page-content"
1551 }, /*#__PURE__*/_react.default.createElement(_card.default, {
1552 name: "blank",
1553 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Blank_Canvas.svg',
1554 imageAlt: __('Click here to create a new page and open it in Elementor Editor', 'elementor'),
1555 text: __('Edit a blank canvas with the Elementor Editor', 'elementor'),
1556 link: elementorAppConfig.onboarding.urls.createNewPage
1557 }), /*#__PURE__*/_react.default.createElement(_card.default, {
1558 name: "template",
1559 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Library.svg',
1560 imageAlt: __('Click here to go to Elementor\'s Kit Library', 'elementor'),
1561 text: __('Choose a professionally-designed template or import your own', 'elementor'),
1562 link: kitLibraryLink,
1563 clickAction: function clickAction() {
1564 // The location is reloaded to make sure the Kit Library's state is re-created.
1565 location.href = kitLibraryLink;
1566 location.reload();
1567 }
1568 }), /*#__PURE__*/_react.default.createElement(_card.default, {
1569 name: "site-planner",
1570 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Site_Planner.svg',
1571 imageAlt: __('Click here to go to Elementor\'s Site Planner', 'elementor'),
1572 text: __('Create a professional site in minutes using AI', 'elementor'),
1573 link: elementorAppConfig.onboarding.urls.sitePlanner,
1574 target: "_blank"
1575 })), /*#__PURE__*/_react.default.createElement(_footerButtons.default, {
1576 skipButton: _objectSpread(_objectSpread({}, skipButton), {}, {
1577 target: '_self'
1578 }),
1579 className: "e-onboarding__good-to-go-footer"
1580 }));
1581 }
1582
1583 /***/ }),
1584
1585 /***/ "../app/modules/onboarding/assets/js/pages/hello-theme.js":
1586 /*!****************************************************************!*\
1587 !*** ../app/modules/onboarding/assets/js/pages/hello-theme.js ***!
1588 \****************************************************************/
1589 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1590
1591 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
1592
1593
1594 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1595 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
1596 Object.defineProperty(exports, "__esModule", ({
1597 value: true
1598 }));
1599 exports["default"] = HelloTheme;
1600 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
1601 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
1602 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
1603 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
1604 var _useAjax2 = _interopRequireDefault(__webpack_require__(/*! elementor-app/hooks/use-ajax */ "../app/assets/js/hooks/use-ajax.js"));
1605 var _layout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/layout */ "../app/modules/onboarding/assets/js/components/layout/layout.js"));
1606 var _pageContentLayout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/page-content-layout */ "../app/modules/onboarding/assets/js/components/layout/page-content-layout.js"));
1607 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
1608 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
1609 /* eslint-disable @wordpress/i18n-ellipsis */
1610
1611 function HelloTheme() {
1612 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
1613 state = _useContext.state,
1614 updateState = _useContext.updateState,
1615 getStateObjectToUpdate = _useContext.getStateObjectToUpdate,
1616 _useAjax = (0, _useAjax2.default)(),
1617 activateHelloThemeAjaxState = _useAjax.ajaxState,
1618 setActivateHelloThemeAjaxState = _useAjax.setAjax,
1619 _useState = (0, _react.useState)(false),
1620 _useState2 = (0, _slicedToArray2.default)(_useState, 2),
1621 helloInstalledInOnboarding = _useState2[0],
1622 setHelloInstalledInOnboarding = _useState2[1],
1623 _useState3 = (0, _react.useState)(false),
1624 _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
1625 isInstalling = _useState4[0],
1626 setIsInstalling = _useState4[1],
1627 noticeStateSuccess = {
1628 type: 'success',
1629 icon: 'eicon-check-circle-o',
1630 message: __('Your site’s got Hello theme. High-five!', 'elementor')
1631 },
1632 _useState5 = (0, _react.useState)(state.isHelloThemeActivated ? noticeStateSuccess : null),
1633 _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
1634 noticeState = _useState6[0],
1635 setNoticeState = _useState6[1],
1636 _useState7 = (0, _react.useState)([]),
1637 _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
1638 activeTimeouts = _useState8[0],
1639 setActiveTimeouts = _useState8[1],
1640 continueWithHelloThemeText = state.isHelloThemeActivated ? __('Next', 'elementor') : __('Continue with Hello Biz Theme', 'elementor'),
1641 _useState9 = (0, _react.useState)(continueWithHelloThemeText),
1642 _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
1643 actionButtonText = _useState10[0],
1644 setActionButtonText = _useState10[1],
1645 navigate = (0, _router.useNavigate)(),
1646 pageId = 'hello',
1647 nextStep = elementorAppConfig.onboarding.experiment ? 'chooseFeatures' : 'siteName',
1648 goToNextScreen = function goToNextScreen() {
1649 return navigate('onboarding/' + nextStep);
1650 };
1651
1652 /**
1653 * Setup
1654 *
1655 * If Hello Theme is already activated when onboarding starts, This screen is unneeded and is marked as 'completed'
1656 * and skipped.
1657 */
1658 (0, _react.useEffect)(function () {
1659 if (!helloInstalledInOnboarding && state.isHelloThemeActivated) {
1660 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'completed');
1661 updateState(stateToUpdate);
1662 goToNextScreen();
1663 }
1664 }, []);
1665 var resetScreenContent = function resetScreenContent() {
1666 // Clear any active timeouts for changing the action button text during installation.
1667 activeTimeouts.forEach(function (timeoutID) {
1668 return clearTimeout(timeoutID);
1669 });
1670 setActiveTimeouts([]);
1671 setIsInstalling(false);
1672 setActionButtonText(continueWithHelloThemeText);
1673 };
1674
1675 /**
1676 * Callbacks
1677 */
1678 var onHelloThemeActivationSuccess = (0, _react.useCallback)(function () {
1679 setIsInstalling(false);
1680 elementorCommon.events.dispatchEvent({
1681 event: 'indication prompt',
1682 version: '',
1683 details: {
1684 placement: elementorAppConfig.onboarding.eventPlacement,
1685 step: state.currentStep,
1686 action_state: 'success',
1687 action: 'hello theme activation'
1688 }
1689 });
1690 setNoticeState(noticeStateSuccess);
1691 setActionButtonText(__('Next', 'elementor'));
1692 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'completed');
1693 stateToUpdate.isHelloThemeActivated = true;
1694 updateState(stateToUpdate);
1695 setHelloInstalledInOnboarding(true);
1696 goToNextScreen();
1697 }, []);
1698 var onErrorInstallHelloTheme = function onErrorInstallHelloTheme() {
1699 elementorCommon.events.dispatchEvent({
1700 event: 'indication prompt',
1701 version: '',
1702 details: {
1703 placement: elementorAppConfig.onboarding.eventPlacement,
1704 step: state.currentStep,
1705 action_state: 'failure',
1706 action: 'hello theme install'
1707 }
1708 });
1709 setNoticeState({
1710 type: 'error',
1711 icon: 'eicon-warning',
1712 message: __('There was a problem installing Hello Biz Theme.', 'elementor')
1713 });
1714 resetScreenContent();
1715 };
1716 var activateHelloTheme = function activateHelloTheme() {
1717 setIsInstalling(true);
1718 updateState({
1719 isHelloThemeInstalled: true
1720 });
1721 setActivateHelloThemeAjaxState({
1722 data: {
1723 action: 'elementor_activate_hello_theme'
1724 }
1725 });
1726 };
1727 var installHelloTheme = function installHelloTheme() {
1728 if (!isInstalling) {
1729 setIsInstalling(true);
1730 }
1731 wp.updates.ajax('install-theme', {
1732 slug: 'hello-biz',
1733 success: function success() {
1734 return activateHelloTheme();
1735 },
1736 error: function error() {
1737 return onErrorInstallHelloTheme();
1738 }
1739 });
1740 };
1741 var sendNextButtonEvent = function sendNextButtonEvent() {
1742 elementorCommon.events.dispatchEvent({
1743 event: 'next',
1744 version: '',
1745 details: {
1746 placement: elementorAppConfig.onboarding.eventPlacement,
1747 step: state.currentStep
1748 }
1749 });
1750 };
1751
1752 /**
1753 * Action Button
1754 */
1755 var actionButton = {
1756 text: actionButtonText,
1757 role: 'button'
1758 };
1759 if (isInstalling) {
1760 actionButton.className = 'e-onboarding__button--processing';
1761 }
1762 if (state.isHelloThemeActivated) {
1763 actionButton.onClick = function () {
1764 sendNextButtonEvent();
1765 goToNextScreen();
1766 };
1767 } else {
1768 actionButton.onClick = function () {
1769 sendNextButtonEvent();
1770 if (state.isHelloThemeInstalled && !state.isHelloThemeActivated) {
1771 activateHelloTheme();
1772 } else if (!state.isHelloThemeInstalled) {
1773 installHelloTheme();
1774 } else {
1775 goToNextScreen();
1776 }
1777 };
1778 }
1779
1780 /**
1781 * Skip Button
1782 */
1783 var skipButton = {};
1784 if (isInstalling) {
1785 skipButton.className = 'e-onboarding__button-skip--disabled';
1786 }
1787 if ('completed' !== state.steps[pageId]) {
1788 skipButton.text = __('Skip', 'elementor');
1789 }
1790
1791 /**
1792 * Set timeouts for updating the 'Next' button text if the Hello Theme installation is taking too long.
1793 */
1794 (0, _react.useEffect)(function () {
1795 if (isInstalling) {
1796 setActionButtonText(/*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("i", {
1797 className: "eicon-loading eicon-animation-spin",
1798 "aria-hidden": "true"
1799 })));
1800 }
1801 var actionTextTimeouts = [];
1802 var timeout4 = setTimeout(function () {
1803 if (!isInstalling) {
1804 return;
1805 }
1806 setActionButtonText(/*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("i", {
1807 className: "eicon-loading eicon-animation-spin",
1808 "aria-hidden": "true"
1809 }), /*#__PURE__*/_react.default.createElement("span", {
1810 className: "e-onboarding__action-button-text"
1811 }, __('Hold on, this can take a minute...', 'elementor'))));
1812 }, 4000);
1813 actionTextTimeouts.push(timeout4);
1814 var timeout30 = setTimeout(function () {
1815 if (!isInstalling) {
1816 return;
1817 }
1818 setActionButtonText(/*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("i", {
1819 className: "eicon-loading eicon-animation-spin",
1820 "aria-hidden": "true"
1821 }), /*#__PURE__*/_react.default.createElement("span", {
1822 className: "e-onboarding__action-button-text"
1823 }, __('Okay, now we\'re really close...', 'elementor'))));
1824 }, 30000);
1825 actionTextTimeouts.push(timeout30);
1826 setActiveTimeouts(actionTextTimeouts);
1827 }, [isInstalling]);
1828 (0, _react.useEffect)(function () {
1829 if ('initial' !== activateHelloThemeAjaxState.status) {
1830 var _activateHelloThemeAj;
1831 if ('success' === activateHelloThemeAjaxState.status && (_activateHelloThemeAj = activateHelloThemeAjaxState.response) !== null && _activateHelloThemeAj !== void 0 && _activateHelloThemeAj.helloThemeActivated) {
1832 onHelloThemeActivationSuccess();
1833 } else if ('error' === activateHelloThemeAjaxState.status) {
1834 elementorCommon.events.dispatchEvent({
1835 event: 'indication prompt',
1836 version: '',
1837 details: {
1838 placement: elementorAppConfig.onboarding.eventPlacement,
1839 step: state.currentStep,
1840 action_state: 'failure',
1841 action: 'hello theme activation'
1842 }
1843 });
1844 setNoticeState({
1845 type: 'error',
1846 icon: 'eicon-warning',
1847 message: __('There was a problem activating Hello Biz Theme.', 'elementor')
1848 });
1849
1850 // Clear any active timeouts for changing the action button text during installation.
1851 resetScreenContent();
1852 }
1853 }
1854 }, [activateHelloThemeAjaxState.status]);
1855 return /*#__PURE__*/_react.default.createElement(_layout.default, {
1856 pageId: pageId,
1857 nextStep: nextStep
1858 }, /*#__PURE__*/_react.default.createElement(_pageContentLayout.default, {
1859 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Illustration_Hello_Biz.svg',
1860 title: __('Every site starts with a theme.', 'elementor'),
1861 actionButton: actionButton,
1862 skipButton: skipButton,
1863 noticeState: noticeState
1864 }, /*#__PURE__*/_react.default.createElement("p", null, __('Hello Biz by Elementor helps you launch your professional business website - fast.', 'elementor')), !elementorAppConfig.onboarding.experiment && /*#__PURE__*/_react.default.createElement("p", null, __('Here\'s why:', 'elementor')), /*#__PURE__*/_react.default.createElement("ul", {
1865 className: "e-onboarding__feature-list"
1866 }, /*#__PURE__*/_react.default.createElement("li", null, __('Get online faster', 'elementor')), /*#__PURE__*/_react.default.createElement("li", null, __('Lightweight and fast loading', 'elementor')), /*#__PURE__*/_react.default.createElement("li", null, __('Great for SEO', 'elementor')))), /*#__PURE__*/_react.default.createElement("div", {
1867 className: "e-onboarding__footnote"
1868 }, '* ' + __('You can switch your theme later on', 'elementor')));
1869 }
1870
1871 /***/ }),
1872
1873 /***/ "../app/modules/onboarding/assets/js/pages/site-logo.js":
1874 /*!**************************************************************!*\
1875 !*** ../app/modules/onboarding/assets/js/pages/site-logo.js ***!
1876 \**************************************************************/
1877 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
1878
1879 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
1880
1881
1882 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
1883 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
1884 Object.defineProperty(exports, "__esModule", ({
1885 value: true
1886 }));
1887 exports["default"] = SiteLogo;
1888 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
1889 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
1890 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
1891 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
1892 var _useAjax3 = _interopRequireDefault(__webpack_require__(/*! elementor-app/hooks/use-ajax */ "../app/assets/js/hooks/use-ajax.js"));
1893 var _dropZone = _interopRequireDefault(__webpack_require__(/*! elementor-app/organisms/drop-zone */ "../app/assets/js/organisms/drop-zone.js"));
1894 var _unfilteredFilesDialog = _interopRequireDefault(__webpack_require__(/*! elementor-app/organisms/unfiltered-files-dialog */ "../app/assets/js/organisms/unfiltered-files-dialog.js"));
1895 var _layout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/layout */ "../app/modules/onboarding/assets/js/components/layout/layout.js"));
1896 var _pageContentLayout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/page-content-layout */ "../app/modules/onboarding/assets/js/components/layout/page-content-layout.js"));
1897 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
1898 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
1899 /* eslint-disable jsx-a11y/no-static-element-interactions */
1900 /* eslint-disable jsx-a11y/click-events-have-key-events */
1901
1902 function SiteLogo() {
1903 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
1904 state = _useContext.state,
1905 updateState = _useContext.updateState,
1906 getStateObjectToUpdate = _useContext.getStateObjectToUpdate,
1907 _useState = (0, _react.useState)(state.siteLogo.id ? state.siteLogo : null),
1908 _useState2 = (0, _slicedToArray2.default)(_useState, 2),
1909 file = _useState2[0],
1910 setFile = _useState2[1],
1911 _useState3 = (0, _react.useState)(false),
1912 _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
1913 isUploading = _useState4[0],
1914 setIsUploading = _useState4[1],
1915 _useState5 = (0, _react.useState)(false),
1916 _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
1917 showUnfilteredFilesDialog = _useState6[0],
1918 setShowUnfilteredFilesDialog = _useState6[1],
1919 _useState7 = (0, _react.useState)(),
1920 _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
1921 fileSource = _useState8[0],
1922 setFileSource = _useState8[1],
1923 _useState9 = (0, _react.useState)(null),
1924 _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
1925 noticeState = _useState10[0],
1926 setNoticeState = _useState10[1],
1927 _useAjax = (0, _useAjax3.default)(),
1928 updateLogoAjaxState = _useAjax.ajaxState,
1929 setUpdateLogoAjax = _useAjax.setAjax,
1930 _useAjax2 = (0, _useAjax3.default)(),
1931 uploadImageAjaxState = _useAjax2.ajaxState,
1932 setUploadImageAjax = _useAjax2.setAjax,
1933 pageId = 'siteLogo',
1934 nextStep = 'goodToGo',
1935 navigate = (0, _router.useNavigate)(),
1936 actionButton = {
1937 role: 'button',
1938 onClick: function onClick() {
1939 elementorCommon.events.dispatchEvent({
1940 event: 'next',
1941 version: '',
1942 details: {
1943 placement: elementorAppConfig.onboarding.eventPlacement,
1944 step: state.currentStep
1945 }
1946 });
1947 if (file.id) {
1948 if (file.id !== state.siteLogo.id) {
1949 updateSiteLogo();
1950 } else {
1951 // If the currently displayed logo is already set as the site logo, just go to the next screen.
1952 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'completed');
1953 updateState(stateToUpdate);
1954 navigate('onboarding/' + nextStep);
1955 }
1956 }
1957 }
1958 };
1959 var skipButton;
1960 if ('completed' !== state.steps[pageId]) {
1961 skipButton = {
1962 text: __('Skip', 'elementor')
1963 };
1964 }
1965 if (isUploading) {
1966 actionButton.text = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("i", {
1967 className: "eicon-loading eicon-animation-spin",
1968 "aria-hidden": "true"
1969 }));
1970 } else {
1971 actionButton.text = __('Next', 'elementor');
1972 }
1973 if (!file) {
1974 actionButton.className = 'e-onboarding__button--disabled';
1975 }
1976 var updateSiteLogo = (0, _react.useCallback)(function () {
1977 setIsUploading(true);
1978 setUpdateLogoAjax({
1979 data: {
1980 action: 'elementor_update_site_logo',
1981 data: JSON.stringify({
1982 attachmentId: file.id
1983 })
1984 }
1985 });
1986 }, [file]);
1987 var uploadSiteLogo = function uploadSiteLogo(fileToUpload) {
1988 setIsUploading(true);
1989 setUploadImageAjax({
1990 data: {
1991 action: 'elementor_upload_site_logo',
1992 fileToUpload: fileToUpload
1993 }
1994 });
1995 };
1996 var dismissUnfilteredFilesCallback = function dismissUnfilteredFilesCallback() {
1997 setIsUploading(false);
1998 setFile(null);
1999 setShowUnfilteredFilesDialog(false);
2000 };
2001 var _onFileSelect = function onFileSelect(selectedFile) {
2002 setFileSource('drop');
2003 if ('image/svg+xml' === selectedFile.type && !elementorAppConfig.onboarding.isUnfilteredFilesEnabled) {
2004 setFile(selectedFile);
2005 setIsUploading(true);
2006 setShowUnfilteredFilesDialog(true);
2007 } else {
2008 setFile(selectedFile);
2009 setNoticeState(null);
2010 uploadSiteLogo(selectedFile);
2011 }
2012 };
2013 var onImageRemoveClick = function onImageRemoveClick() {
2014 elementorCommon.events.dispatchEvent({
2015 event: 'remove selected logo',
2016 version: '',
2017 details: {
2018 placement: elementorAppConfig.onboarding.eventPlacement
2019 }
2020 });
2021 setFile(null);
2022 };
2023
2024 /**
2025 * Ajax Callbacks
2026 */
2027 // Run the callback for the new image upload AJAX request.
2028 (0, _react.useEffect)(function () {
2029 if ('initial' !== uploadImageAjaxState.status) {
2030 var _uploadImageAjaxState;
2031 if ('success' === uploadImageAjaxState.status && (_uploadImageAjaxState = uploadImageAjaxState.response) !== null && _uploadImageAjaxState !== void 0 && (_uploadImageAjaxState = _uploadImageAjaxState.imageAttachment) !== null && _uploadImageAjaxState !== void 0 && _uploadImageAjaxState.id) {
2032 elementorCommon.events.dispatchEvent({
2033 event: 'logo image uploaded',
2034 version: '',
2035 details: {
2036 placement: elementorAppConfig.onboarding.eventPlacement,
2037 source: fileSource
2038 }
2039 });
2040 setIsUploading(false);
2041 setFile(uploadImageAjaxState.response.imageAttachment);
2042 if (noticeState) {
2043 setNoticeState(null);
2044 }
2045 } else if ('error' === uploadImageAjaxState.status) {
2046 setIsUploading(false);
2047 setFile(null);
2048 elementorCommon.events.dispatchEvent({
2049 event: 'indication prompt',
2050 version: '',
2051 details: {
2052 placement: elementorAppConfig.onboarding.eventPlacement,
2053 action_state: 'failure',
2054 action: 'logo image upload'
2055 }
2056 });
2057 setNoticeState({
2058 type: 'error',
2059 icon: 'eicon-warning',
2060 message: 'That didn\'t work. Try uploading your file again.'
2061 });
2062 }
2063 }
2064 }, [uploadImageAjaxState.status]);
2065
2066 // Run the callback for the site logo update AJAX request.
2067 (0, _react.useEffect)(function () {
2068 if ('initial' !== updateLogoAjaxState.status) {
2069 var _updateLogoAjaxState$;
2070 if ('success' === updateLogoAjaxState.status && (_updateLogoAjaxState$ = updateLogoAjaxState.response) !== null && _updateLogoAjaxState$ !== void 0 && _updateLogoAjaxState$.siteLogoUpdated) {
2071 elementorCommon.events.dispatchEvent({
2072 event: 'logo image updated',
2073 version: '',
2074 details: {
2075 placement: elementorAppConfig.onboarding.eventPlacement,
2076 source: fileSource
2077 }
2078 });
2079 setIsUploading(false);
2080 if (noticeState) {
2081 setNoticeState(null);
2082 }
2083 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'completed');
2084 stateToUpdate.siteLogo = {
2085 id: file.id,
2086 url: file.url
2087 };
2088 updateState(stateToUpdate);
2089 navigate('onboarding/' + nextStep);
2090 } else if ('error' === updateLogoAjaxState.status) {
2091 setIsUploading(false);
2092 elementorCommon.events.dispatchEvent({
2093 event: 'indication prompt',
2094 version: '',
2095 details: {
2096 placement: elementorAppConfig.onboarding.eventPlacement,
2097 step: state.currentStep,
2098 action_state: 'failure',
2099 action: 'update site logo'
2100 }
2101 });
2102 setNoticeState({
2103 type: 'error',
2104 icon: 'eicon-warning',
2105 message: 'That didn\'t work. Try uploading your file again.'
2106 });
2107 }
2108 }
2109 }, [updateLogoAjaxState.status]);
2110 return /*#__PURE__*/_react.default.createElement(_layout.default, {
2111 pageId: pageId,
2112 nextStep: nextStep
2113 }, /*#__PURE__*/_react.default.createElement(_pageContentLayout.default, {
2114 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Illustration_Setup.svg',
2115 title: __('Have a logo? Add it here.', 'elementor'),
2116 actionButton: actionButton,
2117 skipButton: skipButton,
2118 noticeState: noticeState
2119 }, /*#__PURE__*/_react.default.createElement("span", null, __('Otherwise, you can skip this and add one later.', 'elementor')), file && !showUnfilteredFilesDialog ? /*#__PURE__*/_react.default.createElement("div", {
2120 className: 'e-onboarding__logo-container' + (isUploading ? ' e-onboarding__is-uploading' : '')
2121 }, /*#__PURE__*/_react.default.createElement("div", {
2122 className: "e-onboarding__logo-remove",
2123 onClick: function onClick() {
2124 return onImageRemoveClick();
2125 }
2126 }, /*#__PURE__*/_react.default.createElement("i", {
2127 className: "eicon-trash-o"
2128 })), /*#__PURE__*/_react.default.createElement("img", {
2129 src: file.url,
2130 alt: __('Potential Site Logo', 'elementor')
2131 })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_dropZone.default, {
2132 className: "e-onboarding__drop-zone",
2133 heading: __('Drop image here', 'elementor'),
2134 secondaryText: __('or', 'elementor'),
2135 buttonText: __('Open Media Library', 'elementor'),
2136 buttonVariant: "outlined",
2137 buttonColor: "cta",
2138 icon: '',
2139 type: "wp-media",
2140 filetypes: ['jpg', 'jpeg', 'png', 'svg'],
2141 onFileSelect: function onFileSelect(selectedFile) {
2142 return _onFileSelect(selectedFile);
2143 },
2144 onWpMediaSelect: function onWpMediaSelect(frame) {
2145 // Get media attachment details from the frame state
2146 var attachment = frame.state().get('selection').first().toJSON();
2147 setFileSource('browse');
2148 setFile(attachment);
2149 setNoticeState(null);
2150 },
2151 onButtonClick: function onButtonClick() {
2152 elementorCommon.events.dispatchEvent({
2153 event: 'browse file click',
2154 version: '',
2155 details: {
2156 placement: elementorAppConfig.onboarding.eventPlacement,
2157 step: state.currentStep
2158 }
2159 });
2160 }
2161 // TODO: DEAL WITH ERROR
2162 ,
2163 onError: function onError(error) {
2164 if ('file_not_allowed' === error.id) {
2165 elementorCommon.events.dispatchEvent({
2166 event: 'indication prompt',
2167 version: '',
2168 details: {
2169 placement: elementorAppConfig.onboarding.eventPlacement,
2170 step: state.currentStep,
2171 action_state: 'failure',
2172 action: 'logo upload format'
2173 }
2174 });
2175 setNoticeState({
2176 type: 'error',
2177 icon: 'eicon-warning',
2178 message: __('This file type is not supported. Try a different type of file', 'elementor')
2179 });
2180 }
2181 }
2182 })), /*#__PURE__*/_react.default.createElement(_unfilteredFilesDialog.default, {
2183 show: showUnfilteredFilesDialog,
2184 setShow: setShowUnfilteredFilesDialog,
2185 confirmModalText: __('This allows Elementor to scan your SVGs for malicious content. If you do not wish to allow this, use a different image format.', 'elementor'),
2186 errorModalText: __('There was a problem with enabling SVG uploads. Try again, or use another image format.', 'elementor'),
2187 onReady: function onReady() {
2188 setShowUnfilteredFilesDialog(false);
2189 elementorAppConfig.onboarding.isUnfilteredFilesEnabled = true;
2190 uploadSiteLogo(file);
2191 },
2192 onDismiss: function onDismiss() {
2193 return dismissUnfilteredFilesCallback();
2194 },
2195 onCancel: function onCancel() {
2196 return dismissUnfilteredFilesCallback();
2197 }
2198 })));
2199 }
2200
2201 /***/ }),
2202
2203 /***/ "../app/modules/onboarding/assets/js/pages/site-name.js":
2204 /*!**************************************************************!*\
2205 !*** ../app/modules/onboarding/assets/js/pages/site-name.js ***!
2206 \**************************************************************/
2207 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
2208
2209 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
2210
2211
2212 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
2213 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
2214 Object.defineProperty(exports, "__esModule", ({
2215 value: true
2216 }));
2217 exports["default"] = SiteName;
2218 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
2219 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
2220 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
2221 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
2222 var _useAjax2 = _interopRequireDefault(__webpack_require__(/*! elementor-app/hooks/use-ajax */ "../app/assets/js/hooks/use-ajax.js"));
2223 var _layout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/layout */ "../app/modules/onboarding/assets/js/components/layout/layout.js"));
2224 var _pageContentLayout = _interopRequireDefault(__webpack_require__(/*! ../components/layout/page-content-layout */ "../app/modules/onboarding/assets/js/components/layout/page-content-layout.js"));
2225 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
2226 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
2227 function SiteName() {
2228 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
2229 state = _useContext.state,
2230 updateState = _useContext.updateState,
2231 getStateObjectToUpdate = _useContext.getStateObjectToUpdate,
2232 _useAjax = (0, _useAjax2.default)(),
2233 ajaxState = _useAjax.ajaxState,
2234 setAjax = _useAjax.setAjax,
2235 _useState = (0, _react.useState)(null),
2236 _useState2 = (0, _slicedToArray2.default)(_useState, 2),
2237 noticeState = _useState2[0],
2238 setNoticeState = _useState2[1],
2239 _useState3 = (0, _react.useState)(state.siteName),
2240 _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
2241 siteNameInputValue = _useState4[0],
2242 setSiteNameInputValue = _useState4[1],
2243 pageId = 'siteName',
2244 nextStep = 'siteLogo',
2245 navigate = (0, _router.useNavigate)(),
2246 nameInputRef = (0, _react.useRef)(),
2247 actionButton = {
2248 text: __('Next', 'elementor'),
2249 onClick: function onClick() {
2250 elementorCommon.events.dispatchEvent({
2251 event: 'next',
2252 version: '',
2253 details: {
2254 placement: elementorAppConfig.onboarding.eventPlacement,
2255 step: state.currentStep
2256 }
2257 });
2258
2259 // Only run the site name update AJAX if the new name is different than the existing one and it isn't empty.
2260 if (nameInputRef.current.value !== state.siteName && '' !== nameInputRef.current.value) {
2261 setAjax({
2262 data: {
2263 action: 'elementor_update_site_name',
2264 data: JSON.stringify({
2265 siteName: nameInputRef.current.value
2266 })
2267 }
2268 });
2269 } else if (nameInputRef.current.value === state.siteName) {
2270 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'completed');
2271 updateState(stateToUpdate);
2272 navigate('onboarding/' + nextStep);
2273 } else {
2274 var _stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'skipped');
2275 updateState(_stateToUpdate);
2276 navigate('onboarding/' + nextStep);
2277 }
2278 }
2279 };
2280 var skipButton;
2281 if ('completed' !== state.steps[pageId]) {
2282 skipButton = {
2283 text: __('Skip', 'elementor')
2284 };
2285 }
2286 if (!siteNameInputValue) {
2287 actionButton.className = 'e-onboarding__button--disabled';
2288 }
2289
2290 // Run the callback for the site name update AJAX request.
2291 (0, _react.useEffect)(function () {
2292 if ('initial' !== ajaxState.status) {
2293 var _ajaxState$response;
2294 if ('success' === ajaxState.status && (_ajaxState$response = ajaxState.response) !== null && _ajaxState$response !== void 0 && _ajaxState$response.siteNameUpdated) {
2295 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, 'completed');
2296 stateToUpdate.siteName = nameInputRef.current.value;
2297 updateState(stateToUpdate);
2298 navigate('onboarding/' + nextStep);
2299 } else if ('error' === ajaxState.status) {
2300 elementorCommon.events.dispatchEvent({
2301 event: 'indication prompt',
2302 version: '',
2303 details: {
2304 placement: elementorAppConfig.onboarding.eventPlacement,
2305 step: state.currentStep,
2306 action_state: 'failure',
2307 action: 'site name update'
2308 }
2309 });
2310 setNoticeState({
2311 type: 'error',
2312 icon: 'eicon-warning',
2313 message: __('Sorry, the name wasn\'t saved. Try again, or skip for now.', 'elementor')
2314 });
2315 }
2316 }
2317 }, [ajaxState.status]);
2318 return /*#__PURE__*/_react.default.createElement(_layout.default, {
2319 pageId: pageId,
2320 nextStep: nextStep
2321 }, /*#__PURE__*/_react.default.createElement(_pageContentLayout.default, {
2322 image: elementorCommon.config.urls.assets + 'images/app/onboarding/Illustration_Setup.svg',
2323 title: __('Now, let\'s give your site a name.', 'elementor'),
2324 actionButton: actionButton,
2325 skipButton: skipButton,
2326 noticeState: noticeState
2327 }, /*#__PURE__*/_react.default.createElement("p", null, __('This is what your site is called on the WP dashboard, and can be changed later from the general settings - it\'s not your website\'s URL.', 'elementor')), /*#__PURE__*/_react.default.createElement("input", {
2328 className: "e-onboarding__text-input e-onboarding__site-name-input",
2329 type: "text",
2330 placeholder: "e.g. Eric's Space Shuttles",
2331 defaultValue: state.siteName || '',
2332 ref: nameInputRef,
2333 onChange: function onChange(event) {
2334 return setSiteNameInputValue(event.target.value);
2335 }
2336 })));
2337 }
2338
2339 /***/ }),
2340
2341 /***/ "../app/modules/onboarding/assets/js/pages/upload-and-install-pro.js":
2342 /*!***************************************************************************!*\
2343 !*** ../app/modules/onboarding/assets/js/pages/upload-and-install-pro.js ***!
2344 \***************************************************************************/
2345 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
2346
2347 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
2348
2349
2350 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
2351 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "../node_modules/@babel/runtime/helpers/typeof.js");
2352 Object.defineProperty(exports, "__esModule", ({
2353 value: true
2354 }));
2355 exports["default"] = UploadAndInstallPro;
2356 var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react"));
2357 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "../node_modules/@babel/runtime/helpers/slicedToArray.js"));
2358 var _useAjax2 = _interopRequireDefault(__webpack_require__(/*! elementor-app/hooks/use-ajax */ "../app/assets/js/hooks/use-ajax.js"));
2359 var _usePageTitle = _interopRequireDefault(__webpack_require__(/*! elementor-app/hooks/use-page-title */ "../app/assets/js/hooks/use-page-title.js"));
2360 var _content = _interopRequireDefault(__webpack_require__(/*! ../../../../../assets/js/layout/content */ "../app/assets/js/layout/content.js"));
2361 var _dropZone = _interopRequireDefault(__webpack_require__(/*! ../../../../../assets/js/organisms/drop-zone */ "../app/assets/js/organisms/drop-zone.js"));
2362 var _notice = _interopRequireDefault(__webpack_require__(/*! ../components/notice */ "../app/modules/onboarding/assets/js/components/notice.js"));
2363 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
2364 var _elementorLoading = _interopRequireDefault(__webpack_require__(/*! elementor-app/molecules/elementor-loading */ "../app/assets/js/molecules/elementor-loading.js"));
2365 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
2366 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
2367 function UploadAndInstallPro() {
2368 (0, _usePageTitle.default)({
2369 title: __('Upload and Install Elementor Pro', 'elementor')
2370 });
2371 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
2372 state = _useContext.state,
2373 _useAjax = (0, _useAjax2.default)(),
2374 installProZipAjaxState = _useAjax.ajaxState,
2375 setInstallProZipAjaxState = _useAjax.setAjax,
2376 _useState = (0, _react.useState)(null),
2377 _useState2 = (0, _slicedToArray2.default)(_useState, 2),
2378 noticeState = _useState2[0],
2379 setNoticeState = _useState2[1],
2380 _useState3 = (0, _react.useState)(false),
2381 _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
2382 isLoading = _useState4[0],
2383 setIsLoading = _useState4[1],
2384 _useState5 = (0, _react.useState)(),
2385 _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
2386 fileSource = _useState6[0],
2387 setFileSource = _useState6[1];
2388 var uploadProZip = (0, _react.useCallback)(function (file) {
2389 setIsLoading(true);
2390 setInstallProZipAjaxState({
2391 data: {
2392 action: 'elementor_upload_and_install_pro',
2393 fileToUpload: file
2394 }
2395 });
2396 }, []);
2397 var setErrorNotice = function setErrorNotice() {
2398 var error = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
2399 var step = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'upload';
2400 var errorMessage = (error === null || error === void 0 ? void 0 : error.message) || 'That didn\'t work. Try uploading your file again.';
2401 elementorCommon.events.dispatchEvent({
2402 event: 'indication prompt',
2403 version: '',
2404 details: {
2405 placement: elementorAppConfig.onboarding.eventPlacement,
2406 step: state.currentStep,
2407 action_state: 'failure',
2408 action: step + ' pro',
2409 source: fileSource
2410 }
2411 });
2412 setNoticeState({
2413 type: 'error',
2414 icon: 'eicon-warning',
2415 message: errorMessage
2416 });
2417 };
2418
2419 /**
2420 * Ajax Callbacks
2421 */
2422 // Run the callback that runs when the Pro Upload Ajax returns a response.
2423 (0, _react.useEffect)(function () {
2424 if ('initial' !== installProZipAjaxState.status) {
2425 var _installProZipAjaxSta;
2426 setIsLoading(false);
2427 if ('success' === installProZipAjaxState.status && (_installProZipAjaxSta = installProZipAjaxState.response) !== null && _installProZipAjaxSta !== void 0 && _installProZipAjaxSta.elementorProInstalled) {
2428 elementorCommon.events.dispatchEvent({
2429 event: 'pro uploaded',
2430 version: '',
2431 details: {
2432 placement: elementorAppConfig.onboarding.eventPlacement,
2433 step: state.currentStep,
2434 source: fileSource
2435 }
2436 });
2437 if (opener && opener !== window) {
2438 opener.jQuery('body').trigger('elementor/upload-and-install-pro/success');
2439 window.close();
2440 opener.focus();
2441 }
2442 } else if ('error' === installProZipAjaxState.status) {
2443 setErrorNotice('install');
2444 }
2445 }
2446 }, [installProZipAjaxState.status]);
2447 var onProUploadHelpLinkClick = function onProUploadHelpLinkClick() {
2448 elementorCommon.events.dispatchEvent({
2449 event: 'pro plugin upload help',
2450 version: '',
2451 details: {
2452 placement: elementorAppConfig.onboarding.eventPlacement,
2453 step: state.currentStep
2454 }
2455 });
2456 };
2457 if (isLoading) {
2458 return /*#__PURE__*/_react.default.createElement(_elementorLoading.default, {
2459 loadingText: __('Uploading', 'elementor')
2460 });
2461 }
2462 return /*#__PURE__*/_react.default.createElement("div", {
2463 className: "eps-app e-onboarding__upload-pro"
2464 }, /*#__PURE__*/_react.default.createElement(_content.default, null, /*#__PURE__*/_react.default.createElement(_dropZone.default, {
2465 className: "e-onboarding__upload-pro-drop-zone",
2466 onFileSelect: function onFileSelect(file, event, source) {
2467 setFileSource(source);
2468 uploadProZip(file);
2469 },
2470 onError: function onError(error) {
2471 return setErrorNotice(error, 'upload');
2472 },
2473 filetypes: ['zip'],
2474 buttonColor: "cta",
2475 buttonVariant: "contained",
2476 heading: __('Import your Elementor Pro plugin file', 'elementor'),
2477 text: __('Drag & Drop your .zip file here', 'elementor'),
2478 secondaryText: __('or', 'elementor'),
2479 buttonText: __('Browse', 'elementor')
2480 }), noticeState && /*#__PURE__*/_react.default.createElement(_notice.default, {
2481 noticeState: noticeState
2482 }), /*#__PURE__*/_react.default.createElement("div", {
2483 className: "e-onboarding__upload-pro-get-file"
2484 }, __('Don\'t know where to get the file from?', 'elementor') + ' ', /*#__PURE__*/_react.default.createElement("a", {
2485 onClick: function onClick() {
2486 return onProUploadHelpLinkClick();
2487 },
2488 href: 'https://my.elementor.com/subscriptions/' + elementorAppConfig.onboarding.utms.downloadPro,
2489 target: "_blank"
2490 }, __('Click here', 'elementor')))));
2491 }
2492
2493 /***/ }),
2494
2495 /***/ "../app/modules/onboarding/assets/js/utils/connect.js":
2496 /*!************************************************************!*\
2497 !*** ../app/modules/onboarding/assets/js/utils/connect.js ***!
2498 \************************************************************/
2499 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
2500
2501 /* provided dependency */ var PropTypes = __webpack_require__(/*! prop-types */ "../node_modules/prop-types/index.js");
2502
2503
2504 Object.defineProperty(exports, "__esModule", ({
2505 value: true
2506 }));
2507 exports["default"] = Connect;
2508 var _react = __webpack_require__(/*! react */ "react");
2509 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
2510 function Connect(props) {
2511 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
2512 state = _useContext.state,
2513 updateState = _useContext.updateState,
2514 getStateObjectToUpdate = _useContext.getStateObjectToUpdate;
2515 var connectSuccessCallback = function connectSuccessCallback(data) {
2516 var stateToUpdate = getStateObjectToUpdate(state, 'steps', 'account', 'completed');
2517 elementorCommon.config.library_connect.is_connected = true;
2518 elementorCommon.config.library_connect.current_access_level = data.kits_access_level || data.access_level || 0;
2519 elementorCommon.config.library_connect.current_access_tier = data.access_tier;
2520 stateToUpdate.isLibraryConnected = true;
2521 updateState(stateToUpdate);
2522 };
2523 (0, _react.useEffect)(function () {
2524 jQuery(props.buttonRef.current).elementorConnect({
2525 success: function success(data) {
2526 return props.successCallback ? props.successCallback(data) : connectSuccessCallback(data);
2527 },
2528 error: function error() {
2529 if (props.errorCallback) {
2530 props.errorCallback();
2531 }
2532 },
2533 popup: {
2534 width: 726,
2535 height: 534
2536 }
2537 });
2538 }, []);
2539 return null;
2540 }
2541 Connect.propTypes = {
2542 buttonRef: PropTypes.object.isRequired,
2543 successCallback: PropTypes.func,
2544 errorCallback: PropTypes.func
2545 };
2546
2547 /***/ }),
2548
2549 /***/ "../app/modules/onboarding/assets/js/utils/use-button-action.js":
2550 /*!**********************************************************************!*\
2551 !*** ../app/modules/onboarding/assets/js/utils/use-button-action.js ***!
2552 \**********************************************************************/
2553 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
2554
2555
2556
2557 Object.defineProperty(exports, "__esModule", ({
2558 value: true
2559 }));
2560 exports["default"] = useButtonAction;
2561 var _react = __webpack_require__(/*! react */ "react");
2562 var _context = __webpack_require__(/*! ../context/context */ "../app/modules/onboarding/assets/js/context/context.js");
2563 var _router = __webpack_require__(/*! @reach/router */ "../node_modules/@reach/router/es/index.js");
2564 function useButtonAction(pageId, nextPage) {
2565 var _useContext = (0, _react.useContext)(_context.OnboardingContext),
2566 state = _useContext.state,
2567 updateState = _useContext.updateState,
2568 getStateObjectToUpdate = _useContext.getStateObjectToUpdate;
2569 var navigate = (0, _router.useNavigate)();
2570 var handleAction = function handleAction(action) {
2571 var stateToUpdate = getStateObjectToUpdate(state, 'steps', pageId, action);
2572 updateState(stateToUpdate);
2573 navigate('onboarding/' + nextPage);
2574 };
2575 return {
2576 state: state,
2577 handleAction: handleAction
2578 };
2579 }
2580
2581 /***/ }),
2582
2583 /***/ "../app/modules/onboarding/assets/js/utils/utils.js":
2584 /*!**********************************************************!*\
2585 !*** ../app/modules/onboarding/assets/js/utils/utils.js ***!
2586 \**********************************************************/
2587 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
2588
2589 /* provided dependency */ var __ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n")["__"];
2590
2591
2592 var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "../node_modules/@babel/runtime/helpers/interopRequireDefault.js");
2593 Object.defineProperty(exports, "__esModule", ({
2594 value: true
2595 }));
2596 exports.setSelectedFeatureList = exports.options = void 0;
2597 var _toConsumableArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/toConsumableArray */ "../node_modules/@babel/runtime/helpers/toConsumableArray.js"));
2598 var _defineProperty2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ "../node_modules/@babel/runtime/helpers/defineProperty.js"));
2599 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
2600 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2601 /**
2602 * Checkboxes data.
2603 */
2604 var options = exports.options = [{
2605 plan: 'essential',
2606 text: __('Templates & Theme Builder', 'elementor')
2607 }, {
2608 plan: 'advanced',
2609 text: __('WooCommerce Builder', 'elementor')
2610 }, {
2611 plan: 'essential',
2612 text: __('Lead Collection & Form Builder', 'elementor')
2613 }, {
2614 plan: 'essential',
2615 text: __('Dynamic Content', 'elementor')
2616 }, {
2617 plan: 'advanced',
2618 text: __('Popup Builder', 'elementor')
2619 }, {
2620 plan: 'advanced',
2621 text: __('Custom Code & CSS', 'elementor')
2622 }, {
2623 plan: 'essential',
2624 text: __('Motion Effects & Animations', 'elementor')
2625 }, {
2626 plan: 'advanced',
2627 text: __('Notes & Collaboration', 'elementor')
2628 }];
2629
2630 /**
2631 * Set the selected feature list.
2632 * @param {Object} param0
2633 * @param {boolean} param0.checked
2634 * @param {string} param0.id
2635 * @param {string} param0.text
2636 * @param {Object} param0.selectedFeatures
2637 * @param {Function} param0.setSelectedFeatures
2638 */
2639 var setSelectedFeatureList = exports.setSelectedFeatureList = function setSelectedFeatureList(_ref) {
2640 var checked = _ref.checked,
2641 id = _ref.id,
2642 text = _ref.text,
2643 selectedFeatures = _ref.selectedFeatures,
2644 setSelectedFeatures = _ref.setSelectedFeatures;
2645 var tier = id.split('-')[0];
2646 if (checked) {
2647 setSelectedFeatures(_objectSpread(_objectSpread({}, selectedFeatures), {}, (0, _defineProperty2.default)({}, tier, [].concat((0, _toConsumableArray2.default)(selectedFeatures[tier]), [text]))));
2648 } else {
2649 setSelectedFeatures(_objectSpread(_objectSpread({}, selectedFeatures), {}, (0, _defineProperty2.default)({}, tier, selectedFeatures[tier].filter(function (item) {
2650 return item !== text;
2651 }))));
2652 }
2653 };
2654
2655 /***/ })
2656
2657 }]);
2658 //# sourceMappingURL=onboarding.bb53949526c949ea5365.bundle.js.map