@elementor/editor-elements 3.35.0-326 → 3.35.0-328

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.mjs CHANGED
@@ -1004,613 +1004,6 @@ var playElementInteractions = (elementId, animationId) => {
1004
1004
  function setDocumentModifiedStatus2(status) {
1005
1005
  runCommandSync6("document/save/set-is-modified", { status }, { internal: true });
1006
1006
  }
1007
-
1008
- // src/mcp/index.ts
1009
- import { getMCPByDomain as getMCPByDomain2 } from "@elementor/editor-mcp";
1010
-
1011
- // src/mcp/elements-tool.ts
1012
- import { getMCPByDomain } from "@elementor/editor-mcp";
1013
- import { z } from "@elementor/schema";
1014
-
1015
- // src/mcp/handlers/create-element.ts
1016
- function handleCreateElement({
1017
- elementType,
1018
- containerId,
1019
- props = {},
1020
- styles
1021
- }) {
1022
- let container = containerId === "document" ? getCurrentDocumentContainer() : getContainer(containerId);
1023
- if (!container) {
1024
- if (containerId === "document") {
1025
- throw new Error("Document container not found. Please ensure the editor is initialized.");
1026
- }
1027
- throw new Error(`Container with ID "${containerId}" not found`);
1028
- }
1029
- const containerElType = container.model.get("elType");
1030
- const isDocument = container.id === "document" || containerElType === "document";
1031
- if (isDocument) {
1032
- const containerModel = {
1033
- elType: "e-div-block"
1034
- };
1035
- const createdContainer = createElement({
1036
- containerId: container.id,
1037
- model: containerModel,
1038
- options: { useHistory: true }
1039
- });
1040
- createElementStyle({
1041
- elementId: createdContainer.id,
1042
- classesProp: "classes",
1043
- label: "local",
1044
- meta: { breakpoint: "desktop", state: null },
1045
- props: {
1046
- display: { $$type: "string", value: "flex" },
1047
- "flex-direction": { $$type: "string", value: "row" },
1048
- "flex-wrap": { $$type: "string", value: "wrap" }
1049
- }
1050
- });
1051
- container = getContainer(createdContainer.id);
1052
- if (!container) {
1053
- throw new Error("Failed to create container for widget. Cannot create widgets directly in the document.");
1054
- }
1055
- }
1056
- const actualContainerId = container.id;
1057
- const elementTypeData = getElementType(elementType);
1058
- if (!elementTypeData) {
1059
- throw new Error(`Element type "${elementType}" not found or is not atomic`);
1060
- }
1061
- const model = {
1062
- widgetType: elementType,
1063
- elType: "widget",
1064
- settings: props
1065
- };
1066
- const createdElement = createElement({
1067
- containerId: actualContainerId,
1068
- model,
1069
- options: { useHistory: true }
1070
- });
1071
- if (styles) {
1072
- createElementStyle({
1073
- elementId: createdElement.id,
1074
- classesProp: "classes",
1075
- label: "local",
1076
- meta: { breakpoint: "desktop", state: null },
1077
- props: styles
1078
- });
1079
- }
1080
- return {
1081
- elementId: createdElement.id,
1082
- type: elementType
1083
- };
1084
- }
1085
-
1086
- // src/mcp/handlers/common-style-utils.ts
1087
- var VALID_BREAKPOINTS = [
1088
- "widescreen",
1089
- "desktop",
1090
- "laptop",
1091
- "tablet_extra",
1092
- "tablet",
1093
- "mobile_extra",
1094
- "mobile"
1095
- ];
1096
- function resolveBreakpointId(breakpoint) {
1097
- if (breakpoint === null) {
1098
- return null;
1099
- }
1100
- if (VALID_BREAKPOINTS.includes(breakpoint)) {
1101
- return breakpoint;
1102
- }
1103
- return "desktop";
1104
- }
1105
-
1106
- // src/mcp/handlers/create-style.ts
1107
- function handleCreateStyle({
1108
- elementId,
1109
- styleId,
1110
- classesProp = "classes",
1111
- label = "local",
1112
- styles,
1113
- breakpoint = "desktop",
1114
- state = null,
1115
- customCss = null
1116
- }) {
1117
- const resolvedBreakpoint = resolveBreakpointId(breakpoint);
1118
- const resolvedState = state === null || state === void 0 ? null : state;
1119
- const createdStyleId = createElementStyle({
1120
- styleId,
1121
- elementId,
1122
- classesProp,
1123
- label,
1124
- meta: { breakpoint: resolvedBreakpoint, state: resolvedState },
1125
- props: styles,
1126
- custom_css: customCss
1127
- });
1128
- return { styleId: createdStyleId };
1129
- }
1130
-
1131
- // src/mcp/handlers/delete-element.ts
1132
- function handleDeleteElement(elementId) {
1133
- const container = getContainer(elementId);
1134
- if (!container) {
1135
- throw new Error(`Element with ID "${elementId}" not found`);
1136
- }
1137
- deleteElement({
1138
- elementId,
1139
- options: { useHistory: true }
1140
- });
1141
- return { success: true };
1142
- }
1143
-
1144
- // src/mcp/handlers/delete-style.ts
1145
- function handleDeleteStyle({ elementId, styleId }) {
1146
- const elementStyles = getElementStyles(elementId);
1147
- if (!elementStyles) {
1148
- throw new Error(`Element with ID "${elementId}" has no styles.`);
1149
- }
1150
- const resolvedStyleId = styleId || Object.keys(elementStyles)[0];
1151
- if (!resolvedStyleId) {
1152
- throw new Error(`Element with ID "${elementId}" has no styles to delete.`);
1153
- }
1154
- deleteElementStyle(elementId, resolvedStyleId);
1155
- return { success: true };
1156
- }
1157
-
1158
- // src/mcp/handlers/deselect-element.ts
1159
- import { __privateRunCommand as runCommand3 } from "@elementor/editor-v1-adapters";
1160
- function handleDeselectElement(elementId) {
1161
- const container = getContainer(elementId);
1162
- if (!container) {
1163
- throw new Error(`Element with ID "${elementId}" not found`);
1164
- }
1165
- runCommand3("document/elements/deselect", { container });
1166
- return { success: true };
1167
- }
1168
- function handleDeselectAllElements() {
1169
- runCommand3("document/elements/deselect-all", {});
1170
- return { success: true };
1171
- }
1172
-
1173
- // src/mcp/handlers/duplicate-element.ts
1174
- function handleDuplicateElement(elementId) {
1175
- const container = getContainer(elementId);
1176
- if (!container) {
1177
- throw new Error(`Element with ID "${elementId}" not found`);
1178
- }
1179
- const duplicatedElement = duplicateElement({
1180
- elementId,
1181
- options: { useHistory: true }
1182
- });
1183
- const type = duplicatedElement.model.get("widgetType") || duplicatedElement.model.get("elType") || "";
1184
- return {
1185
- elementId: duplicatedElement.id,
1186
- type
1187
- };
1188
- }
1189
-
1190
- // src/mcp/handlers/get-element-props.ts
1191
- function handleGetElementProps(elementId) {
1192
- const container = getContainer(elementId);
1193
- if (!container) {
1194
- throw new Error(`Element with ID "${elementId}" not found`);
1195
- }
1196
- const type = container.model.get("widgetType") || container.model.get("elType");
1197
- if (!type) {
1198
- throw new Error(`Element with ID "${elementId}" has no type`);
1199
- }
1200
- const elementType = getElementType(type);
1201
- if (!elementType) {
1202
- throw new Error(`Element type "${type}" is not atomic`);
1203
- }
1204
- const propsSchema = elementType.propsSchema;
1205
- const propKeys = Object.keys(propsSchema);
1206
- return getElementSettings(elementId, propKeys);
1207
- }
1208
-
1209
- // src/mcp/handlers/get-element-schema.ts
1210
- import { getStylesSchema } from "@elementor/editor-styles";
1211
- function handleGetElementSchema(elementType) {
1212
- const elementTypeData = getElementType(elementType);
1213
- if (!elementTypeData) {
1214
- throw new Error(`Element type "${elementType}" not found or is not atomic`);
1215
- }
1216
- return { ...elementTypeData, stylesSchema: getStylesSchema() };
1217
- }
1218
-
1219
- // src/mcp/handlers/get-selected.ts
1220
- function handleGetSelected() {
1221
- return getSelectedElements();
1222
- }
1223
-
1224
- // src/mcp/handlers/get-styles.ts
1225
- function handleGetStyles(elementId) {
1226
- const styles = getElementStyles(elementId);
1227
- if (!styles) {
1228
- return null;
1229
- }
1230
- return Object.fromEntries(
1231
- Object.entries(styles).map(([id, style]) => [
1232
- id,
1233
- {
1234
- id: style.id,
1235
- label: style.label,
1236
- type: style.type,
1237
- variants: style.variants.map((variant) => ({
1238
- meta: variant.meta,
1239
- props: variant.props,
1240
- custom_css: variant.custom_css
1241
- }))
1242
- }
1243
- ])
1244
- );
1245
- }
1246
-
1247
- // src/mcp/handlers/list-available-types.ts
1248
- function handleListAvailableTypes() {
1249
- const widgetsCache = getWidgetsCache();
1250
- if (!widgetsCache) {
1251
- return [];
1252
- }
1253
- const availableTypes = [];
1254
- Object.entries(widgetsCache).forEach(([type, config]) => {
1255
- if (config?.atomic_controls && config?.atomic_props_schema) {
1256
- availableTypes.push({
1257
- type,
1258
- title: config.title || type
1259
- });
1260
- }
1261
- });
1262
- return availableTypes;
1263
- }
1264
-
1265
- // src/mcp/handlers/move-element.ts
1266
- function handleMoveElement({
1267
- elementId,
1268
- targetContainerId
1269
- }) {
1270
- const container = getContainer(elementId);
1271
- if (!container) {
1272
- throw new Error(`Element with ID "${elementId}" not found`);
1273
- }
1274
- const targetContainer = getContainer(targetContainerId);
1275
- if (!targetContainer) {
1276
- throw new Error(`Target container with ID "${targetContainerId}" not found`);
1277
- }
1278
- moveElement({
1279
- elementId,
1280
- targetContainerId,
1281
- options: { useHistory: true }
1282
- });
1283
- return { success: true };
1284
- }
1285
-
1286
- // src/mcp/handlers/select-element.ts
1287
- function handleSelectElement(elementId) {
1288
- const container = getContainer(elementId);
1289
- if (!container) {
1290
- throw new Error(`Element with ID "${elementId}" not found`);
1291
- }
1292
- selectElement(elementId);
1293
- return { success: true };
1294
- }
1295
- function handleSelectMultipleElements(elementIds) {
1296
- elementIds.forEach((elementId) => {
1297
- const container = getContainer(elementId);
1298
- if (container) {
1299
- selectElement(elementId);
1300
- }
1301
- });
1302
- return { success: true };
1303
- }
1304
-
1305
- // src/mcp/handlers/update-props.ts
1306
- function handleUpdateProps({ elementId, props }) {
1307
- const container = getContainer(elementId);
1308
- if (!container) {
1309
- throw new Error(`Element with ID "${elementId}" not found`);
1310
- }
1311
- updateElementSettings({
1312
- id: elementId,
1313
- props,
1314
- withHistory: true
1315
- });
1316
- return { success: true };
1317
- }
1318
-
1319
- // src/mcp/handlers/update-styles.ts
1320
- function handleUpdateStyles({
1321
- elementId,
1322
- styleId,
1323
- styles,
1324
- breakpoint = "desktop",
1325
- state = null
1326
- }) {
1327
- const resolvedBreakpoint = resolveBreakpointId(breakpoint);
1328
- const resolvedState = state === null || state === void 0 ? null : state;
1329
- const elementStyles = getElementStyles(elementId);
1330
- if (!elementStyles) {
1331
- throw new Error(`Element with ID "${elementId}" has no styles. Create a style first.`);
1332
- }
1333
- const resolvedStyleId = styleId || Object.keys(elementStyles)[0];
1334
- if (!resolvedStyleId) {
1335
- throw new Error(`Element with ID "${elementId}" has no styles. Create a style first.`);
1336
- }
1337
- updateElementStyle({
1338
- elementId,
1339
- styleId: resolvedStyleId,
1340
- meta: { breakpoint: resolvedBreakpoint, state: resolvedState },
1341
- props: styles
1342
- });
1343
- return { success: true };
1344
- }
1345
-
1346
- // src/mcp/elements-tool.ts
1347
- var actionEnum = z.enum([
1348
- "get-element-schema",
1349
- "get-element-props",
1350
- "create-element",
1351
- "update-props",
1352
- "create-style",
1353
- "get-styles",
1354
- "update-styles",
1355
- "delete-style",
1356
- "delete",
1357
- "duplicate",
1358
- "move",
1359
- "select",
1360
- "deselect",
1361
- "deselect-all",
1362
- "get-selected",
1363
- "list-available-types"
1364
- ]);
1365
- var schema = {
1366
- action: actionEnum.describe("The element operation to perform."),
1367
- elementId: z.string().optional().describe("The ID of the target element"),
1368
- elementIds: z.array(z.string()).optional().describe("Array of element IDs for multi-element operations"),
1369
- elementType: z.string().optional().describe(
1370
- "The type of element to create. Must be an atomic element type (required for create-element and get-element-schema actions)"
1371
- ),
1372
- props: z.record(z.any()).optional().describe("Props object for creating or updating an element. Must match the element type's propsSchema."),
1373
- containerId: z.string().optional().describe(
1374
- 'Parent container ID for element creation or move operations. Use "document" if parent is the document root.'
1375
- ),
1376
- targetContainerId: z.string().optional().describe("Target container ID for move operations"),
1377
- styles: z.record(z.any()).optional().describe(
1378
- "Styles object for creating or updating element styles. Must match the element type's stylesSchema."
1379
- ),
1380
- styleId: z.string().optional().describe(
1381
- "Style definition ID for style operations. If not provided, the first available style will be used (for update/delete)."
1382
- ),
1383
- breakpoint: z.string().optional().describe('Breakpoint for style operations (e.g., "desktop", "tablet", "mobile"). Defaults to "desktop".'),
1384
- state: z.string().optional().describe('State for style operations (e.g., "hover", "active", or null). Defaults to null.'),
1385
- classesProp: z.string().optional().describe('Classes property name for create-style action. Defaults to "classes".'),
1386
- label: z.string().optional().describe('Label for create-style action. Defaults to "local".'),
1387
- custom_css: z.object({ raw: z.string() }).optional().describe("Custom CSS object with raw CSS string for create-style action.")
1388
- };
1389
- function routeAction(params) {
1390
- try {
1391
- switch (params.action) {
1392
- case "get-element-schema":
1393
- if (!params.elementType) {
1394
- throw new Error("elementType is required for get-element-schema action");
1395
- }
1396
- return handleGetElementSchema(params.elementType);
1397
- case "get-element-props":
1398
- if (!params.elementId) {
1399
- throw new Error("elementId is required for get-element-props action");
1400
- }
1401
- return handleGetElementProps(params.elementId);
1402
- case "create-element":
1403
- if (!params.elementType) {
1404
- throw new Error("elementType is required for create-element action");
1405
- }
1406
- if (!params.containerId) {
1407
- throw new Error("containerId is required for create-element action");
1408
- }
1409
- return handleCreateElement({
1410
- elementType: params.elementType,
1411
- containerId: params.containerId,
1412
- props: params.props,
1413
- styles: params.styles
1414
- });
1415
- case "update-props":
1416
- if (!params.elementId) {
1417
- throw new Error("elementId is required for update-props action");
1418
- }
1419
- if (!params.props) {
1420
- throw new Error("props is required for update-props action");
1421
- }
1422
- return handleUpdateProps({
1423
- elementId: params.elementId,
1424
- props: params.props
1425
- });
1426
- case "create-style":
1427
- if (!params.elementId) {
1428
- throw new Error("elementId is required for create-style action");
1429
- }
1430
- if (!params.styles) {
1431
- throw new Error("styles is required for create-style action");
1432
- }
1433
- return handleCreateStyle({
1434
- elementId: params.elementId,
1435
- styleId: params.styleId,
1436
- classesProp: params.classesProp,
1437
- label: params.label,
1438
- styles: params.styles,
1439
- breakpoint: params.breakpoint,
1440
- state: params.state,
1441
- customCss: params.custom_css
1442
- });
1443
- case "get-styles":
1444
- if (!params.elementId) {
1445
- throw new Error("elementId is required for get-styles action");
1446
- }
1447
- return handleGetStyles(params.elementId);
1448
- case "update-styles":
1449
- if (!params.elementId) {
1450
- throw new Error("elementId is required for update-styles action");
1451
- }
1452
- if (!params.styles) {
1453
- throw new Error("styles is required for update-styles action");
1454
- }
1455
- return handleUpdateStyles({
1456
- elementId: params.elementId,
1457
- styleId: params.styleId,
1458
- styles: params.styles,
1459
- breakpoint: params.breakpoint,
1460
- state: params.state
1461
- });
1462
- case "delete-style":
1463
- if (!params.elementId) {
1464
- throw new Error("elementId is required for delete-style action");
1465
- }
1466
- return handleDeleteStyle({
1467
- elementId: params.elementId,
1468
- styleId: params.styleId
1469
- });
1470
- case "delete":
1471
- if (!params.elementId) {
1472
- throw new Error("elementId is required for delete action");
1473
- }
1474
- return handleDeleteElement(params.elementId);
1475
- case "duplicate":
1476
- if (!params.elementId) {
1477
- throw new Error("elementId is required for duplicate action");
1478
- }
1479
- return handleDuplicateElement(params.elementId);
1480
- case "move":
1481
- if (!params.elementId) {
1482
- throw new Error("elementId is required for move action");
1483
- }
1484
- if (!params.targetContainerId) {
1485
- throw new Error("targetContainerId is required for move action");
1486
- }
1487
- return handleMoveElement({
1488
- elementId: params.elementId,
1489
- targetContainerId: params.targetContainerId
1490
- });
1491
- case "select":
1492
- if (params.elementIds && params.elementIds.length > 0) {
1493
- return handleSelectMultipleElements(params.elementIds);
1494
- }
1495
- if (!params.elementId) {
1496
- throw new Error("elementId or elementIds is required for select action");
1497
- }
1498
- return handleSelectElement(params.elementId);
1499
- case "deselect":
1500
- if (!params.elementId) {
1501
- throw new Error("elementId is required for deselect action");
1502
- }
1503
- return handleDeselectElement(params.elementId);
1504
- case "deselect-all":
1505
- return handleDeselectAllElements();
1506
- case "get-selected":
1507
- return handleGetSelected();
1508
- case "list-available-types":
1509
- return handleListAvailableTypes();
1510
- default:
1511
- throw new Error(`Unknown action: ${params.action}`);
1512
- }
1513
- } catch (error) {
1514
- const errorMessage = error instanceof Error ? error.message : String(error);
1515
- throw new Error(`Failed to execute action "${params.action}": ${errorMessage}`);
1516
- }
1517
- }
1518
- function initElementsTool() {
1519
- getMCPByDomain("elements").addTool({
1520
- name: "elements",
1521
- schema,
1522
- description: `This tool manages individual Elementor atomic elements (v4).
1523
-
1524
- **When to use this tool:**
1525
-
1526
- Use this tool to create, update, delete, duplicate, move, and select individual atomic elements, as well as retrieve their schemas and current props.
1527
-
1528
- **Available actions:**
1529
-
1530
- - \`list-available-types\`: List all available atomic element types.
1531
- - \`get-element-schema\`: Get the propsSchema and controls for an element type. Required before creating elements of a new type.
1532
- - \`get-element-props\`: Get the current prop values for an existing element.
1533
- - \`create-element\`: Create a new atomic element with specified props and styles (Important to match props and styles by the schema, use get-element-schema to get the schema first).
1534
- - \`update-props\`: Update props for an existing element.
1535
- - \`create-style\`: Create a new style definition for an element.
1536
- - \`get-styles\`: Get all style definitions for an element.
1537
- - \`update-styles\`: Update styles for an existing element's style variant.
1538
- - \`delete-style\`: Delete a style definition from an element.
1539
- - \`delete\`: Delete an element.
1540
- - \`duplicate\`: Duplicate an existing element.
1541
- - \`move\`: Move an element to a different container.
1542
- - \`select\`: Select one or more elements.
1543
- - \`deselect\`: Deselect a specific element.
1544
- - \`deselect-all\`: Deselect all selected elements.
1545
- - \`get-selected\`: Get currently selected elements.
1546
-
1547
- **Constraints:**
1548
-
1549
- - Before creating an element of a certain type for the first time, you MUST call \`get-element-schema\` to retrieve its schema.
1550
- - You can only update props for existing elements.
1551
- - All props must match the element type's propsSchema keys.
1552
- - Element types must be atomic (have atomic_controls and atomic_props_schema).
1553
- - Container IDs must exist and be valid before create/move operations.
1554
-
1555
- ** Must do with every operation **
1556
- As of the user can ask in multiple ways the creation of the element, you need to first get the list of available types with "list-available-types" action.
1557
- After getting it, convert to the most relevant type that the user requested and if this is not clear, request for user input.
1558
- After finding out the proper type, get the schema for it with "get-element-schema" action.
1559
-
1560
- ** Styles and Settings propUtils **
1561
- Getting the schema is important as it introduces the propUtils for the styles and settings.
1562
- You can use the propUtils to create, update, delete, and get the values of the styles and settings.
1563
- Settings exists in the result of the get-element-schema action -> propsSchema.
1564
- Styles exists in the result of the get-element-schema action -> stylesSchema.
1565
-
1566
- **Examples:**
1567
-
1568
- Get schema for heading element:
1569
- \`\`\`json
1570
- { "action": "get-element-schema", "elementType": "e-heading" }
1571
- \`\`\`
1572
-
1573
- Create a heading element:
1574
- \`\`\`json
1575
- { "action": "create-element", "elementType": "e-heading", "containerId": "document", "props": { "title": { $$type: "string", "value": "Hello World" } } }
1576
- \`\`\`
1577
-
1578
- Update element props:
1579
- \`\`\`json
1580
- { "action": "update-props", "elementId": "abc123", "props": { "title": "Updated Title" } }
1581
- \`\`\`
1582
-
1583
- Create element style:
1584
- \`\`\`json
1585
- { "action": "create-style", "elementId": "abc123", "styles": { "padding": "20px", "margin": "10px" } }
1586
- \`\`\`
1587
-
1588
- Get element styles:
1589
- \`\`\`json
1590
- { "action": "get-styles", "elementId": "abc123" }
1591
- \`\`\`
1592
-
1593
- Update element styles:
1594
- \`\`\`json
1595
- { "action": "update-styles", "elementId": "abc123", "styles": { "padding": "20px", "margin": "10px" } }
1596
- \`\`\`
1597
-
1598
- Delete element style:
1599
- \`\`\`json
1600
- { "action": "delete-style", "elementId": "abc123", "styleId": "style-id-123" }
1601
- \`\`\``,
1602
- handler: async (params) => {
1603
- return routeAction(params);
1604
- }
1605
- });
1606
- }
1607
-
1608
- // src/mcp/index.ts
1609
- function initMcp() {
1610
- const { setMCPDescription } = getMCPByDomain2("elements");
1611
- setMCPDescription("Tools for managing atomic elements in Elementor v4 editor");
1612
- initElementsTool();
1613
- }
1614
1007
  export {
1615
1008
  ELEMENT_STYLE_CHANGE_EVENT,
1616
1009
  createElement,
@@ -1638,7 +1031,6 @@ export {
1638
1031
  getLinkInLinkRestriction,
1639
1032
  getSelectedElements,
1640
1033
  getWidgetsCache,
1641
- initMcp as initElementsMcp,
1642
1034
  isElementAnchored,
1643
1035
  moveElement,
1644
1036
  moveElements,