← All changes | assets/js/packages/editor-widget-creation/editor-widget-creation.js +236 -2 4.1.2 → 4.3.2 View file →

		@@ -1,3 +1,237 @@
1		-/*! For license information please see editor-widget-creation.js.LICENSE.txt */
2		-!function(){"use strict";var e={"./packages/packages/core/editor-widget-creation/src/components/create-widget.tsx":function(e,t,n){n.r(t),n.d(t,{CreateWidget:function(){return CreateWidget}});var r=n("react"),o=n("@elementor/editor-mcp"),i=n("@elementor/editor-ui"),a=n("@elementor/events"),l=n("@elementor/icons"),c=n("@elementor/ui"),s=n("@wordpress/i18n");const d="elementor/editor/create-widget",_="https://assets.elementor.com/packages/v1/images/angie-modal-promotion.png",m="ai_widget_cta_clicked",u="angie_install_started",p="angie_install_completed",g="angie_install_abandoned";function CreateWidgetModal({prompt:e,entryPoint:t,onClose:n}){const[d,m]=(0,r.useState)("idle"),[w,f]=(0,r.useState)(!1),handleClose=()=>{"installing"!==d&&((0,a.trackEvent)({eventName:g,abandon_step:"error"===d?"install_error":"install_modal",trigger_source:t}),n())};return r.createElement(i.ThemeProvider,null,r.createElement(c.Dialog,{fullWidth:!0,maxWidth:"md",open:!0,onClose:handleClose},r.createElement(c.IconButton,{"aria-label":(0,s.__)("Close","elementor"),onClick:handleClose,sx:{position:"absolute",right:8,top:8,zIndex:1}},r.createElement(l.XIcon,null)),r.createElement(c.DialogContent,{sx:{p:0,overflow:"hidden"}},r.createElement(c.Stack,{direction:"row",sx:{height:400}},r.createElement(c.Image,{sx:{height:"100%",aspectRatio:"1 / 1",objectFit:"cover",objectPosition:"right center"},src:_}),r.createElement(c.Stack,{justifyContent:"space-between",p:4},r.createElement(c.Stack,{gap:2.5,justifyContent:"center",sx:{flex:1,paddingInlineEnd:2.5}},r.createElement(c.Typography,{variant:"h4",fontWeight:600,color:"text.secondary"},"error"===d?(0,s.__)("Installation failed","elementor"):(0,s.__)("Create custom widgets with Angie","elementor")),r.createElement(c.Typography,{variant:"body2"},"error"===d?(0,s.__)("We couldn't install Angie automatically. Click below to install it manually.","elementor"):(0,s.__)("Build custom widgets, sections, and code using simple instructions. Install once to start building directly from the editor.","elementor")),"error"!==d&&r.createElement(c.FormControlLabel,{control:r.createElement(c.Checkbox,{size:"small",checked:w,onChange:(e,t)=>f(t)}),label:r.createElement(c.Typography,{variant:"body2",color:"text.secondary"},(0,s.__)("I agree to the","elementor"),r.createElement(c.Link,{sx:{px:.5},href:"https://elementor.com/terms/angie-terms-conditions/",target:"_blank",rel:"noopener noreferrer"},(0,s.__)("Terms","elementor")),(0,s.__)("&","elementor"),r.createElement(c.Link,{sx:{px:.5},href:"https://elementor.com/about/privacy/",target:"_blank",rel:"noopener noreferrer"},(0,s.__)("Privacy Policy.","elementor")))})),r.createElement(c.Stack,{direction:"row",justifyContent:"flex-end"},"error"===d?r.createElement(c.Button,{variant:"contained",color:"accent",onClick:()=>{(0,o.redirectToInstallation)(e)}},(0,s.__)("Install Manually","elementor")):r.createElement(c.Button,{variant:"contained",color:"accent",onClick:async()=>{m("installing"),(0,a.trackEvent)({eventName:u,trigger_source:t});const[n]=await Promise.all([(0,o.installAngiePlugin)(),(0,o.saveAngieConsent)()]);n.success?((0,a.trackEvent)({eventName:p,trigger_source:t}),(0,o.redirectToAppAdmin)(e)):m("error")},disabled:"installing"===d||!w,startIcon:"installing"===d?r.createElement(c.CircularProgress,{size:18,color:"inherit"}):void 0},"installing"===d?(0,s.__)("Installing…","elementor"):(0,s.__)("Install & Activate","elementor"))))))))}function CreateWidget(){const[e,t]=(0,r.useState)(null);return(0,r.useEffect)(()=>{const handleShow=e=>{const n=e,r=(0,o.isAngieAvailable)();(0,a.trackEvent)({eventName:m,entry_point:n.detail.entry_point,has_angie_installed:r}),r?(0,o.sendPromptToAngie)(n.detail?.prompt):t(n.detail)};return window.addEventListener(d,handleShow),()=>{window.removeEventListener(d,handleShow)}},[]),e?r.createElement(CreateWidgetModal,{prompt:e.prompt,entryPoint:e.entry_point,onClose:()=>t(null)}):null}},"./packages/packages/core/editor-widget-creation/src/init.ts":function(e,t,n){n.r(t),n.d(t,{init:function(){return init}});var r=n("@elementor/editor"),o=n("./packages/packages/core/editor-widget-creation/src/components/create-widget.tsx");function init(){(0,r.injectIntoTop)({id:"create-widget",component:o.CreateWidget})}},"@elementor/editor":function(e){e.exports=window.elementorV2.editor},"@elementor/editor-mcp":function(e){e.exports=window.elementorV2.editorMcp},"@elementor/editor-ui":function(e){e.exports=window.elementorV2.editorUi},"@elementor/events":function(e){e.exports=window.elementorV2.events},"@elementor/icons":function(e){e.exports=window.elementorV2.icons},"@elementor/ui":function(e){e.exports=window.elementorV2.ui},"@wordpress/i18n":function(e){e.exports=window.wp.i18n},react:function(e){e.exports=window.React}},t={};function __webpack_require__(n){var r=t[n];if(void 0!==r)return r.exports;var o=t[n]={exports:{}};return e[n](o,o.exports,__webpack_require__),o.exports}__webpack_require__.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return __webpack_require__.d(t,{a:t}),t},__webpack_require__.d=function(e,t){for(var n in t)__webpack_require__.o(t,n)&&!__webpack_require__.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},__webpack_require__.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},__webpack_require__.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};!function(){__webpack_require__.r(n),__webpack_require__.d(n,{init:function(){return e.init}});var e=__webpack_require__("./packages/packages/core/editor-widget-creation/src/init.ts")}(),(window.elementorV2=window.elementorV2||{}).editorWidgetCreation=n}(),window.elementorV2.editorWidgetCreation?.init?.();
	1	+(function(_elementor_editor, react, _elementor_editor_mcp, _elementor_editor_ui, _elementor_events, _elementor_icons, _elementor_ui, _wordpress_i18n) {
	2	+
	3	+//#region \0rolldown/runtime.js
	4	+ var __create = Object.create;
	5	+ var __defProp = Object.defineProperty;
	6	+ var __name = (target, value) => __defProp(target, "name", {
	7	+ value,
	8	+ configurable: true
	9	+ });
	10	+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
	11	+ var __getOwnPropNames = Object.getOwnPropertyNames;
	12	+ var __getProtoOf = Object.getPrototypeOf;
	13	+ var __hasOwnProp = Object.prototype.hasOwnProperty;
	14	+ var __exportAll = (all, no_symbols) => {
	15	+ let target = {};
	16	+ for (var name in all) {
	17	+ __defProp(target, name, {
	18	+ get: all[name],
	19	+ enumerable: true
	20	+ });
	21	+ }
	22	+ if (!no_symbols) {
	23	+ __defProp(target, Symbol.toStringTag, { value: "Module" });
	24	+ }
	25	+ return target;
	26	+ };
	27	+ var __copyProps = (to, from, except, desc) => {
	28	+ if (from && typeof from === "object" || typeof from === "function") {
	29	+ for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
	30	+ key = keys[i];
	31	+ if (!__hasOwnProp.call(to, key) && key !== except) {
	32	+ __defProp(to, key, {
	33	+ get: ((k) => from[k]).bind(null, key),
	34	+ enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
	35	+ });
	36	+ }
	37	+ }
	38	+ }
	39	+ return to;
	40	+ };
	41	+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
	42	+ value: mod,
	43	+ enumerable: true
	44	+ }) : target, mod));
	45	+
	46	+//#endregion
	47	+react = __toESM(react);
	48	+
	49	+//#region packages/packages/core/editor-widget-creation/src/interpolate-links.tsx
	50	+ var LINK_PLACEHOLDER_PATTERN = /\{\{(\w+)}}/g;
	51	+ var interpolateLinks = (text, links) => {
	52	+ return text.split(LINK_PLACEHOLDER_PATTERN).map((part, i) => {
	53	+ const link = links[part];
	54	+ if (!link) return part;
	55	+ return /* @__PURE__ */ react.createElement(_elementor_ui.Link, {
	56	+ key: i,
	57	+ sx: { px: .5 },
	58	+ href: link.href,
	59	+ target: "_blank",
	60	+ rel: "noopener noreferrer"
	61	+ }, link.label);
	62	+ });
	63	+ };
	64	+
	65	+//#endregion
	66	+//#region packages/packages/core/editor-widget-creation/src/components/create-widget.tsx
	67	+ var CREATE_WIDGET_EVENT = "elementor/editor/create-widget";
	68	+ var ANGIE_MODAL_PROMOTION_IMAGE_URL = "https://assets.elementor.com/packages/v1/images/angie-top-bar-promotion-modal-0926.png";
	69	+ var ANGIE_CTA_CLICKED_EVENT = "ai_widget_cta_clicked";
	70	+ var ANGIE_INSTALL_STARTED_EVENT = "angie_install_started";
	71	+ var ANGIE_INSTALL_COMPLETED_EVENT = "angie_install_completed";
	72	+ var ANGIE_INSTALL_ABANDONED_EVENT = "angie_install_abandoned";
	73	+ function CreateWidgetModal({ prompt, entryPoint, onClose }) {
	74	+ const [installState, setInstallState] = (0, react.useState)("idle");
	75	+ const [agreedToTerms, setAgreedToTerms] = (0, react.useState)(false);
	76	+ const handleClose = () => {
	77	+ if (installState === "installing") return;
	78	+ (0, _elementor_events.trackEvent)({
	79	+ eventName: ANGIE_INSTALL_ABANDONED_EVENT,
	80	+ abandon_step: installState === "error" ? "install_error" : "install_modal",
	81	+ trigger_source: entryPoint
	82	+ });
	83	+ onClose();
	84	+ };
	85	+ const handleInstall = async () => {
	86	+ setInstallState("installing");
	87	+ (0, _elementor_events.trackEvent)({
	88	+ eventName: ANGIE_INSTALL_STARTED_EVENT,
	89	+ trigger_source: entryPoint
	90	+ });
	91	+ const [result] = await Promise.all([(0, _elementor_editor_mcp.installAngiePlugin)(), (0, _elementor_editor_mcp.saveAngieConsent)()]);
	92	+ if (!result.success) {
	93	+ setInstallState("error");
	94	+ return;
	95	+ }
	96	+ (0, _elementor_events.trackEvent)({
	97	+ eventName: ANGIE_INSTALL_COMPLETED_EVENT,
	98	+ trigger_source: entryPoint
	99	+ });
	100	+ (0, _elementor_editor_mcp.redirectToAppAdmin)(prompt);
	101	+ };
	102	+ const handleFallbackInstall = () => {
	103	+ (0, _elementor_editor_mcp.redirectToInstallation)(prompt);
	104	+ };
	105	+ return /* @__PURE__ */ react.createElement(_elementor_editor_ui.ThemeProvider, null, /* @__PURE__ */ react.createElement(_elementor_ui.Dialog, {
	106	+ fullWidth: true,
	107	+ maxWidth: "md",
	108	+ open: true,
	109	+ onClose: handleClose
	110	+ }, /* @__PURE__ */ react.createElement(_elementor_ui.IconButton, {
	111	+ "aria-label": (0, _wordpress_i18n.__)("Close", "elementor"),
	112	+ onClick: handleClose,
	113	+ sx: {
	114	+ position: "absolute",
	115	+ right: 8,
	116	+ top: 8,
	117	+ zIndex: 1
	118	+ }
	119	+ }, /* @__PURE__ */ react.createElement(_elementor_icons.XIcon, null)), /* @__PURE__ */ react.createElement(_elementor_ui.DialogContent, { sx: {
	120	+ p: 0,
	121	+ overflow: "hidden"
	122	+ } }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
	123	+ direction: "row",
	124	+ sx: { height: 400 }
	125	+ }, /* @__PURE__ */ react.createElement(_elementor_ui.Image, {
	126	+ sx: {
	127	+ height: "100%",
	128	+ aspectRatio: "1 / 1",
	129	+ objectFit: "cover",
	130	+ objectPosition: "right center"
	131	+ },
	132	+ src: ANGIE_MODAL_PROMOTION_IMAGE_URL
	133	+ }), /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
	134	+ justifyContent: "space-between",
	135	+ p: 4
	136	+ }, /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
	137	+ gap: 2.5,
	138	+ justifyContent: "center",
	139	+ sx: {
	140	+ flex: 1,
	141	+ paddingInlineEnd: 2.5
	142	+ }
	143	+ }, /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
	144	+ variant: "h4",
	145	+ fontWeight: 600,
	146	+ color: "text.secondary"
	147	+ }, installState === "error" ? (0, _wordpress_i18n.__)("Installation failed", "elementor") : /* @__PURE__ */ react.createElement(react.Fragment, null, (0, _wordpress_i18n.__)("Pages, layouts,", "elementor"), /* @__PURE__ */ react.createElement("br", null), (0, _wordpress_i18n.__)("widgets and more", "elementor"))), /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
	148	+ variant: "body2",
	149	+ fontWeight: 500
	150	+ }, installState === "error" ? (0, _wordpress_i18n.__)("We couldn't install Angie automatically. Click below to install it manually.", "elementor") : (0, _wordpress_i18n.__)("Ask Angie to build you full pages, custom widgets, snippets, and code directly in Elementor. Install and activate Angie once on this site to start building.", "elementor")), installState !== "error" && /* @__PURE__ */ react.createElement(_elementor_ui.FormControlLabel, {
	151	+ control: /* @__PURE__ */ react.createElement(_elementor_ui.Checkbox, {
	152	+ size: "small",
	153	+ checked: agreedToTerms,
	154	+ onChange: (_e, checked) => setAgreedToTerms(checked)
	155	+ }),
	156	+ label: /* @__PURE__ */ react.createElement(_elementor_ui.Typography, {
	157	+ variant: "body2",
	158	+ color: "text.secondary"
	159	+ }, interpolateLinks((0, _wordpress_i18n.sprintf)((0, _wordpress_i18n.__)("By installing, you agree to our %1$s & %2$s.", "elementor"), "{{terms}}", "{{privacy}}"), {
	160	+ terms: {
	161	+ label: (0, _wordpress_i18n.__)("Terms", "elementor"),
	162	+ href: "https://elementor.com/terms/angie-terms-conditions/"
	163	+ },
	164	+ privacy: {
	165	+ label: (0, _wordpress_i18n.__)("Privacy Policy", "elementor"),
	166	+ href: "https://elementor.com/about/privacy/"
	167	+ }
	168	+ }))
	169	+ })), /* @__PURE__ */ react.createElement(_elementor_ui.Stack, {
	170	+ direction: "row",
	171	+ justifyContent: "flex-end"
	172	+ }, installState === "error" ? /* @__PURE__ */ react.createElement(_elementor_ui.Button, {
	173	+ variant: "contained",
	174	+ color: "accent",
	175	+ onClick: handleFallbackInstall
	176	+ }, (0, _wordpress_i18n.__)("Install Manually", "elementor")) : /* @__PURE__ */ react.createElement(_elementor_ui.Button, {
	177	+ variant: "contained",
	178	+ color: "accent",
	179	+ onClick: handleInstall,
	180	+ disabled: installState === "installing" || !agreedToTerms,
	181	+ startIcon: installState === "installing" ? /* @__PURE__ */ react.createElement(_elementor_ui.CircularProgress, {
	182	+ size: 18,
	183	+ color: "inherit"
	184	+ }) : void 0
	185	+ }, installState === "installing" ? (0, _wordpress_i18n.__)("Installing…", "elementor") : (0, _wordpress_i18n.__)("Install and activate", "elementor"))))))));
	186	+ }
	187	+ function CreateWidget() {
	188	+ const [modalData, setModalData] = (0, react.useState)(null);
	189	+ (0, react.useEffect)(() => {
	190	+ const handleShow = (event) => {
	191	+ const customEvent = event;
	192	+ const hasAngieInstalled = (0, _elementor_editor_mcp.isAngieAvailable)();
	193	+ (0, _elementor_events.trackEvent)({
	194	+ eventName: ANGIE_CTA_CLICKED_EVENT,
	195	+ entry_point: customEvent.detail.entry_point,
	196	+ has_angie_installed: hasAngieInstalled
	197	+ });
	198	+ if (hasAngieInstalled) {
	199	+ (0, _elementor_editor_mcp.sendPromptToAngie)(customEvent.detail?.prompt);
	200	+ return;
	201	+ }
	202	+ setModalData(customEvent.detail);
	203	+ };
	204	+ window.addEventListener(CREATE_WIDGET_EVENT, handleShow);
	205	+ return () => {
	206	+ window.removeEventListener(CREATE_WIDGET_EVENT, handleShow);
	207	+ };
	208	+ }, []);
	209	+ if (!modalData) return null;
	210	+ return /* @__PURE__ */ react.createElement(CreateWidgetModal, {
	211	+ prompt: modalData.prompt,
	212	+ entryPoint: modalData.entry_point,
	213	+ onClose: () => setModalData(null)
	214	+ });
	215	+ }
	216	+
	217	+//#endregion
	218	+//#region packages/packages/core/editor-widget-creation/src/init.ts
	219	+ function init() {
	220	+ (0, _elementor_editor.injectIntoTop)({
	221	+ id: "create-widget",
	222	+ component: CreateWidget
	223	+ });
	224	+ }
	225	+
	226	+//#endregion
	227	+//#region packages/packages/core/editor-widget-creation/src/index.ts
	228	+ var src_exports = /* @__PURE__ */ __exportAll({ init: () => init });
	229	+
	230	+//#endregion
	231	+//#region \0elementor-package-library-entry
	232	+ (window.elementorV2 = window.elementorV2 || {}).editorWidgetCreation = src_exports;
	233	+
	234	+//#endregion
	235	+})(elementorV2.editor, React, elementorV2.editorMcp, elementorV2.editorUi, elementorV2.events, elementorV2.icons, elementorV2.ui, wp.i18n);
	236	+window.elementorV2.editorWidgetCreation?.init?.();
3	237	//# sourceMappingURL=editor-widget-creation.js.map