@elementor/editor-widget-creation 4.2.0-845 → 4.2.0-847
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +0 -6
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +0 -6
- package/dist/index.mjs.map +1 -1
- package/package.json +5 -5
- package/src/components/create-widget.tsx +0 -8
package/dist/index.js
CHANGED
|
@@ -66,9 +66,6 @@ function CreateWidgetModal({ prompt, entryPoint, onClose }) {
|
|
|
66
66
|
onClose();
|
|
67
67
|
};
|
|
68
68
|
const handleInstall = async () => {
|
|
69
|
-
if (!prompt) {
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
69
|
setInstallState("installing");
|
|
73
70
|
(0, import_events.trackEvent)({
|
|
74
71
|
eventName: ANGIE_INSTALL_STARTED_EVENT,
|
|
@@ -86,9 +83,6 @@ function CreateWidgetModal({ prompt, entryPoint, onClose }) {
|
|
|
86
83
|
(0, import_editor_mcp.redirectToAppAdmin)(prompt);
|
|
87
84
|
};
|
|
88
85
|
const handleFallbackInstall = () => {
|
|
89
|
-
if (!prompt) {
|
|
90
|
-
return;
|
|
91
|
-
}
|
|
92
86
|
(0, import_editor_mcp.redirectToInstallation)(prompt);
|
|
93
87
|
};
|
|
94
88
|
return /* @__PURE__ */ React.createElement(import_editor_ui.ThemeProvider, null, /* @__PURE__ */ React.createElement(import_ui.Dialog, { fullWidth: true, maxWidth: "md", open: true, onClose: handleClose }, /* @__PURE__ */ React.createElement(
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/create-widget.tsx"],"sourcesContent":["export { init } from './init';\n","import { injectIntoTop } from '@elementor/editor';\n\nimport { CreateWidget } from './components/create-widget';\n\nexport function init() {\n\tinjectIntoTop( {\n\t\tid: 'create-widget',\n\t\tcomponent: CreateWidget,\n\t} );\n}\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\tinstallAngiePlugin,\n\tisAngieAvailable,\n\tredirectToAppAdmin,\n\tredirectToInstallation,\n\tsendPromptToAngie,\n} from '@elementor/editor-mcp';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { trackEvent } from '@elementor/events';\nimport { XIcon } from '@elementor/icons';\nimport { Button, CircularProgress, Dialog, DialogContent, IconButton, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\ntype ShowModalEventDetail = {\n\tprompt?: string;\n\tentry_point: string;\n};\n\ntype InstallState = 'idle' | 'installing' | 'error';\n\ntype CreateWidgetModalProps = {\n\tprompt?: string;\n\tentryPoint: string;\n\tonClose: () => void;\n};\n\nconst CREATE_WIDGET_EVENT = 'elementor/editor/create-widget';\nconst PROMOTION_IMAGE_URL = 'https://assets.elementor.com/packages/v1/images/angie-promotion.svg';\nconst AI_WIDGET_CTA_CLICKED_EVENT = 'ai_widget_cta_clicked' as const;\nconst ANGIE_INSTALL_STARTED_EVENT = 'angie_install_started' as const;\nconst ANGIE_INSTALL_COMPLETED_EVENT = 'angie_install_completed' as const;\nconst ANGIE_INSTALL_ABANDONED_EVENT = 'angie_install_abandoned' as const;\n\nfunction CreateWidgetModal( { prompt, entryPoint, onClose }: CreateWidgetModalProps ) {\n\tconst [ installState, setInstallState ] = useState< InstallState >( 'idle' );\n\n\tconst handleClose = () => {\n\t\tif ( installState === 'installing' ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_ABANDONED_EVENT,\n\t\t\tabandon_step: installState === 'error' ? 'install_error' : 'install_modal',\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tonClose();\n\t};\n\n\tconst handleInstall = async () => {\n\t\
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/init.ts","../src/components/create-widget.tsx"],"sourcesContent":["export { init } from './init';\n","import { injectIntoTop } from '@elementor/editor';\n\nimport { CreateWidget } from './components/create-widget';\n\nexport function init() {\n\tinjectIntoTop( {\n\t\tid: 'create-widget',\n\t\tcomponent: CreateWidget,\n\t} );\n}\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\tinstallAngiePlugin,\n\tisAngieAvailable,\n\tredirectToAppAdmin,\n\tredirectToInstallation,\n\tsendPromptToAngie,\n} from '@elementor/editor-mcp';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { trackEvent } from '@elementor/events';\nimport { XIcon } from '@elementor/icons';\nimport { Button, CircularProgress, Dialog, DialogContent, IconButton, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\ntype ShowModalEventDetail = {\n\tprompt?: string;\n\tentry_point: string;\n};\n\ntype InstallState = 'idle' | 'installing' | 'error';\n\ntype CreateWidgetModalProps = {\n\tprompt?: string;\n\tentryPoint: string;\n\tonClose: () => void;\n};\n\nconst CREATE_WIDGET_EVENT = 'elementor/editor/create-widget';\nconst PROMOTION_IMAGE_URL = 'https://assets.elementor.com/packages/v1/images/angie-promotion.svg';\nconst AI_WIDGET_CTA_CLICKED_EVENT = 'ai_widget_cta_clicked' as const;\nconst ANGIE_INSTALL_STARTED_EVENT = 'angie_install_started' as const;\nconst ANGIE_INSTALL_COMPLETED_EVENT = 'angie_install_completed' as const;\nconst ANGIE_INSTALL_ABANDONED_EVENT = 'angie_install_abandoned' as const;\n\nfunction CreateWidgetModal( { prompt, entryPoint, onClose }: CreateWidgetModalProps ) {\n\tconst [ installState, setInstallState ] = useState< InstallState >( 'idle' );\n\n\tconst handleClose = () => {\n\t\tif ( installState === 'installing' ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_ABANDONED_EVENT,\n\t\t\tabandon_step: installState === 'error' ? 'install_error' : 'install_modal',\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tonClose();\n\t};\n\n\tconst handleInstall = async () => {\n\t\tsetInstallState( 'installing' );\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_STARTED_EVENT,\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tconst result = await installAngiePlugin();\n\n\t\tif ( ! result.success ) {\n\t\t\tsetInstallState( 'error' );\n\n\t\t\treturn;\n\t\t}\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_COMPLETED_EVENT,\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tredirectToAppAdmin( prompt );\n\t};\n\n\tconst handleFallbackInstall = () => {\n\t\tredirectToInstallation( prompt );\n\t};\n\n\treturn (\n\t\t<ThemeProvider>\n\t\t\t<Dialog fullWidth maxWidth=\"md\" open onClose={ handleClose }>\n\t\t\t\t<IconButton\n\t\t\t\t\taria-label={ __( 'Close', 'elementor' ) }\n\t\t\t\t\tonClick={ handleClose }\n\t\t\t\t\tsx={ {\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tright: 8,\n\t\t\t\t\t\ttop: 8,\n\t\t\t\t\t\tzIndex: 1,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<XIcon />\n\t\t\t\t</IconButton>\n\t\t\t\t<DialogContent sx={ { p: 0, overflow: 'hidden' } }>\n\t\t\t\t\t<Stack direction=\"row\" sx={ { height: 400 } }>\n\t\t\t\t\t\t<Image\n\t\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\taspectRatio: '1 / 1',\n\t\t\t\t\t\t\t\tobjectFit: 'cover',\n\t\t\t\t\t\t\t\tobjectPosition: 'right center',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tsrc={ PROMOTION_IMAGE_URL }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Stack gap={ 2 } justifyContent=\"center\" p={ 4 }>\n\t\t\t\t\t\t\t<Typography variant=\"h6\" fontWeight={ 600 } whiteSpace=\"nowrap\">\n\t\t\t\t\t\t\t\t{ installState === 'error'\n\t\t\t\t\t\t\t\t\t? __( 'Installation failed', 'elementor' )\n\t\t\t\t\t\t\t\t\t: __( 'Install Angie to build custom widgets', 'elementor' ) }\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t<Typography variant=\"body2\" color=\"text.secondary\">\n\t\t\t\t\t\t\t\t{ installState === 'error'\n\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t\"We couldn't install Angie automatically. Click below to install it manually.\",\n\t\t\t\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t'Angie lets you generate custom widgets, sections, and code using simple instructions.',\n\t\t\t\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t\t\t ) }\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t{ installState !== 'error' && (\n\t\t\t\t\t\t\t\t<Typography variant=\"body2\" color=\"text.secondary\">\n\t\t\t\t\t\t\t\t\t{ __( 'Install once to start building directly inside the editor.', 'elementor' ) }\n\t\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<Stack direction=\"row\" justifyContent=\"flex-end\" sx={ { mt: 2 } }>\n\t\t\t\t\t\t\t\t{ installState === 'error' ? (\n\t\t\t\t\t\t\t\t\t<Button variant=\"contained\" color=\"accent\" onClick={ handleFallbackInstall }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Install Manually', 'elementor' ) }\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\t\t\t\t\t\tcolor=\"accent\"\n\t\t\t\t\t\t\t\t\t\tonClick={ handleInstall }\n\t\t\t\t\t\t\t\t\t\tdisabled={ installState === 'installing' }\n\t\t\t\t\t\t\t\t\t\tstartIcon={\n\t\t\t\t\t\t\t\t\t\t\tinstallState === 'installing' ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<CircularProgress size={ 18 } color=\"inherit\" />\n\t\t\t\t\t\t\t\t\t\t\t) : undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ installState === 'installing'\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Installing…', 'elementor' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Install Angie', 'elementor' ) }\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\t\t</ThemeProvider>\n\t);\n}\n\nexport function CreateWidget() {\n\tconst [ modalData, setModalData ] = useState< ShowModalEventDetail | null >( null );\n\n\tuseEffect( () => {\n\t\tconst handleShow = ( event: Event ) => {\n\t\t\tconst customEvent = event as CustomEvent< ShowModalEventDetail >;\n\t\t\tconst hasAngieInstalled = isAngieAvailable();\n\n\t\t\ttrackEvent( {\n\t\t\t\teventName: AI_WIDGET_CTA_CLICKED_EVENT,\n\t\t\t\tentry_point: customEvent.detail.entry_point,\n\t\t\t\thas_angie_installed: hasAngieInstalled,\n\t\t\t} );\n\n\t\t\tif ( hasAngieInstalled ) {\n\t\t\t\tsendPromptToAngie( customEvent.detail?.prompt );\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetModalData( customEvent.detail );\n\t\t};\n\n\t\twindow.addEventListener( CREATE_WIDGET_EVENT, handleShow );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( CREATE_WIDGET_EVENT, handleShow );\n\t\t};\n\t}, [] );\n\n\tif ( ! modalData ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<CreateWidgetModal\n\t\t\tprompt={ modalData.prompt }\n\t\t\tentryPoint={ modalData.entry_point }\n\t\t\tonClose={ () => setModalData( null ) }\n\t\t/>\n\t);\n}\n"],"mappings":"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","names":[]}
|
package/dist/index.mjs
CHANGED
|
@@ -36,9 +36,6 @@ function CreateWidgetModal({ prompt, entryPoint, onClose }) {
|
|
|
36
36
|
onClose();
|
|
37
37
|
};
|
|
38
38
|
const handleInstall = async () => {
|
|
39
|
-
if (!prompt) {
|
|
40
|
-
return;
|
|
41
|
-
}
|
|
42
39
|
setInstallState("installing");
|
|
43
40
|
trackEvent({
|
|
44
41
|
eventName: ANGIE_INSTALL_STARTED_EVENT,
|
|
@@ -56,9 +53,6 @@ function CreateWidgetModal({ prompt, entryPoint, onClose }) {
|
|
|
56
53
|
redirectToAppAdmin(prompt);
|
|
57
54
|
};
|
|
58
55
|
const handleFallbackInstall = () => {
|
|
59
|
-
if (!prompt) {
|
|
60
|
-
return;
|
|
61
|
-
}
|
|
62
56
|
redirectToInstallation(prompt);
|
|
63
57
|
};
|
|
64
58
|
return /* @__PURE__ */ React.createElement(ThemeProvider, null, /* @__PURE__ */ React.createElement(Dialog, { fullWidth: true, maxWidth: "md", open: true, onClose: handleClose }, /* @__PURE__ */ React.createElement(
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/init.ts","../src/components/create-widget.tsx"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\n\nimport { CreateWidget } from './components/create-widget';\n\nexport function init() {\n\tinjectIntoTop( {\n\t\tid: 'create-widget',\n\t\tcomponent: CreateWidget,\n\t} );\n}\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\tinstallAngiePlugin,\n\tisAngieAvailable,\n\tredirectToAppAdmin,\n\tredirectToInstallation,\n\tsendPromptToAngie,\n} from '@elementor/editor-mcp';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { trackEvent } from '@elementor/events';\nimport { XIcon } from '@elementor/icons';\nimport { Button, CircularProgress, Dialog, DialogContent, IconButton, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\ntype ShowModalEventDetail = {\n\tprompt?: string;\n\tentry_point: string;\n};\n\ntype InstallState = 'idle' | 'installing' | 'error';\n\ntype CreateWidgetModalProps = {\n\tprompt?: string;\n\tentryPoint: string;\n\tonClose: () => void;\n};\n\nconst CREATE_WIDGET_EVENT = 'elementor/editor/create-widget';\nconst PROMOTION_IMAGE_URL = 'https://assets.elementor.com/packages/v1/images/angie-promotion.svg';\nconst AI_WIDGET_CTA_CLICKED_EVENT = 'ai_widget_cta_clicked' as const;\nconst ANGIE_INSTALL_STARTED_EVENT = 'angie_install_started' as const;\nconst ANGIE_INSTALL_COMPLETED_EVENT = 'angie_install_completed' as const;\nconst ANGIE_INSTALL_ABANDONED_EVENT = 'angie_install_abandoned' as const;\n\nfunction CreateWidgetModal( { prompt, entryPoint, onClose }: CreateWidgetModalProps ) {\n\tconst [ installState, setInstallState ] = useState< InstallState >( 'idle' );\n\n\tconst handleClose = () => {\n\t\tif ( installState === 'installing' ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_ABANDONED_EVENT,\n\t\t\tabandon_step: installState === 'error' ? 'install_error' : 'install_modal',\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tonClose();\n\t};\n\n\tconst handleInstall = async () => {\n\t\
|
|
1
|
+
{"version":3,"sources":["../src/init.ts","../src/components/create-widget.tsx"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\n\nimport { CreateWidget } from './components/create-widget';\n\nexport function init() {\n\tinjectIntoTop( {\n\t\tid: 'create-widget',\n\t\tcomponent: CreateWidget,\n\t} );\n}\n","import * as React from 'react';\nimport { useEffect, useState } from 'react';\nimport {\n\tinstallAngiePlugin,\n\tisAngieAvailable,\n\tredirectToAppAdmin,\n\tredirectToInstallation,\n\tsendPromptToAngie,\n} from '@elementor/editor-mcp';\nimport { ThemeProvider } from '@elementor/editor-ui';\nimport { trackEvent } from '@elementor/events';\nimport { XIcon } from '@elementor/icons';\nimport { Button, CircularProgress, Dialog, DialogContent, IconButton, Image, Stack, Typography } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\ntype ShowModalEventDetail = {\n\tprompt?: string;\n\tentry_point: string;\n};\n\ntype InstallState = 'idle' | 'installing' | 'error';\n\ntype CreateWidgetModalProps = {\n\tprompt?: string;\n\tentryPoint: string;\n\tonClose: () => void;\n};\n\nconst CREATE_WIDGET_EVENT = 'elementor/editor/create-widget';\nconst PROMOTION_IMAGE_URL = 'https://assets.elementor.com/packages/v1/images/angie-promotion.svg';\nconst AI_WIDGET_CTA_CLICKED_EVENT = 'ai_widget_cta_clicked' as const;\nconst ANGIE_INSTALL_STARTED_EVENT = 'angie_install_started' as const;\nconst ANGIE_INSTALL_COMPLETED_EVENT = 'angie_install_completed' as const;\nconst ANGIE_INSTALL_ABANDONED_EVENT = 'angie_install_abandoned' as const;\n\nfunction CreateWidgetModal( { prompt, entryPoint, onClose }: CreateWidgetModalProps ) {\n\tconst [ installState, setInstallState ] = useState< InstallState >( 'idle' );\n\n\tconst handleClose = () => {\n\t\tif ( installState === 'installing' ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_ABANDONED_EVENT,\n\t\t\tabandon_step: installState === 'error' ? 'install_error' : 'install_modal',\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tonClose();\n\t};\n\n\tconst handleInstall = async () => {\n\t\tsetInstallState( 'installing' );\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_STARTED_EVENT,\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tconst result = await installAngiePlugin();\n\n\t\tif ( ! result.success ) {\n\t\t\tsetInstallState( 'error' );\n\n\t\t\treturn;\n\t\t}\n\n\t\ttrackEvent( {\n\t\t\teventName: ANGIE_INSTALL_COMPLETED_EVENT,\n\t\t\ttrigger_source: entryPoint,\n\t\t} );\n\n\t\tredirectToAppAdmin( prompt );\n\t};\n\n\tconst handleFallbackInstall = () => {\n\t\tredirectToInstallation( prompt );\n\t};\n\n\treturn (\n\t\t<ThemeProvider>\n\t\t\t<Dialog fullWidth maxWidth=\"md\" open onClose={ handleClose }>\n\t\t\t\t<IconButton\n\t\t\t\t\taria-label={ __( 'Close', 'elementor' ) }\n\t\t\t\t\tonClick={ handleClose }\n\t\t\t\t\tsx={ {\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tright: 8,\n\t\t\t\t\t\ttop: 8,\n\t\t\t\t\t\tzIndex: 1,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<XIcon />\n\t\t\t\t</IconButton>\n\t\t\t\t<DialogContent sx={ { p: 0, overflow: 'hidden' } }>\n\t\t\t\t\t<Stack direction=\"row\" sx={ { height: 400 } }>\n\t\t\t\t\t\t<Image\n\t\t\t\t\t\t\tsx={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\taspectRatio: '1 / 1',\n\t\t\t\t\t\t\t\tobjectFit: 'cover',\n\t\t\t\t\t\t\t\tobjectPosition: 'right center',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tsrc={ PROMOTION_IMAGE_URL }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Stack gap={ 2 } justifyContent=\"center\" p={ 4 }>\n\t\t\t\t\t\t\t<Typography variant=\"h6\" fontWeight={ 600 } whiteSpace=\"nowrap\">\n\t\t\t\t\t\t\t\t{ installState === 'error'\n\t\t\t\t\t\t\t\t\t? __( 'Installation failed', 'elementor' )\n\t\t\t\t\t\t\t\t\t: __( 'Install Angie to build custom widgets', 'elementor' ) }\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t<Typography variant=\"body2\" color=\"text.secondary\">\n\t\t\t\t\t\t\t\t{ installState === 'error'\n\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t\"We couldn't install Angie automatically. Click below to install it manually.\",\n\t\t\t\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t'Angie lets you generate custom widgets, sections, and code using simple instructions.',\n\t\t\t\t\t\t\t\t\t\t\t'elementor'\n\t\t\t\t\t\t\t\t\t ) }\n\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t{ installState !== 'error' && (\n\t\t\t\t\t\t\t\t<Typography variant=\"body2\" color=\"text.secondary\">\n\t\t\t\t\t\t\t\t\t{ __( 'Install once to start building directly inside the editor.', 'elementor' ) }\n\t\t\t\t\t\t\t\t</Typography>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<Stack direction=\"row\" justifyContent=\"flex-end\" sx={ { mt: 2 } }>\n\t\t\t\t\t\t\t\t{ installState === 'error' ? (\n\t\t\t\t\t\t\t\t\t<Button variant=\"contained\" color=\"accent\" onClick={ handleFallbackInstall }>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Install Manually', 'elementor' ) }\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tvariant=\"contained\"\n\t\t\t\t\t\t\t\t\t\tcolor=\"accent\"\n\t\t\t\t\t\t\t\t\t\tonClick={ handleInstall }\n\t\t\t\t\t\t\t\t\t\tdisabled={ installState === 'installing' }\n\t\t\t\t\t\t\t\t\t\tstartIcon={\n\t\t\t\t\t\t\t\t\t\t\tinstallState === 'installing' ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<CircularProgress size={ 18 } color=\"inherit\" />\n\t\t\t\t\t\t\t\t\t\t\t) : undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ installState === 'installing'\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Installing…', 'elementor' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Install Angie', 'elementor' ) }\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DialogContent>\n\t\t\t</Dialog>\n\t\t</ThemeProvider>\n\t);\n}\n\nexport function CreateWidget() {\n\tconst [ modalData, setModalData ] = useState< ShowModalEventDetail | null >( null );\n\n\tuseEffect( () => {\n\t\tconst handleShow = ( event: Event ) => {\n\t\t\tconst customEvent = event as CustomEvent< ShowModalEventDetail >;\n\t\t\tconst hasAngieInstalled = isAngieAvailable();\n\n\t\t\ttrackEvent( {\n\t\t\t\teventName: AI_WIDGET_CTA_CLICKED_EVENT,\n\t\t\t\tentry_point: customEvent.detail.entry_point,\n\t\t\t\thas_angie_installed: hasAngieInstalled,\n\t\t\t} );\n\n\t\t\tif ( hasAngieInstalled ) {\n\t\t\t\tsendPromptToAngie( customEvent.detail?.prompt );\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetModalData( customEvent.detail );\n\t\t};\n\n\t\twindow.addEventListener( CREATE_WIDGET_EVENT, handleShow );\n\n\t\treturn () => {\n\t\t\twindow.removeEventListener( CREATE_WIDGET_EVENT, handleShow );\n\t\t};\n\t}, [] );\n\n\tif ( ! modalData ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<CreateWidgetModal\n\t\t\tprompt={ modalData.prompt }\n\t\t\tentryPoint={ modalData.entry_point }\n\t\t\tonClose={ () => setModalData( null ) }\n\t\t/>\n\t);\n}\n"],"mappings":";AAAA,SAAS,qBAAqB;;;ACA9B,YAAY,WAAW;AACvB,SAAS,WAAW,gBAAgB;AACpC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AACtB,SAAS,QAAQ,kBAAkB,QAAQ,eAAe,YAAY,OAAO,OAAO,kBAAkB;AACtG,SAAS,UAAU;AAenB,IAAM,sBAAsB;AAC5B,IAAM,sBAAsB;AAC5B,IAAM,8BAA8B;AACpC,IAAM,8BAA8B;AACpC,IAAM,gCAAgC;AACtC,IAAM,gCAAgC;AAEtC,SAAS,kBAAmB,EAAE,QAAQ,YAAY,QAAQ,GAA4B;AACrF,QAAM,CAAE,cAAc,eAAgB,IAAI,SAA0B,MAAO;AAE3E,QAAM,cAAc,MAAM;AACzB,QAAK,iBAAiB,cAAe;AACpC;AAAA,IACD;AAEA,eAAY;AAAA,MACX,WAAW;AAAA,MACX,cAAc,iBAAiB,UAAU,kBAAkB;AAAA,MAC3D,gBAAgB;AAAA,IACjB,CAAE;AAEF,YAAQ;AAAA,EACT;AAEA,QAAM,gBAAgB,YAAY;AACjC,oBAAiB,YAAa;AAE9B,eAAY;AAAA,MACX,WAAW;AAAA,MACX,gBAAgB;AAAA,IACjB,CAAE;AAEF,UAAM,SAAS,MAAM,mBAAmB;AAExC,QAAK,CAAE,OAAO,SAAU;AACvB,sBAAiB,OAAQ;AAEzB;AAAA,IACD;AAEA,eAAY;AAAA,MACX,WAAW;AAAA,MACX,gBAAgB;AAAA,IACjB,CAAE;AAEF,uBAAoB,MAAO;AAAA,EAC5B;AAEA,QAAM,wBAAwB,MAAM;AACnC,2BAAwB,MAAO;AAAA,EAChC;AAEA,SACC,oCAAC,qBACA,oCAAC,UAAO,WAAS,MAAC,UAAS,MAAK,MAAI,MAAC,SAAU,eAC9C;AAAA,IAAC;AAAA;AAAA,MACA,cAAa,GAAI,SAAS,WAAY;AAAA,MACtC,SAAU;AAAA,MACV,IAAK;AAAA,QACJ,UAAU;AAAA,QACV,OAAO;AAAA,QACP,KAAK;AAAA,QACL,QAAQ;AAAA,MACT;AAAA;AAAA,IAEA,oCAAC,WAAM;AAAA,EACR,GACA,oCAAC,iBAAc,IAAK,EAAE,GAAG,GAAG,UAAU,SAAS,KAC9C,oCAAC,SAAM,WAAU,OAAM,IAAK,EAAE,QAAQ,IAAI,KACzC;AAAA,IAAC;AAAA;AAAA,MACA,IAAK;AAAA,QACJ,QAAQ;AAAA,QACR,aAAa;AAAA,QACb,WAAW;AAAA,QACX,gBAAgB;AAAA,MACjB;AAAA,MACA,KAAM;AAAA;AAAA,EACP,GACA,oCAAC,SAAM,KAAM,GAAI,gBAAe,UAAS,GAAI,KAC5C,oCAAC,cAAW,SAAQ,MAAK,YAAa,KAAM,YAAW,YACpD,iBAAiB,UAChB,GAAI,uBAAuB,WAAY,IACvC,GAAI,yCAAyC,WAAY,CAC7D,GACA,oCAAC,cAAW,SAAQ,SAAQ,OAAM,oBAC/B,iBAAiB,UAChB;AAAA,IACA;AAAA,IACA;AAAA,EACA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACA,CACJ,GACE,iBAAiB,WAClB,oCAAC,cAAW,SAAQ,SAAQ,OAAM,oBAC/B,GAAI,8DAA8D,WAAY,CACjF,GAED,oCAAC,SAAM,WAAU,OAAM,gBAAe,YAAW,IAAK,EAAE,IAAI,EAAE,KAC3D,iBAAiB,UAClB,oCAAC,UAAO,SAAQ,aAAY,OAAM,UAAS,SAAU,yBAClD,GAAI,oBAAoB,WAAY,CACvC,IAEA;AAAA,IAAC;AAAA;AAAA,MACA,SAAQ;AAAA,MACR,OAAM;AAAA,MACN,SAAU;AAAA,MACV,UAAW,iBAAiB;AAAA,MAC5B,WACC,iBAAiB,eAChB,oCAAC,oBAAiB,MAAO,IAAK,OAAM,WAAU,IAC3C;AAAA;AAAA,IAGH,iBAAiB,eAChB,GAAI,oBAAe,WAAY,IAC/B,GAAI,iBAAiB,WAAY;AAAA,EACrC,CAEF,CACD,CACD,CACD,CACD,CACD;AAEF;AAEO,SAAS,eAAe;AAC9B,QAAM,CAAE,WAAW,YAAa,IAAI,SAAyC,IAAK;AAElF,YAAW,MAAM;AAChB,UAAM,aAAa,CAAE,UAAkB;AACtC,YAAM,cAAc;AACpB,YAAM,oBAAoB,iBAAiB;AAE3C,iBAAY;AAAA,QACX,WAAW;AAAA,QACX,aAAa,YAAY,OAAO;AAAA,QAChC,qBAAqB;AAAA,MACtB,CAAE;AAEF,UAAK,mBAAoB;AACxB,0BAAmB,YAAY,QAAQ,MAAO;AAE9C;AAAA,MACD;AAEA,mBAAc,YAAY,MAAO;AAAA,IAClC;AAEA,WAAO,iBAAkB,qBAAqB,UAAW;AAEzD,WAAO,MAAM;AACZ,aAAO,oBAAqB,qBAAqB,UAAW;AAAA,IAC7D;AAAA,EACD,GAAG,CAAC,CAAE;AAEN,MAAK,CAAE,WAAY;AAClB,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,QAAS,UAAU;AAAA,MACnB,YAAa,UAAU;AAAA,MACvB,SAAU,MAAM,aAAc,IAAK;AAAA;AAAA,EACpC;AAEF;;;ADpMO,SAAS,OAAO;AACtB,gBAAe;AAAA,IACd,IAAI;AAAA,IACJ,WAAW;AAAA,EACZ,CAAE;AACH;","names":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elementor/editor-widget-creation",
|
|
3
|
-
"version": "4.2.0-
|
|
3
|
+
"version": "4.2.0-847",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "Elementor Team",
|
|
6
6
|
"homepage": "https://elementor.com/",
|
|
@@ -39,10 +39,10 @@
|
|
|
39
39
|
"dev": "tsup --config=../../tsup.dev.ts"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@elementor/editor": "4.2.0-
|
|
43
|
-
"@elementor/editor-mcp": "4.2.0-
|
|
44
|
-
"@elementor/editor-ui": "4.2.0-
|
|
45
|
-
"@elementor/events": "4.2.0-
|
|
42
|
+
"@elementor/editor": "4.2.0-847",
|
|
43
|
+
"@elementor/editor-mcp": "4.2.0-847",
|
|
44
|
+
"@elementor/editor-ui": "4.2.0-847",
|
|
45
|
+
"@elementor/events": "4.2.0-847",
|
|
46
46
|
"@elementor/icons": "~1.75.1",
|
|
47
47
|
"@elementor/ui": "1.37.5",
|
|
48
48
|
"@wordpress/i18n": "^5.13.0"
|
|
@@ -51,10 +51,6 @@ function CreateWidgetModal( { prompt, entryPoint, onClose }: CreateWidgetModalPr
|
|
|
51
51
|
};
|
|
52
52
|
|
|
53
53
|
const handleInstall = async () => {
|
|
54
|
-
if ( ! prompt ) {
|
|
55
|
-
return;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
54
|
setInstallState( 'installing' );
|
|
59
55
|
|
|
60
56
|
trackEvent( {
|
|
@@ -79,10 +75,6 @@ function CreateWidgetModal( { prompt, entryPoint, onClose }: CreateWidgetModalPr
|
|
|
79
75
|
};
|
|
80
76
|
|
|
81
77
|
const handleFallbackInstall = () => {
|
|
82
|
-
if ( ! prompt ) {
|
|
83
|
-
return;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
78
|
redirectToInstallation( prompt );
|
|
87
79
|
};
|
|
88
80
|
|