admin_welcome_v2.js 17.1 KB
/*! For license information please see admin_welcome_v2.js.LICENSE.txt */
(()=>{var e={4184:(e,t)=>{var n;!function(){"use strict";var i={}.hasOwnProperty;function l(){for(var e=[],t=0;t<arguments.length;t++){var n=arguments[t];if(n){var o=typeof n;if("string"===o||"number"===o)e.push(n);else if(Array.isArray(n)){if(n.length){var a=l.apply(null,n);a&&e.push(a)}}else if("object"===o)if(n.toString===Object.prototype.toString)for(var s in n)i.call(n,s)&&n[s]&&e.push(s);else e.push(n.toString())}}return e.join(" ")}e.exports?(l.default=l,e.exports=l):void 0===(n=function(){return l}.apply(t,[]))||(e.exports=n)}()},7418:e=>{"use strict";var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;function l(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var i={};return"abcdefghijklmnopqrst".split("").forEach((function(e){i[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},i)).join("")}catch(e){return!1}}()?Object.assign:function(e,o){for(var a,s,r=l(e),c=1;c<arguments.length;c++){for(var u in a=Object(arguments[c]))n.call(a,u)&&(r[u]=a[u]);if(t){s=t(a);for(var d=0;d<s.length;d++)i.call(a,s[d])&&(r[s[d]]=a[s[d]])}}return r}},2408:(e,t,n)=>{"use strict";var i=n(7418);if("function"==typeof Symbol&&Symbol.for){var l=Symbol.for;l("react.element"),l("react.portal"),l("react.fragment"),l("react.strict_mode"),l("react.profiler"),l("react.provider"),l("react.context"),l("react.forward_ref"),l("react.suspense"),l("react.memo"),l("react.lazy")}"function"==typeof Symbol&&Symbol.iterator;function o(e){for(var t="https://reactjs.org/docs/error-decoder.html?invariant="+e,n=1;n<arguments.length;n++)t+="&args[]="+encodeURIComponent(arguments[n]);return"Minified React error #"+e+"; visit "+t+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings."}var a={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},s={};function r(e,t,n){this.props=e,this.context=t,this.refs=s,this.updater=n||a}function c(){}function u(e,t,n){this.props=e,this.context=t,this.refs=s,this.updater=n||a}r.prototype.isReactComponent={},r.prototype.setState=function(e,t){if("object"!=typeof e&&"function"!=typeof e&&null!=e)throw Error(o(85));this.updater.enqueueSetState(this,e,t,"setState")},r.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,"forceUpdate")},c.prototype=r.prototype;var d=u.prototype=new c;d.constructor=u,i(d,r.prototype),d.isPureReactComponent=!0;Object.prototype.hasOwnProperty},7294:(e,t,n)=>{"use strict";n(2408)}},t={};function n(i){var l=t[i];if(void 0!==l)return l.exports;var o=t[i]={exports:{}};return e[i](o,o.exports,n),o.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var i in t)n.o(t,i)&&!n.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{"use strict";const e=wp.element,t=wp.i18n,i=stackable,l={"ugb/accordion":{title:(0,t._x)("Accordion","block title",i.i18n)},"ugb/text":{title:(0,t._x)("Advanced Text","block title",i.i18n)},"ugb/heading":{title:(0,t._x)("Advanced Heading","block title",i.i18n)},"ugb/blockquote":{title:(0,t._x)("Blockquote","block title",i.i18n)},"ugb/blog-posts":{title:(0,t._x)("Blog Posts","block title",i.i18n)},"ugb/button":{title:(0,t._x)("Button","block title",i.i18n)},"ugb/cta":{title:(0,t._x)("Call to Action","block title",i.i18n)},"ugb/card":{title:(0,t._x)("Card","block title",i.i18n)},"ugb/columns":{title:(0,t._x)("Columns","block title",i.i18n)},"ugb/container":{title:(0,t._x)("Container","block title",i.i18n)},"ugb/count-up":{title:(0,t._x)("Count Up","block title",i.i18n)},"ugb/divider":{title:(0,t._x)("Divider","block title",i.i18n)},"ugb/expand":{title:(0,t._x)("Expand / Show More","block title",i.i18n)},"ugb/feature-grid":{title:(0,t._x)("Feature Grid","block title",i.i18n)},"ugb/feature":{title:(0,t._x)("Feature","block title",i.i18n)},"ugb/header":{title:(0,t._x)("Header","block title",i.i18n)},"ugb/icon":{title:(0,t._x)("Icon","block title",i.i18n)},"ugb/icon-list":{title:(0,t._x)("Icon List","block title",i.i18n)},"ugb/image-box":{title:(0,t._x)("Image Box","block title",i.i18n)},"ugb/notification":{title:(0,t._x)("Notification","block title",i.i18n)},"ugb/number-box":{title:(0,t._x)("Number Box","block title",i.i18n)},"ugb/pricing-box":{title:(0,t._x)("Pricing Box","block title",i.i18n)},"ugb/separator":{title:(0,t._x)("Separator","block title",i.i18n)},"ugb/spacer":{title:(0,t._x)("Spacer","block title",i.i18n)},"ugb/team-member":{title:(0,t._x)("Team Member","block title",i.i18n)},"ugb/testimonial":{title:(0,t._x)("Testimonial","block title",i.i18n)},"ugb/video-popup":{title:(0,t._x)("Video Popup","block title",i.i18n)}};function o(){return o=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(e[i]=n[i])}return e},o.apply(this,arguments)}n(7294);const a=function(t){return(0,e.createElement)("svg",o({fill:"none",xmlns:"http://www.w3.org/2000/svg"},t),(0,e.createElement)("path",{d:"M88 44.32V48a40 40 0 11-23.72-36.56",stroke:"#3CA540",strokeWidth:7,strokeLinecap:"round",strokeLinejoin:"round"}),(0,e.createElement)("path",{d:"M88 16L48 56.04l-12-12",stroke:"#3CA540",strokeWidth:7,strokeLinecap:"round",strokeLinejoin:"round"}))};var s=n(4184),r=n.n(s);let c=1;const u=t=>{const[n]=(0,e.useState)("ugb-admin-setting-"+c++),i=r()(["ugb-admin-setting"],{[`ugb-admin-setting--${t.size}`]:t.size});return(0,e.createElement)("div",{className:i,id:n},(0,e.createElement)("label",{className:"ugb-admin-setting__label-wrapper",htmlFor:n,onClick:t.onClick},!!t.label&&(0,e.createElement)("span",{className:"ugb-admin-setting__label"},t.label),(0,e.createElement)("div",{className:"ugb-admin-setting__field"},t.children)),t.help&&(0,e.createElement)("p",{className:"ugb-admin-setting__help"},t.help))};u.defaultProps={label:"",onClick:()=>{}};const d=u,b=t=>{const n=(0,e.createRef)();return(0,e.createElement)(d,o({onClick:e=>{t.onChange(!t.value),e.preventDefault(),n.current.focus()}},t),(0,e.createElement)("button",{ref:n,className:"ugb-admin-toggle-setting__button",type:"button",role:"switch","aria-checked":!!t.value,onClick:e=>{t.onChange(!t.value),e.preventDefault(),e.stopPropagation()},style:{minWidth:t.width||void 0},disabled:t.isDisabled?"disabled":""},(0,e.createElement)("span",null,t.disabled),(0,e.createElement)("span",null,t.enabled)))};b.defaultProps={label:"",value:!1,placeholder:"",onChange:()=>{},disabled:(0,t.__)("Disabled",i.i18n),enabled:(0,t.__)("Enabled",i.i18n),width:"",isDisabled:!1};const m=b,p=wp.hooks,_=wp.api,g=wp.components;(0,p.addFilter)("stackable.welcome-wizard.steps","stackable/v2",(e=>{const n=[...e].filter((e=>"welcome"!==e.id));return i.v2optimizationScriptLoad||n.unshift({id:"v2-optimize",label:(0,t.__)("Optimization",i.i18n),component:v}),n.unshift({id:"v2-migration",label:(0,t.__)("Migration",i.i18n),component:f}),n.unshift({id:"v2-welcome",label:(0,t.__)("Welcome to V3",i.i18n),component:h}),n}));const h=()=>(0,e.createElement)(e.Fragment,null,(0,e.createElement)("div",{className:"s-welcome-wizard__content s-box"},(0,e.createElement)("h2",null,(0,t.__)("Thanks for Updating to Stackable V3",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("There are huge changes in Stackable, and this wizard will help you get started with migrating to the new version.",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("We've made upgrading as smooth and hassle free as possible, click on the Get Started button at the lower right to move to the next step.",i.i18n)),(0,e.createElement)("h2",null,(0,t.__)("What’s New in Version 3",i.i18n)),(0,e.createElement)("ul",null,(0,e.createElement)("li",null,(0,t.__)("Unbelievably lightweight, faster performance, focus on core web vitals and accessibility",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("Completely new way to use Stackable blocks",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("Advanced Columns which are immensely responsive (you can control how they collapse in tablet and mobile)",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("Style blocks when they're hovered",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("Stackable Custom Fields (premium)",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("Use Dynamic Content in images, buttons, and other content (premium)",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("Motion Effects (premium)",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("Conditionally Display blocks (premium)",i.i18n)),(0,e.createElement)("li",null,(0,t.__)("and more!",i.i18n)))));let k=i.wizard.stackable_v2_editor_compatibility_usage?1:i.wizard.stackable_v2_editor_compatibility?2:3;const f=()=>{const[n,l]=(0,e.useState)(k),[o,s]=(0,e.useState)(!1);(0,e.useEffect)((()=>{k=n}),[n]);const c=(0,e.useCallback)((e=>{let t={};1===e?t={stackable_v2_editor_compatibility:"",stackable_v2_editor_compatibility_usage:"1",stackable_v2_frontend_compatibility:"1"}:2===e?t={stackable_v2_editor_compatibility:"1",stackable_v2_editor_compatibility_usage:"",stackable_v2_frontend_compatibility:"1"}:3===e&&(t={stackable_v2_editor_compatibility:"",stackable_v2_editor_compatibility_usage:"",stackable_v2_frontend_compatibility:"1"}),new _.models.Settings(t).save().then((()=>s(!1))),s(!0)}),[s]),u=(0,e.createElement)(a,{height:"40",width:"40",viewBox:"0 0 96 96",className:"s-welcome-wizard__option-check-icon"});return(0,e.createElement)(e.Fragment,null,(0,e.createElement)("div",{className:"s-welcome-wizard__content"},(0,e.createElement)("h2",null,(0,t.__)("Migrating to the New Stackable Blocks",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("Stackable V3 provides NEW blocks which are more flexible, more powerful and faster. These new blocks are meant to replace the old V2 blocks.",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("Not to worry, version 3 is fully backward compatible with version 2, all your existing blocks should work fine, and you don't have to rebuild any of your web pages!",i.i18n)),(0,e.createElement)("h2",null,(0,t.__)("How would you like to transition your Editor workflow when editing your pages?",i.i18n)," ",(0,e.createElement)("a",{href:"https://docs.wpstackable.com/article/462-migrating-from-version-2-to-version-3?utm_source=wp-settings-wizard&utm_campaign=learnmore&utm_medium=wp-dashboard",target:"_docs"},(0,t.__)("Learn more about migrating from V2 to V3",i.i18n))),(0,e.createElement)("div",{className:"s-welcome-wizard__options s-welcome-wizard__migration"},(0,e.createElement)("div",{className:r()("s-welcome-wizard__option s-box",{"s--selected":1===n}),onClick:()=>{l(1),c(1)},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||e.target.click(),"ArrowRight"===e.key&&(e.target.nextElementSibling.focus(),e.target.nextElementSibling.click())},role:"button",tabIndex:"0"},1===n&&u,(0,e.createElement)("p",{className:"s-welcome-wizard__option-subtitle"},(0,t.sprintf)((0,t._x)("Option %s","Option number",i.i18n),1)),(0,e.createElement)("h3",null,(0,t.__)("Use Old V2 Blocks, but Only When Editing Existing Posts",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("Enable old V2 blocks in the Editor when editing posts that previously had old V2 blocks. For new posts, only use the new V3 blocks.",i.i18n))),(0,e.createElement)("div",{className:r()("s-welcome-wizard__option s-box",{"s--selected":2===n}),onClick:()=>{l(2),c(2)},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||e.target.click(),"ArrowRight"===e.key?(e.target.nextElementSibling.focus(),e.target.nextElementSibling.click()):"ArrowLeft"===e.key&&(e.target.previousElementSibling.focus(),e.target.previousElementSibling.click())},role:"button",tabIndex:"0"},2===n&&u,(0,e.createElement)("p",{className:"s-welcome-wizard__option-subtitle"},(0,t.sprintf)((0,t._x)("Option %s","Option number",i.i18n),2)),(0,e.createElement)("h3",null,(0,t.__)("Use Both New V3 and Old V2 Blocks",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("Always allow adding of both v2 and v3 blocks in the Editor, even in new posts.",i.i18n))),(0,e.createElement)("div",{className:r()("s-welcome-wizard__option s-box",{"s--selected":3===n}),onClick:()=>{l(3),c(3)},onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||e.target.click(),"ArrowLeft"===e.key&&(e.target.previousElementSibling.focus(),e.target.previousElementSibling.click())},role:"button",tabIndex:"0"},3===n&&u,(0,e.createElement)("p",{className:"s-welcome-wizard__option-subtitle"},(0,t.sprintf)((0,t._x)("Option %s","Option number",i.i18n),3)),(0,e.createElement)("h3",null,(0,t.__)("Use New V3 Blocks Only",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("Only allow adding of the new v3 blocks in the Editor. Old v2 blocks will no longer work in the Editor, but they will still work fine in your frontend.",i.i18n))))),o&&(0,e.createElement)(g.Spinner,{className:"s-wizard-spinner"}))};let w=i.v2optimizationScriptLoad;const v=()=>{const[n,l]=(0,e.useState)(w),[o,a]=(0,e.useState)(!1);(0,e.useEffect)((()=>{w=n}),[n]);const s=(0,e.useCallback)((e=>{new _.models.Settings({stackable_optimize_script_load:e}).save().then((()=>a(!1))),a(!0)}),[a]);return(0,e.createElement)(e.Fragment,null,(0,e.createElement)("div",{className:"s-welcome-wizard__content s-box"},(0,e.createElement)("h2",null,(0,t.__)("Optimization Settings",i.i18n)),(0,e.createElement)("p",null,(0,t.__)("We recommend that you turn on the Optimization Setting for v2, so that old v2 styles and scripts would only get loaded when v2 blocks are present in the post. This will ensure your website loads fast even with version 2 backward compatibility enabled",i.i18n)),(0,e.createElement)("h2",null,(0,t.__)("Please enable the option below",i.i18n)),(0,e.createElement)(m,{label:(0,t.__)("Frontend JS & CSS Files",i.i18n),value:n,onChange:e=>{l(e),s(e)},disabled:(0,t.__)("Load across entire site",i.i18n),enabled:(0,t.__)("Load only in posts with Stackable blocks",i.i18n)}),(0,e.createElement)("br",null)),o&&(0,e.createElement)(g.Spinner,{className:"s-wizard-spinner"}))},y=wp.ajax;class E extends e.Component{constructor(){super(...arguments),this.toggleBlock=this.toggleBlock.bind(this),this.enableAllBlocks=this.enableAllBlocks.bind(this),this.disableAllBlocks=this.disableAllBlocks.bind(this),this.ajaxTimeout=null,this.state={disabledBlocks:this.props.disabledBlocks||[],isSaving:!1}}componentDidUpdate(e,t){this.state.disabledBlocks!==t.disabledBlocks&&(clearTimeout(this.ajaxTimeout),this.ajaxTimeout=setTimeout((()=>{(0,y.send)("stackable_update_disable_blocks_v2",{success:()=>{this.setState({isSaving:!1})},error:e=>{this.setState({isSaving:!1}),alert(e)},data:{nonce:i.v2nonce,disabledBlocks:this.state.disabledBlocks}}),this.setState({isSaving:!0})}),600))}toggleBlock(e){this.state.disabledBlocks.includes(e)?this.setState({disabledBlocks:this.state.disabledBlocks.filter((t=>t!==e))}):this.setState({disabledBlocks:[...this.state.disabledBlocks,e]})}enableAllBlocks(){this.setState({disabledBlocks:[]})}disableAllBlocks(){this.setState({disabledBlocks:Object.keys(this.props.blocks)})}render(){const{blocks:n}=this.props;return(0,e.createElement)("div",null,(0,e.createElement)("div",{className:"s-settings-header"},this.state.isSaving&&(0,e.createElement)(g.Spinner,null),(0,e.createElement)("button",{onClick:this.enableAllBlocks,className:"button button-large button-link"},(0,t.__)("Enable All",i.i18n)),(0,e.createElement)("button",{onClick:this.disableAllBlocks,className:"button button-large button-link"},(0,t.__)("Disable All",i.i18n))),(0,e.createElement)("div",{className:"s-settings-grid"},Object.keys(n).map(((l,o)=>{const a=n[l];if(a.sDeprecated)return null;const s=this.state.disabledBlocks.includes(l),c=r()(["s-block"],{"s-is-disabled":s});return(0,e.createElement)("div",{key:o+1,className:c},(0,e.createElement)("h4",null,(0,t.__)(a.title,i.i18n)," ",(0,e.createElement)("span",{className:"s-tag-v2"},"(V2)")),(0,e.createElement)("button",{className:"s-toggle-button",onClick:()=>this.toggleBlock(l)},(0,e.createElement)("span",null,(0,t.__)("Disabled",i.i18n)),(0,e.createElement)("span",null,(0,t.__)("Enabled",i.i18n))))}))))}}const S=()=>{const[n,l]=(0,e.useState)(!1);return(0,e.useEffect)((()=>{_.loadPromise.then((()=>{(new _.models.Settings).fetch().then((e=>{l(!!e.stackable_optimize_script_load)}))}))}),[]),(0,e.createElement)(e.Fragment,null,(0,e.createElement)(m,{label:(0,t.__)("Frontend JS & CSS Files",i.i18n),value:n,onChange:e=>{new _.models.Settings({stackable_optimize_script_load:e}).save(),l(e)},disabled:(0,t.__)("Load across entire site",i.i18n),enabled:(0,t.__)("Load only in posts with Stackable blocks",i.i18n)}))};var x;x=()=>{document.querySelector(".s-settings-wrapper-v2")&&(0,e.render)((0,e.createElement)(E,{blocks:l,disabledBlocks:i.v2disabledBlocks}),document.querySelector(".s-settings-wrapper-v2")),document.querySelector(".s-optimization-settings")&&(0,e.render)((0,e.createElement)(S,null),document.querySelector(".s-optimization-settings"))},"undefined"!=typeof document&&("complete"!==document.readyState&&"interactive"!==document.readyState?document.addEventListener("DOMContentLoaded",x):x())})()})();