mirror of
https://github.com/proelements/proelements.git
synced 2026-05-05 09:05:59 +00:00
68 lines
80 KiB
JavaScript
68 lines
80 KiB
JavaScript
!function(){"use strict";var e={d:function(t,n){for(var o in n)e.o(n,o)&&!e.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:n[o]})},o:function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r:function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{init:function(){return Wt}});var n=window.elementorV2.editor,o=window.elementorV2.editorComponents,r=window.elementorV2.editorControls,i=window.elementorV2.editorDocuments,a=window.elementorV2.editorEditingPanel,s=window.elementorV2.editorElementsPanel,l=window.elementorV2.editorMcp,c=window.elementorV2.editorPanels,p=window.elementorV2.editorV1Adapters,m=window.elementorV2.licenseApi,d=window.wp.i18n,u=window.React,g=window.elementorV2.editorCurrentUser,f=window.elementorV2.editorUi,h=window.elementorV2.icons,y=window.elementorV2.store,v=window.elementorV2.ui;function b(){const e=(0,y.__useSelector)(o.selectPath),t=(0,i.getV1DocumentsManager)();return(0,u.useCallback)(()=>{const{componentId:n,instanceId:r}=e.at(-2)??{};n&&r?(0,o.switchToComponent)(n,r):(0,o.switchToComponent)(t.getInitialId())},[e,t])}const E=({anchorRef:e,shouldShowIntroduction:t,onClose:n})=>e.current&&t?u.createElement(v.Popover,{anchorEl:e.current,open:t,anchorOrigin:{vertical:"top",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:-30},onClose:n},u.createElement(v.Box,{sx:{width:"296px"}},u.createElement(f.PopoverHeader,{title:(0,d.__)("Add your first property","elementor-pro"),onClose:n}),u.createElement(v.Image,{sx:{width:"296px",height:"160px"},src:"https://assets.elementor.com/packages/v1/images/components-properties-intro.png",alt:""}),u.createElement(r.PopoverContent,null,u.createElement(v.Stack,{sx:{p:2}},u.createElement(v.Typography,{variant:"body2"},(0,d.__)("Properties make instances flexible.","elementor-pro")),u.createElement(v.Typography,{variant:"body2"},(0,d.__)("Select any Element, then in the General tab, click next to any setting you want users to customize - like text, images, or links.","elementor-pro")),u.createElement(v.Typography,{variant:"body2",sx:{mt:2}},(0,d.__)("Your properties will appear in the Properties panel, where you can organize and manage them anytime.","elementor-pro")),u.createElement(v.Link,{href:"http://go.elementor.com/components-guide",target:"_blank",sx:{mt:2},color:"info.main",variant:"body2"},(0,d.__)("Learn more","elementor-pro")),u.createElement(v.Stack,{direction:"row",alignItems:"center",justifyContent:"flex-end",sx:{pt:1}},u.createElement(v.Button,{size:"medium",variant:"contained",onClick:n},(0,d.__)("Got it","elementor-pro"))))))):null;var _=window.elementorV2.utils;function C(e,t,n){const o=e.items[t];return o?o.props.includes(n)?e:{...e,items:{...e.items,[t]:{...o,props:[...o.props,n]}}}:e}function w(e,t,n){const o=e.items[t];return o?{...e,items:{...e.items,[t]:{...o,props:o.props.filter(e=>e!==n)}}}:e}var x=window.elementorV2.editorElements;function I(e,t,n,r){const i=(0,x.getContainer)(e);i&&((0,o.isComponentInstance)(i.model.toJSON())?function(e,t){const n=(0,x.getElementSetting)(e,"component_instance"),r=o.componentInstancePropTypeUtil.extract(n),i=o.componentInstanceOverridesPropTypeUtil.extract(r?.overrides);if(!i?.length)return;const a=T(i,t),s=o.componentInstancePropTypeUtil.create({...r,overrides:o.componentInstanceOverridesPropTypeUtil.create(a)});(0,x.updateElementSettings)({id:e,props:{component_instance:s},withHistory:!1})}(e,r):(0,x.updateElementSettings)({id:e,props:{[t]:n??null},withHistory:!1}))}function T(e,t){return e.map(e=>o.componentOverridablePropTypeUtil.isValid(e)?o.componentInstanceOverridePropTypeUtil.isValid(e.value.origin_value)?t&&e.value.override_key!==t?e:e.value.origin_value:null:e).filter(e=>null!==e)}function P(e){let t=!1;const n={};for(const[r,i]of Object.entries(e))o.componentOverridablePropTypeUtil.isValid(i)?(n[r]=i.value.origin_value,t=!0):n[r]=i;return{hasChanges:t,settings:n}}function S(e){const t={...e};if((0,o.isComponentInstance)({widgetType:e.widgetType,elType:e.elType}))t.settings=function(e){if(!e?.component_instance)return e;const t=o.componentInstancePropTypeUtil.extract(e.component_instance),n=o.componentInstanceOverridesPropTypeUtil.extract(t?.overrides);if(!n?.length)return e;const r=T(n);return{...e,component_instance:o.componentInstancePropTypeUtil.create({...t,overrides:o.componentInstanceOverridesPropTypeUtil.create(r)})}}(e.settings);else if(t.settings){const{settings:e}=P(t.settings);t.settings=e}return t.elements&&(t.elements=t.elements.map(S)),t}function k({componentId:e,propKey:t,source:n}){const r=o.componentsSelectors.getOverridableProps(e);if(!r||0===Object.keys(r.props).length)return;const i=Array.isArray(t)?t:[t],a=[];for(const e of i){const t=r.props[e];t&&(a.push(t),I(t.elementId,t.propKey,t.originValue,e))}if(0===a.length)return;const s=Object.fromEntries(Object.entries(r.props).filter(([e])=>!i.includes(e))),l=function(e,t){const n=Array.isArray(t)?t:[t];return{...e,items:Object.fromEntries(Object.entries(e.items).map(([e,t])=>[e,{...t,props:t.props.filter(e=>!n.includes(e))}]))}}(r.groups,t);o.componentsActions.setOverridableProps(e,{...r,props:s,groups:l});const c=o.componentsSelectors.getCurrentComponent();for(const e of a)(0,o.trackComponentEvent)({action:"propertyRemoved",source:n,component_uid:c?.uid,property_id:e.overrideKey,property_path:e.propKey,property_name:e.label,element_type:e.widgetType??e.elType})}function O({introductionRef:e}){const[t,n]=(0,u.useState)(!1);return u.createElement(u.Fragment,null,u.createElement(v.Stack,{alignItems:"center",justifyContent:"flex-start",height:"100%",color:"text.secondary",sx:{px:2.5,pt:10,pb:5.5},gap:1},u.createElement(h.ComponentPropListIcon,{fontSize:"large"}),u.createElement(v.Typography,{align:"center",variant:"subtitle2"},(0,d.__)("Add your first property","elementor-pro")),u.createElement(v.Typography,{align:"center",variant:"caption"},(0,d.__)("Make instances flexible while keeping design synced.","elementor-pro")),u.createElement(v.Typography,{align:"center",variant:"caption"},(0,d.__)("Select any element, then click + next to a setting to expose it.","elementor-pro")),u.createElement(v.Link,{variant:"caption",color:"secondary",sx:{textDecorationLine:"underline"},onClick:()=>n(!0)},(0,d.__)("Learn more","elementor-pro"))),u.createElement(E,{anchorRef:e,shouldShowIntroduction:t,onClose:()=>n(!1)}))}const D={EMPTY_NAME:(0,d.__)("Property name is required","elementor-pro"),DUPLICATE_NAME:(0,d.__)("Property name already exists","elementor-pro")};function A(e,t,n){const o=e.trim();if(!o)return{isValid:!1,errorMessage:D.EMPTY_NAME};const r=o.toLowerCase(),i=n?.trim().toLowerCase();return t.some(e=>{const t=e.trim().toLowerCase();return(!i||t!==i)&&t===r})?{isValid:!1,errorMessage:D.DUPLICATE_NAME}:{isValid:!0,errorMessage:null}}function R(){return R=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},R.apply(null,arguments)}const z="tiny",M={value:null,label:(0,d.__)("Default","elementor-pro")};function U({onSubmit:e,groups:t,currentValue:n,existingLabels:o=[],sx:r}){const i=t?.length?t:[M],[a,s]=(0,u.useState)(n?.label??null),[l,c]=(0,u.useState)(n?.groupId??i[0]?.value??null),[p,m]=(0,u.useState)(null),g=(0,d.__)("Name","elementor-pro"),h=(0,d.__)("Group Name","elementor-pro"),y=void 0===n,b=y?(0,d.__)("Create new property","elementor-pro"):(0,d.__)("Update property","elementor-pro"),E=y?(0,d.__)("Create","elementor-pro"):(0,d.__)("Update","elementor-pro");return u.createElement(f.Form,{onSubmit:()=>{const t=A(a??"",o,n?.label);t.isValid?e({label:a??"",group:l}):m(t.errorMessage)},"data-testid":"overridable-prop-form"},u.createElement(v.Stack,{alignItems:"start",sx:{width:"268px",...r}},u.createElement(v.Stack,{direction:"row",alignItems:"center",py:1,px:1.5,sx:{columnGap:.5,borderBottom:"1px solid",borderColor:"divider",width:"100%",mb:1.5}},u.createElement(v.Typography,{variant:"caption",sx:{color:"text.primary",fontWeight:"500",lineHeight:1}},b)),u.createElement(v.Grid,{container:!0,gap:.75,alignItems:"start",px:1.5,mb:1.5},u.createElement(v.Grid,{item:!0,xs:12},u.createElement(v.FormLabel,{size:"tiny"},g)),u.createElement(v.Grid,{item:!0,xs:12},u.createElement(v.TextField,{name:g,size:z,fullWidth:!0,placeholder:(0,d.__)("Enter value","elementor-pro"),value:a??"",onChange:e=>{const t=e.target.value;s(t);const r=A(t,o,n?.label);m(r.errorMessage)},error:Boolean(p),helperText:p}))),u.createElement(v.Grid,{container:!0,gap:.75,alignItems:"start",px:1.5,mb:1.5},u.createElement(v.Grid,{item:!0,xs:12},u.createElement(v.FormLabel,{size:"tiny"},h)),u.createElement(v.Grid,{item:!0,xs:12},u.createElement(v.Select,{name:h,size:z,fullWidth:!0,value:l??null,onChange:e=>c(e.target.value),displayEmpty:!0,renderValue:e=>e?i.find(({value:t})=>t===e)?.label??e:i[0].label},i.map(({label:e,...t})=>u.createElement(f.MenuListItem,R({key:t.value},t,{value:t.value??""}),e))))),u.createElement(v.Stack,{direction:"row",justifyContent:"flex-end",alignSelf:"end",mt:1.5,py:1,px:1.5},u.createElement(v.Button,{type:"submit",disabled:!a||Boolean(p),variant:"contained",color:"primary",size:"small"},E))))}function L(){return L=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},L.apply(null,arguments)}const j=e=>u.createElement(v.UnstableSortableProvider,L({restrictAxis:!0,variant:"static",dragPlaceholderStyle:{opacity:"1"}},e)),N=({triggerClassName:e,...t})=>u.createElement(B,L({},t,{role:"button",className:`sortable-trigger ${e??""}`.trim(),"aria-label":"sort"}),u.createElement(h.GripVerticalIcon,{fontSize:"tiny"})),V=({children:e,id:t})=>u.createElement(v.UnstableSortableItem,{id:t,render:({itemProps:t,isDragged:n,triggerProps:o,itemStyle:r,triggerStyle:i,dropIndicationStyle:a,showDropIndication:s,isDragOverlay:l,isDragPlaceholder:c})=>u.createElement(v.Box,L({},t,{style:r,component:"div",role:"listitem",sx:{backgroundColor:l?"background.paper":void 0}}),e({isDragged:n,isDragPlaceholder:c,triggerProps:o,triggerStyle:i}),s&&u.createElement($,{style:a}))}),B=(0,v.styled)("div")(({theme:e})=>({position:"absolute",left:"-2px",top:"50%",transform:`translate( -${e.spacing(1.5)}, -50% )`,color:e.palette.action.active,cursor:"grab"})),$=(0,v.styled)(v.Box)`
|
|
width: 100%;
|
|
height: 1px;
|
|
background-color: ${({theme:e})=>e.palette.text.primary};
|
|
`;function q(){return q=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},q.apply(null,arguments)}function K({prop:e,sortableTriggerProps:t,isDragPlaceholder:n,groups:o,existingLabels:r,onDelete:i,onUpdate:a}){const s=(0,v.usePopupState)({variant:"popover"}),l=function(e){const t="widget"===e.elType?e.widgetType:e.elType,n=(0,x.getWidgetsCache)();if(!n)return"eicon-apps";const o=n[t];return o?.icon||"eicon-apps"}(e),c=(0,v.bindPopover)(s);return u.createElement(u.Fragment,null,u.createElement(v.Box,q({},(0,v.bindTrigger)(s),{sx:{position:"relative",pl:.5,pr:1,py:.25,minHeight:28,borderRadius:1,border:"1px solid",borderColor:"divider",display:"flex",alignItems:"center",gap:.5,opacity:n?.5:1,cursor:"pointer","&:hover":{backgroundColor:"action.hover"},"&:hover .sortable-trigger":{visibility:"visible"},"& .sortable-trigger":{visibility:"hidden"},"&:hover .delete-button":{visibility:"visible"},"& .delete-button":{visibility:"hidden"}}}),u.createElement(N,t),u.createElement(v.Box,{sx:{display:"flex",alignItems:"center",color:"text.primary",fontSize:12,padding:.25}},u.createElement("i",{className:l})),u.createElement(v.Typography,{variant:"caption",sx:{color:"text.primary",flexGrow:1,fontSize:10}},e.label),u.createElement(v.IconButton,{size:"tiny",onClick:t=>{t.stopPropagation(),i(e.overrideKey)},"aria-label":"Delete property",sx:{p:.25}},u.createElement(h.XIcon,{fontSize:"tiny"}))),u.createElement(v.Popover,q({},c,{anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},PaperProps:{sx:{width:s.anchorEl?.getBoundingClientRect().width}}}),u.createElement(U,{onSubmit:e=>{a(e),s.close()},currentValue:e,groups:o,existingLabels:r,sx:{width:"100%"}})))}function F(){return F=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},F.apply(null,arguments)}function G({group:e,props:t,allGroups:n,sortableTriggerProps:o,isDragPlaceholder:r,onPropsReorder:i,onPropertyDelete:a,onPropertyUpdate:s,onGroupDelete:l,editableLabelProps:c}){const p=e.props.map(e=>t[e]).filter(e=>Boolean(e)),m=(0,v.usePopupState)({variant:"popover",disableAutoFocus:!0}),{editableRef:g,isEditing:y,error:b,getEditableProps:E,setEditingGroupId:_,editingGroupId:C}=c,w=e.props.length>0,x=y&&C===e.id;return u.createElement(v.Box,{sx:{opacity:r?.5:1}},u.createElement(v.Stack,{gap:1},u.createElement(v.Box,{className:"group-header",sx:{position:"relative","&:hover .group-sortable-trigger":{visibility:"visible"},"& .group-sortable-trigger":{visibility:"hidden"},"&:hover .group-menu":{visibility:"visible"},"& .group-menu":{visibility:"hidden"}}},u.createElement(N,F({triggerClassName:"group-sortable-trigger"},o)),u.createElement(v.Stack,{direction:"row",alignItems:"center",justifyContent:"space-between",gap:2},x?u.createElement(v.Box,{sx:{height:28,display:"flex",alignItems:"center",border:2,borderColor:"text.secondary",borderRadius:1,pl:.5,flexGrow:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",width:"100%"}},u.createElement(f.EditableField,F({ref:g,as:v.Typography,variant:"caption",error:b??void 0,sx:{color:"text.primary",fontWeight:400,lineHeight:1.66}},E()))):u.createElement(f.EllipsisWithTooltip,{title:e.label,as:v.Typography,variant:"caption",sx:{color:"text.primary",fontWeight:400,lineHeight:1.66}}),u.createElement(v.IconButton,F({className:"group-menu",size:"tiny",sx:{p:.25,visibility:x?"visible":void 0},"aria-label":(0,d.__)("Group actions","elementor-pro")},(0,v.bindTrigger)(m)),u.createElement(h.DotsVerticalIcon,{fontSize:"tiny"})))),u.createElement(v.List,{sx:{p:0,display:"flex",flexDirection:"column",gap:1}},u.createElement(j,{value:e.props,onChange:i},p.map(e=>u.createElement(V,{key:e.overrideKey,id:e.overrideKey},({triggerProps:o,triggerStyle:r,isDragPlaceholder:i})=>u.createElement(K,{prop:e,sortableTriggerProps:{...o,style:r},isDragPlaceholder:i,groups:n,existingLabels:Object.values(t).map(e=>e.label),onDelete:a,onUpdate:t=>s(e.overrideKey,t)})))))),u.createElement(v.Menu,F({},(0,v.bindMenu)(m),{anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"}}),u.createElement(f.MenuListItem,{sx:{minWidth:"160px"},onClick:()=>{m.close(),_(e.id)}},u.createElement(v.Typography,{variant:"caption",sx:{color:"text.primary"}},(0,d.__)("Rename","elementor-pro"))),u.createElement(v.Tooltip,{title:w?(0,d.__)("To delete the group, first remove all the properties","elementor-pro"):"",placement:"right"},u.createElement("span",null,u.createElement(f.MenuListItem,{onClick:()=>{m.close(),l(e.id)},disabled:w},u.createElement(v.Typography,{variant:"caption",sx:{color:w?"text.disabled":"error.light"}},(0,d.__)("Delete","elementor-pro")))))))}const W={EMPTY_NAME:(0,d.__)("Group name is required","elementor-pro"),DUPLICATE_NAME:(0,d.__)("Group name already exists","elementor-pro")};const H="New group";function Y({onClose:e}){const t=(0,o.useCurrentComponentId)(),n=(0,o.useSanitizeOverridableProps)(t),[r,a]=(0,u.useState)(!1),s=(0,u.useRef)(null),l=function(){const[e,t]=(0,u.useState)(null),n=(0,o.useCurrentComponentId)(),r=(0,o.useOverridableProps)(n),a=r?.groups?.items??{},s=e?a[e]:null,{ref:l,openEditMode:c,isEditing:p,error:m,getProps:g}=(0,f.useEditable)({value:s?.label??"",onSubmit:t=>{if(!e||!n)throw new Error((0,d.__)("Group ID or component ID is missing","elementor-pro"));!function({componentId:e,groupId:t,label:n}){const r=o.componentsSelectors.getOverridableProps(e);if(!r)return!1;if(!r.groups.items[t])return!1;const i=function(e,t,n){const o=e.items[t];return o?{...e,items:{...e.items,[t]:{...o,label:n}}}:e}(r.groups,t,n);o.componentsActions.setOverridableProps(e,{...r,groups:i})}({componentId:n,groupId:e,label:t}),(0,i.setDocumentModifiedStatus)(!0)},validation:t=>function(e,t){const n=e.trim();return n?Object.values(t).some(e=>e.label===n)?W.DUPLICATE_NAME:"":W.EMPTY_NAME}(t,Object.fromEntries(Object.entries(a).filter(([t])=>t!==e)))||null});return{editableRef:l,isEditing:p,error:m,getEditableProps:g,setEditingGroupId:e=>{t(e),c()},editingGroupId:e}}(),p=(0,u.useMemo)(()=>n?n.groups.order.map(e=>n.groups.items[e]??null).filter(Boolean):[],[n]),m=(0,u.useMemo)(()=>p.map(e=>({value:e.id,label:e.label})),[p]);if(!t||!n)return null;const g=!(p.length>0||r),y=n.groups.order,b=e=>{k({componentId:t,propKey:e,source:"user"}),(0,i.setDocumentModifiedStatus)(!0)},E=(e,n)=>{(function({componentId:e,overrideKey:t,label:n,groupId:r}){const i=o.componentsSelectors.getOverridableProps(e);if(!i)return;const a=i.props[t];if(!a)return;const s=a.groupId,l=r??s,c={...a,label:n,groupId:l},p=(m=i.groups,d=t,(u=s)===(g=l)?m:C(w(m,u,d),g,d));var m,d,u,g;o.componentsActions.setOverridableProps(e,{...i,props:{...i.props,[t]:c},groups:p})})({componentId:t,overrideKey:e,label:n.label,groupId:n.group}),(0,i.setDocumentModifiedStatus)(!0)},x=e=>{!function({componentId:e,groupId:t}){const n=o.componentsSelectors.getOverridableProps(e);if(!n)return!1;const r=n.groups.items[t];if(!r||r.props.length>0)return!1;const i=function(e,t){const{[t]:n,...o}=e.items;return{items:o,order:e.order.filter(e=>e!==t)}}(n.groups,t);o.componentsActions.setOverridableProps(e,{...n,groups:i})}({componentId:t,groupId:e}),(0,i.setDocumentModifiedStatus)(!0)};return u.createElement(u.Fragment,null,u.createElement(c.PanelHeader,{sx:{justifyContent:"start",pl:1.5,pr:1,py:1}},u.createElement(v.Stack,{direction:"row",alignItems:"center",gap:.5,flexGrow:1},u.createElement(h.ComponentPropListIcon,{fontSize:"tiny"}),u.createElement(c.PanelHeaderTitle,{variant:"subtitle2"},(0,d.__)("Component properties","elementor-pro"))),!g&&u.createElement(v.Tooltip,{title:(0,d.__)("Add new group","elementor-pro")},u.createElement(v.IconButton,{size:"tiny","aria-label":(0,d.__)("Add new group","elementor-pro"),onClick:()=>{if(r)return;const e=(0,_.generateUniqueId)("group"),n=function(e){const t=new Set(e.map(e=>e.label));if(!t.has(H))return H;let n=1,o=`${H}-${n}`;for(;t.has(o);)n++,o=`${H}-${n}`;return o}(p);!function({componentId:e,groupId:t,label:n,source:r}){const i=o.componentsSelectors.getCurrentComponent(),a=o.componentsSelectors.getOverridableProps(e);if(!a)return;const s={id:t,label:n,props:[]};o.componentsActions.setOverridableProps(e,{...a,groups:{...a.groups,items:{...a.groups.items,[t]:s},order:[t,...a.groups.order]}}),(0,o.trackComponentEvent)({action:"propertiesGroupCreated",source:r,component_uid:i?.uid,group_name:n})}({componentId:t,groupId:e,label:n,source:"user"}),(0,i.setDocumentModifiedStatus)(!0),a(!1),l.setEditingGroupId(e)}},u.createElement(h.FolderPlusIcon,{fontSize:"tiny"}))),u.createElement(v.Tooltip,{title:(0,d.__)("Close panel","elementor-pro")},u.createElement(v.IconButton,{ref:s,size:"tiny","aria-label":(0,d.__)("Close panel","elementor-pro"),onClick:e},u.createElement(h.XIcon,{fontSize:"tiny"})))),u.createElement(v.Divider,null),u.createElement(c.PanelBody,null,g?u.createElement(O,{introductionRef:s}):u.createElement(v.List,{sx:{p:2,display:"flex",flexDirection:"column",gap:2}},u.createElement(j,{value:y,onChange:e=>{!function({componentId:e,newOrder:t}){const n=o.componentsSelectors.getOverridableProps(e);n&&o.componentsActions.setOverridableProps(e,{...n,groups:{...n.groups,order:t}})}({componentId:t,newOrder:e}),(0,i.setDocumentModifiedStatus)(!0)}},p.map(e=>u.createElement(V,{key:e.id,id:e.id},({triggerProps:r,triggerStyle:s,isDragPlaceholder:c})=>u.createElement(G,{group:e,props:n.props,allGroups:m,allGroupsRecord:n.groups.items,sortableTriggerProps:{...r,style:s},isDragPlaceholder:c,setIsAddingGroup:a,onPropsReorder:n=>{return r=e.id,function({componentId:e,groupId:t,newPropsOrder:n}){const r=o.componentsSelectors.getOverridableProps(e);if(!r)return;const i=r.groups.items[t];i&&o.componentsActions.setOverridableProps(e,{...r,groups:{...r.groups,items:{...r.groups.items,[t]:{...i,props:n}}}})}({componentId:t,groupId:r,newPropsOrder:n}),void(0,i.setDocumentModifiedStatus)(!0);var r},onPropertyDelete:b,onPropertyUpdate:E,editableLabelProps:l,onGroupDelete:x})))))))}const{panel:J,usePanelActions:X}=(0,c.__createPanel)({id:"component-properties-panel",component:function(){const{close:e}=X(),{open:t}=(0,a.usePanelActions)();return u.createElement(f.ThemeProvider,null,u.createElement(v.ErrorBoundary,{fallback:u.createElement(Z,null)},u.createElement(c.Panel,null,u.createElement(Y,{onClose:()=>{e(),t()}}))))}}),Z=()=>u.createElement(v.Box,{role:"alert",sx:{minHeight:"100%",p:2}},u.createElement(v.Alert,{severity:"error",sx:{mb:2,maxWidth:400,textAlign:"center"}},u.createElement("strong",null,(0,d.__)("Something went wrong","elementor-pro")))),Q=u.forwardRef(({overridablePropsCount:e,onClick:t},n)=>{const o=function(e){const t=(0,u.useRef)(e);return(0,u.useEffect)(()=>{t.current=e},[e]),t.current}(e),r=0===o&&1===e;return u.createElement(ee,{ref:n,color:"primary",key:e,invisible:0===e,animate:r,anchorOrigin:{vertical:"top",horizontal:"right"},badgeContent:u.createElement(v.Box,{sx:{animation:r?"none":`${ne} 300ms ease-out`}},e)},u.createElement(v.Tooltip,{title:(0,d.__)("Component properties","elementor-pro")},u.createElement(v.ToggleButton,{value:"exposed properties",size:"tiny",onClick:t,"aria-label":(0,d.__)("Component properties","elementor-pro")},u.createElement(h.ComponentPropListIcon,{fontSize:"tiny"}))))}),ee=(0,v.styled)(v.Badge,{shouldForwardProp:e=>"animate"!==e})(({theme:e,animate:t})=>({"& .MuiBadge-badge":{minWidth:e.spacing(2),height:e.spacing(2),minHeight:e.spacing(2),maxWidth:e.spacing(2),fontSize:e.typography.caption.fontSize,animation:t?`${te} 300ms ease-out`:"none"}})),te=v.keyframes`
|
|
0% { transform: scale(0) translate(50%, 50%); opacity: 0; }
|
|
70% { transform: scale(1.1) translate(50%, -50%); opacity: 1; }
|
|
100% { transform: scale(1) translate(50%, -50%); opacity: 1; }
|
|
`,ne=v.keyframes`
|
|
from { transform: translateY(100%); opacity: 0; }
|
|
to { transform: translateY(0); opacity: 1; }
|
|
`,oe=()=>{const{id:e,uid:t}=(0,o.useCurrentComponent)()??{id:null,uid:null},n=(0,o.useSanitizeOverridableProps)(e),r=b(),a=function(){const e=(0,y.__getState)()[o.SLICE_NAME].path,{instanceTitle:t}=e.at(-1)??{};if(t)return t;const n=(0,i.getV1DocumentsManager)().getCurrent();return n?.container?.settings?.get("post_title")??""}(),[s,l]=(0,g.useSuppressedMessage)("components-properties-introduction"),[p,m]=u.useState(!s),{open:_}=X(),C=n?Object.keys(n.props).length:0,w=u.useRef(null);return e?u.createElement(v.Box,{"data-testid":"component-panel-header"},u.createElement(c.PanelHeader,{sx:{justifyContent:"start",px:2}},u.createElement(v.Tooltip,{title:(0,d.__)("Back","elementor-pro")},u.createElement(v.IconButton,{size:"tiny",onClick:r,"aria-label":(0,d.__)("Back","elementor-pro")},u.createElement(h.ArrowLeftIcon,{fontSize:"tiny"}))),u.createElement(h.ComponentsFilledIcon,{fontSize:"tiny",stroke:"currentColor"}),u.createElement(f.EllipsisWithTooltip,{title:a,as:v.Typography,variant:"caption",sx:{fontWeight:500,flexGrow:1}}),u.createElement(Q,{overridablePropsCount:C,ref:w,onClick:()=>{_(),(0,o.trackComponentEvent)({action:"propertiesPanelOpened",source:"user",component_uid:t,properties_count:C})}})),u.createElement(v.Divider,null),u.createElement(E,{anchorRef:w,shouldShowIntroduction:p,onClose:()=>{l(),m(!1)}})):null};var re=window.elementorV2.editorCanvas,ie=window.elementorV2.editorNotifications;var ae=window.elementorV2.schema;const se=ae.z.string().trim().max(50,(0,d.__)("Component name is too long. Please keep it under 50 characters.","elementor-pro")),le=e=>ae.z.object({componentName:se.refine(t=>!e.includes(t),{message:(0,d.__)("Component name already exists","elementor-pro")})}),ce=e=>{const t=le(e);return t.extend({componentName:t.shape.componentName.refine(e=>e.length>0,{message:(0,d.__)("Component name is required.","elementor-pro")}).refine(e=>e.length>=2,{message:(0,d.__)("Component name is too short. Please enter at least 2 characters.","elementor-pro")})})},pe=e=>({elType:"widget",widgetType:"e-component",settings:{component_instance:{$$type:"component-instance",value:{component_id:{$$type:"number",value:e.id??e.uid}}}},editor_settings:{component_uid:e.uid}});function me({open:e,onClose:t,onConfirm:n}){return u.createElement(f.ConfirmationDialog,{open:e,onClose:t},u.createElement(f.ConfirmationDialog.Title,null,(0,d.__)("Delete this component?","elementor-pro")),u.createElement(f.ConfirmationDialog.Content,null,u.createElement(f.ConfirmationDialog.ContentText,null,(0,d.__)("Existing instances on your pages will remain functional. You will no longer find this component in your list.","elementor-pro"))),u.createElement(f.ConfirmationDialog.Actions,{onClose:t,onConfirm:n}))}function de(){return de=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},de.apply(null,arguments)}function ue({component:e}){const t=(0,u.useRef)(null),[n,r]=(0,u.useState)(!1),{canRename:a,canDelete:s}=(0,o.useComponentsPermissions)(),{data:l=!0,isPending:c}=(0,m.useIsLicenseExpired)(),p=(a||s)&&!l,{ref:g,isEditing:y,openEditMode:b,error:E,getProps:_}=(0,f.useEditable)({value:e.name,onSubmit:t=>((e,t)=>{o.componentsActions.rename(e,t),(0,i.setDocumentModifiedStatus)(!0),function(e){const t=function(){const e=(0,i.getV1DocumentsManager)();return e?.getCurrent()?.container}();if(!t)return;const n=function(e,t){return(0,x.getAllDescendants)(e).filter(e=>{const n=e.model.get("widgetType"),r=e.model.get("editor_settings");return n===o.COMPONENT_WIDGET_TYPE&&r?.component_uid===t})}(t,e);n.forEach(e=>{e.model.trigger?.("title_external_change")})}(e)})(e.uid,t),validation:fe}),C=pe(e),w=(0,v.usePopupState)({variant:"popover",disableAutoFocus:!0});return u.createElement(ye,{isAnimating:c},u.createElement(f.WarningInfotip,{open:Boolean(E),text:E??"",placement:"bottom",width:t.current?.getBoundingClientRect().width,offset:[0,-15]},u.createElement(o.ComponentItem,{ref:t,component:e,disabled:l,draggable:!l,onDragStart:e=>(0,re.startDragElementFromPanel)(C,e),onDragEnd:()=>{(0,o.loadComponentsAssets)([C]),(0,re.endDragElementFromPanel)()},onClick:()=>{ge(C)},isEditing:y,error:E,nameSlot:u.createElement(o.ComponentName,{name:e.name,editable:{ref:g,isEditing:y,getProps:_}}),endSlot:p?u.createElement(v.IconButton,de({size:"tiny"},(0,v.bindTrigger)(w),{"aria-label":"More actions"}),u.createElement(h.DotsVerticalIcon,{fontSize:"tiny"})):void 0})),p&&u.createElement(v.Menu,de({},(0,v.bindMenu)(w),{anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"}}),a&&u.createElement(f.MenuListItem,{sx:{minWidth:"160px"},primaryTypographyProps:{variant:"caption",color:"text.primary"},onClick:()=>{w.close(),b()}},(0,d.__)("Rename","elementor-pro")),s&&u.createElement(f.MenuListItem,{sx:{minWidth:"160px"},primaryTypographyProps:{variant:"caption",color:"error.light"},onClick:()=>{r(!0),w.close()}},(0,d.__)("Delete","elementor-pro"))),u.createElement(me,{open:n,onClose:()=>{r(!1)},onConfirm:()=>{if(!e.id)throw new Error("Component ID is required");var t,n;r(!1),t=e.id,n=e.name,o.componentsActions.archive(t),(0,i.setDocumentModifiedStatus)(!0),(0,ie.notify)(((e,t)=>({type:"success",message:(0,d.__)("Successfully deleted component %s","elementor-pro").replace("%s",t),id:`success-archived-components-notification-${e}`}))(t,n))}}))}const ge=e=>{const{container:t,options:n}=(()=>{const e=(0,x.getCurrentDocumentContainer)(),t=function(){const e=(0,x.getSelectedElements)();if(1===e.length)return(0,x.getContainer)(e[0].id)}();let n,o;if(t)switch(t.model.get("elType")){case"widget":{n=t?.parent;const e=t.view?._index??-1;e>-1&&(o={at:e+1});break}case"section":n=t?.children?.[0];break;default:n=t}return{container:n??e,options:o}})();if(!t)throw new Error("Can't find container to drop new component instance at");(0,o.loadComponentsAssets)([e]),(0,x.dropElement)({containerId:t.id,model:e,options:{...n,useHistory:!1,scrollIntoView:!0}})},fe=e=>{const t=function(e){const t=o.componentsSelectors.getComponents()?.map(({name:e})=>e)??[],n=ce(t).safeParse({componentName:e.toLowerCase()});if(n.success)return{isValid:!0,errorMessage:null};const r=n.error.format();return{isValid:!1,errorMessage:r.componentName?._errors[0]??r._errors[0]}}(e);return t.errorMessage?t.errorMessage:null},he=v.keyframes`
|
|
0%, 100% { opacity: 0.4; }
|
|
50% { opacity: 0.8; }
|
|
`,ye=({children:e,isAnimating:t})=>u.createElement(v.Stack,{sx:{animation:t?`${he} 1.5s ease-in-out infinite`:void 0}},e);var ve=window.elementorV2.events;const be=()=>{const{canCreate:e}=(0,o.useComponentsPermissions)();return e&&(0,l.isAngieAvailable)()?u.createElement(v.Box,{sx:{position:"sticky",bottom:0,backgroundColor:"background.default",px:2,pb:2}},u.createElement(v.Stack,{gap:1},u.createElement(v.Divider,null),u.createElement(v.Stack,{direction:"row",alignItems:"center",justifyContent:"space-between"},u.createElement(v.Typography,{variant:"caption",color:"text.secondary"},(0,d.__)("Create components with Angie","elementor-pro")),u.createElement(v.Button,{variant:"text",size:"small",startIcon:u.createElement(h.AIIcon,{fontSize:"small"}),onClick:()=>{(0,ve.trackEvent)({eventName:"angie_cta_clicked",entry_point:"components_tab",has_angie_installed:!0}),(0,l.sendPromptToAngie)("Tell Angie what component you want to build")},sx:{color:"#c00bb9",px:"5px",py:"4px",minWidth:"auto"}},(0,d.__)("Create","elementor-pro"))))):null},Ee=()=>u.createElement(v.Box,{sx:{px:2.5,pb:2,position:"sticky",bottom:0,zIndex:1e3}},u.createElement(v.Alert,{variant:"standard",color:"promotion",icon:u.createElement(h.CrownFilledIcon,{fontSize:"tiny"}),"aria-label":"expired-components-promotion",action:u.createElement(v.AlertAction,{color:"promotion",variant:"contained",href:"https://go.elementor.com/renew-license-components-exist-footer/",target:"_blank",rel:"noopener noreferrer"},(0,d.__)("Upgrade Now","elementor-pro")),sx:{maxWidth:296}},u.createElement(v.Box,{sx:{gap:.5,display:"flex",flexDirection:"column"}},u.createElement(v.AlertTitle,null,(0,d.__)("Create New Components","elementor-pro")),u.createElement(v.Typography,{variant:"caption"},(0,d.__)("Your Pro subscription has expired. Renew to create new components.","elementor-pro"))))),_e={fontSize:"0.875rem !important",fontWeight:"500 !important"},Ce=()=>u.createElement(v.Stack,{alignItems:"center",justifyContent:"start",sx:{px:2,pt:4},gap:1.75,overflow:"hidden"},u.createElement(h.ComponentsIcon,{fontSize:"large",sx:{color:"text.secondary"}}),u.createElement(v.Typography,{align:"center",variant:"subtitle2",color:"text.secondary",sx:_e},(0,d.__)("Create Reusable Components","elementor-pro")),u.createElement(v.Typography,{align:"center",variant:"caption",color:"text.secondary"},(0,d.__)("Create design elements that sync across your entire site.","elementor-pro")),u.createElement(f.CtaButton,{size:"small",href:"https://go.elementor.com/renew-license-components/"}));function we({open:e,onClose:t,prompt:n}){const[o,r]=(0,u.useState)("idle"),i=()=>{"installing"!==o&&(r("idle"),t())};return u.createElement(v.Dialog,{fullWidth:!0,maxWidth:"md",open:e,onClose:i},u.createElement(v.IconButton,{"aria-label":(0,d.__)("Close","elementor-pro"),onClick:i,sx:{position:"absolute",right:8,top:8,zIndex:1}},u.createElement(h.XIcon,null)),u.createElement(v.DialogContent,{sx:{p:0,overflow:"hidden"}},u.createElement(v.Stack,{direction:"row",sx:{height:400}},u.createElement(v.Image,{sx:{height:"100%",aspectRatio:"1 / 1",objectFit:"cover",objectPosition:"right center"},src:"https://assets.elementor.com/packages/v1/images/angie-components-promotion.svg"}),u.createElement(v.Stack,{gap:2,justifyContent:"center",p:4},u.createElement(v.Typography,{variant:"h6",fontWeight:600,whiteSpace:"nowrap"},"error"===o?(0,d.__)("Installation failed","elementor-pro"):(0,d.__)("Install Angie to build components","elementor-pro")),u.createElement(v.Typography,{variant:"body2",color:"text.secondary"},"error"===o?(0,d.__)("We couldn't install Angie automatically. Click below to install it manually.","elementor-pro"):(0,d.__)("Angie lets you create components, widgets, sections, and code using simple instructions.","elementor-pro")),"error"!==o&&u.createElement(v.Typography,{variant:"body2",color:"text.secondary"},(0,d.__)("Install once to start building directly inside the editor.","elementor-pro")),u.createElement(v.Stack,{direction:"row",justifyContent:"flex-end",sx:{mt:2}},"error"===o?u.createElement(v.Button,{variant:"contained",color:"accent",onClick:()=>{(0,l.redirectToInstallation)(n)}},(0,d.__)("Install Manually","elementor-pro")):u.createElement(v.Button,{variant:"contained",color:"accent",onClick:async()=>{r("installing"),(0,ve.trackEvent)({eventName:"angie_install_started",trigger_source:"components_tab"}),(await(0,l.installAngiePlugin)()).success?(0,l.redirectToAppAdmin)(n):r("error")},disabled:"installing"===o,startIcon:"installing"===o?u.createElement(v.CircularProgress,{size:18,color:"inherit"}):void 0},"installing"===o?(0,d.__)("Installing…","elementor-pro"):(0,d.__)("Install Angie","elementor-pro")))))))}const xe=({open:e,onClose:t,onConfirm:n,anchorRef:o})=>{const r=o?.current,i=r?{popper:{anchorEl:r,modifiers:[{name:"offset",options:{offset:[-40,8]}}]}}:void 0;return u.createElement(v.Infotip,{placement:"right-start",content:u.createElement(Ie,{onClose:e=>{e.stopPropagation(),t()},onConfirm:n}),open:e,slotProps:i},u.createElement("span",null))};function Ie({onClose:e,onConfirm:t}){return u.createElement(v.ClickAwayListener,{disableReactTree:!0,mouseEvent:"onMouseDown",touchEvent:"onTouchStart",onClickAway:e},u.createElement(v.Card,{elevation:0,sx:{width:296,borderRadius:"4px"}},u.createElement(v.CardHeader,{title:u.createElement(v.Box,{sx:{display:"flex",alignItems:"center",gap:1}},u.createElement(v.Typography,{variant:"subtitle2"},(0,d.__)("Meet Angie","elementor-pro")),u.createElement(v.Chip,{label:(0,d.__)("New","elementor-pro"),size:"small",sx:{height:24,fontSize:"13px",backgroundColor:"#ebf2fe",color:"#1945a4",borderRadius:"1000px"}})),action:u.createElement(v.CloseButton,{slotProps:{icon:{fontSize:"tiny"}},onClick:e}),sx:{py:1,px:2}}),u.createElement(v.Box,{sx:{position:"relative",width:"100%",height:148}},u.createElement(v.CardMedia,{component:"img",image:"https://assets.elementor.com/packages/v1/images/angie-components-promotion.svg",alt:"",sx:{width:"100%",height:"100%",objectFit:"cover"}}),u.createElement(v.Box,{sx:{position:"absolute",inset:0,backgroundColor:"rgba(255, 0, 191, 0.6)",pointerEvents:"none"}})),u.createElement(v.CardContent,{sx:{px:2,py:1}},u.createElement(v.Typography,{variant:"body2",color:"text.secondary"},(0,d.__)("Build components using simple instructions.","elementor-pro"))),u.createElement(v.CardActions,{sx:{justifyContent:"flex-end",px:2,pb:1.5,pt:1}},u.createElement(v.Button,{variant:"contained",size:"small",onClick:t,sx:{backgroundColor:"#f0abfc",color:"#0c0d0e","&:hover":{backgroundColor:"#e879f9"}}},(0,d.__)("Start building","elementor-pro")))))}const Te="Tell Angie what component you want to build",Pe={fontSize:"0.875rem !important",fontWeight:"500 !important"},Se=()=>{const{canCreate:e}=(0,o.useComponentsPermissions)(),{shouldShowIntro:t,suppressIntro:n}=(()=>{const[e,t]=(0,g.useSuppressedMessage)("angie-components-intro");return{shouldShowIntro:!e,suppressIntro:t}})(),[r,i]=(0,u.useState)(!1),[a,s]=(0,u.useState)(!1),c=(0,u.useRef)(null),p=navigator.platform.toUpperCase().indexOf("MAC")>=0?"Cmd":"Ctrl";return u.createElement(v.Stack,{alignItems:"center",justifyContent:"start",height:"100%",sx:{px:2,py:4},gap:1,overflow:"hidden"},u.createElement(v.Stack,{alignItems:"center",gap:1.75},u.createElement(h.ComponentsIcon,{fontSize:"large",sx:{color:"text.secondary"}}),u.createElement(v.Stack,{alignItems:"center",gap:1.75},u.createElement(v.Typography,{align:"center",variant:"subtitle2",color:"text.secondary",sx:Pe},(0,d.__)("Create your first component","elementor-pro")),u.createElement(v.Typography,{align:"center",variant:"caption",color:"text.tertiary"},e?`${(0,d.__)("To create, press","elementor-pro")} ${p}+ Shift + K ${(0,d.__)("on div-block or flexbox.","elementor-pro")}`:(0,d.__)("With your current role, you cannot create components. Contact an administrator to create one.","elementor-pro")))),e&&(!!(0,l.isAngieAvailable)()||!!window.elementor?.config?.user?.is_administrator)&&u.createElement(v.Stack,{alignItems:"center",gap:1,width:"100%"},u.createElement(v.Typography,{variant:"subtitle2",color:"text.primary",sx:{py:.5,fontWeight:500}},(0,d.__)("Or","elementor-pro")),u.createElement(v.Stack,{alignItems:"center",gap:1},u.createElement(v.Typography,{align:"center",variant:"caption",color:"text.tertiary"},(0,d.__)("Create a custom component with Angie","elementor-pro")),u.createElement(v.Link,{ref:c,component:"button",variant:"caption",onClick:()=>{const e=(0,l.isAngieAvailable)();(0,ve.trackEvent)({eventName:"angie_cta_clicked",entry_point:"components_tab",has_angie_installed:e}),e?(0,l.isAngieSidebarOpen)()?(0,l.sendPromptToAngie)(Te):t?i(!0):(0,l.sendPromptToAngie)(Te):s(!0)},sx:{display:"flex",alignItems:"center",padding:.5,gap:.5,color:"#c00bb9",textDecoration:"none","&:hover":{textDecoration:"underline"}}},u.createElement(h.AIIcon,{sx:{fontSize:16}}),(0,d.__)("Create component","elementor-pro")),u.createElement(xe,{open:r,onClose:()=>{i(!1)},onConfirm:()=>{n(),i(!1),(0,l.sendPromptToAngie)(Te)},anchorRef:c}))),u.createElement(v.Stack,{alignItems:"center",gap:.5,sx:{mt:"auto",width:"100%"}},u.createElement(v.Divider,{sx:{width:"100%",mb:2}}),u.createElement(v.Typography,{align:"center",variant:"caption",color:"text.tertiary"},(0,d.__)("Components are reusable elements that sync across your site.","elementor-pro")),u.createElement(v.Link,{href:"http://go.elementor.com/components-guide-article",target:"_blank",rel:"noopener noreferrer",variant:"caption",color:"info.main"},(0,d.__)("Learn more","elementor-pro"))),u.createElement(we,{open:a,onClose:()=>{s(!1)},prompt:Te}))},ke=()=>u.createElement(f.ThemeProvider,null,u.createElement(o.SearchProvider,{localStorageKey:"elementor-components-search"},u.createElement(Oe,null))),Oe=()=>{const{components:e,isLoading:t}=(0,o.useComponents)(),n=!t&&e.length>0;return u.createElement(u.Fragment,null,n&&u.createElement(o.ComponentSearch,null),u.createElement(Ae,null))},De="components-empty-state-full-height",Ae=()=>{const{isLoading:e}=(0,o.useComponents)(),{components:t,isLoading:n,searchValue:r}=(0,o.useFilteredComponents)(),{data:i=!1,isPending:a}=(0,m.useIsLicenseExpired)();if((0,u.useLayoutEffect)(()=>{let e=document.getElementById(De);return e||(e=document.createElement("style"),e.id=De,e.textContent="\n#elementor-panel-page-elements {\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n}\n\n#elementor-panel-elements {\n\tdisplay: flex;\n\tflex-direction: column;\n\tflex: 1;\n\tmin-height: 0;\n}\n\n#elementor-panel-elements-wrapper {\n\tdisplay: flex;\n\tflex-direction: column;\n\tflex: 1;\n\tmin-height: 0;\n}\n",document.head.appendChild(e)),()=>{document.getElementById(De)?.remove()}},[]),n||e||a)return u.createElement(o.LoadingComponents,null);const s=!t?.length,l=r.length>0;return s?l?u.createElement(o.EmptySearchResult,null):i?u.createElement(Ce,null):u.createElement(Se,null):u.createElement(v.Stack,{justifyContent:"space-between",sx:{flex:1,minHeight:0}},u.createElement(v.List,{sx:{display:"flex",flexDirection:"column",gap:1,px:2}},t.map(e=>u.createElement(ue,{key:e.uid,component:e}))),i?u.createElement(Ee,null):u.createElement(be,null))};function Re(e,t){Object.values(t.props).forEach(t=>{const n=ze(e,t.elementId);n?.settings&&(n.settings[t.propKey]={$$type:"overridable",value:{override_key:t.overrideKey,origin_value:n.settings[t.propKey]}})})}function ze(e,t){for(const n of e){if(n.id===t)return n;if(n.elements){const e=ze(n.elements,t);if(e)return e}}return null}const Me=(e,t)=>(0,x.replaceElement)({currentElementId:e.id,newElement:pe(t),withHistory:!1});async function Ue({name:e,element:t,eventData:n,uid:r,overridableProps:i,source:a}){const s=r??(0,_.generateUniqueId)("component"),l={uid:s,name:e},c=[S(t)];i&&Re(c,i);const m=(0,x.getContainer)(t.id),u=m?.model?.toJSON?.(),g={model:u??t,parentId:m?.parent?.id??"",index:m?.view?._index??0};o.componentsActions.addUnpublished({...l,elements:c,overridableProps:i}),o.componentsActions.addCreatedThisSession(s);const f=Me(t,l);(0,o.trackComponentEvent)({action:"created",source:a,component_uid:s,component_name:e,...n});try{await(0,p.__privateRunCommand)("document/save/auto")}catch(e){throw function(e,t){const n=(0,x.getContainer)(t);n&&(0,x.deleteElement)({container:n,options:{useHistory:!1}});const o=(0,x.getContainer)(e.parentId);if(!o)return;const r=structuredClone(e.model);(0,x.createElements)({title:(0,d.__)("Restore Element","elementor-pro"),elements:[{container:o,model:r,options:{at:e.index}}]})}(g,f.id),o.componentsActions.removeUnpublished(s),o.componentsActions.removeCreatedThisSession(s),e}return{uid:s,instanceId:f.id}}function Le(){return null!==o.componentsSelectors.getCurrentComponentId()}const je={type:"default",message:(0,d.__)("This widget isn't compatible with components. Use atomic elements instead.","elementor-pro"),id:"non-atomic-element-blocked"};function Ne(e){return null!==(0,x.getElementType)(e)}function Ve(e){if(!Le())return!1;const{model:t}=e,n=t?.widgetType||t?.elType;return!!n&&!Ne(n)&&((0,ie.notify)(je),!0)}function Be(e){if(!Le())return!1;const{containers:t=[e.container]}=e,n=t.some(e=>!!e&&(0,x.getAllDescendants)(e).some(e=>!(0,re.isAtomicWidget)(e)));return n&&(0,ie.notify)(je),n}function $e(e){if(!Le())return!1;const{storageType:t}=e;if("localstorage"!==t)return!1;const n=window?.elementorCommon?.storage?.get();if(!n?.clipboard?.elements)return!1;const o=qe(n.clipboard.elements);return o&&(0,ie.notify)(je),o}function qe(e){for(const t of e){const e=t.widgetType||t.elType;if(e&&!Ne(e))return!0;if(t.elements?.length&&qe(t.elements))return!0}return!1}function Ke(e){const t=[],n=e.widgetType||e.elType;if(n&&!Ne(n)&&t.push(n),e.elements?.length)for(const n of e.elements)t.push(...Ke(n));return[...new Set(t)]}const Fe=e=>{const[t,n]=(0,u.useState)(e),[o,r]=(0,u.useState)({}),i=(0,u.useMemo)(()=>!Object.values(o).some(e=>e),[o]);return{values:t,errors:o,isValid:i,handleChange:(e,o,i)=>{const a={...t,[o]:e.target.value};n(a);const{success:s,errors:l}=Ge(a,i);r(s?{}:l)},validateForm:e=>{const{success:n,errors:o,parsedValues:i}=Ge(t,e);return n?(r({}),{success:n,parsedValues:i}):(r(o),{success:n})}}},Ge=(e,t)=>{const n=t.safeParse(e);if(n.success)return{success:!0,parsedValues:n.data};const o={};return Object.entries(n.error.formErrors.fieldErrors).forEach(([e,t])=>{o[e]=t[0]}),{success:!1,errors:o}},We=(e,t)=>{const{elementsCount:n,componentsCount:o}=He(e);return{nested_elements_count:n,nested_components_count:o,top_element_type:e.elType,location:t?.location,secondary_location:t?.secondaryLocation,trigger:t?.trigger}};function He(e){if(!e.elements||0===e.elements.length)return{elementsCount:0,componentsCount:0};let t=e.elements.length,n=0;for(const o of e.elements){"e-component"===o.widgetType&&n++;const{elementsCount:e,componentsCount:r}=He(o);t+=e,n+=r}return{elementsCount:t,componentsCount:n}}const Ye=100;function Je(){const[e,t]=(0,u.useState)(null),[n,r]=(0,u.useState)(),{components:i}=(0,o.useComponents)(),a=(0,u.useRef)(null);(0,u.useEffect)(()=>{const e="elementor/editor/open-save-as-component-form",n=e=>{const{shouldOpen:n,notification:s}=function(e,t){return Ke(e).length>0?{shouldOpen:!1,notification:{type:"default",message:(0,d.__)("Components require atomic elements only. Remove widgets to create this component.","elementor-pro"),id:"non-atomic-element-save-blocked"}}:t>=Ye?{shouldOpen:!1,notification:{type:"default",message:(0,d.__)("You've reached the limit of %s components. Please remove an existing one to create a new component.","elementor-pro").replace("%s",Ye.toString()),id:"maximum-number-of-components-exceeded"}}:{shouldOpen:!0,notification:null}}(e.detail.element,i?.length??0);n?(t({element:e.detail.element,elementLabel:(0,x.getElementLabel)(e.detail.element.id)}),r(e.detail.anchorPosition),a.current=We(e.detail.element,e.detail.options),(0,o.trackComponentEvent)({action:"createClicked",source:"user",...a.current})):(0,ie.notify)(s)};return window.addEventListener(e,n),()=>{window.removeEventListener(e,n)}},[i?.length]);const s=()=>{t(null),r(void 0)},l=()=>{s(),(0,o.trackComponentEvent)({action:"createCancelled",source:"user",...a.current})};return u.createElement(f.ThemeProvider,null,u.createElement(v.Popover,{open:null!==e,onClose:l,anchorReference:"anchorPosition",anchorPosition:n,"data-testid":"create-component-form"},null!==e&&u.createElement(Ze,{initialValues:{componentName:e.elementLabel},handleSave:async t=>{try{if(!e)throw new Error("Can't save element as component: element not found");const{uid:n,instanceId:r}=await Ue({name:t.componentName,element:e.element,eventData:a.current,source:"user"}),i=o.componentsSelectors.getComponentByUid(n)?.id;if(!i)throw new Error("Failed to find published component");(0,o.switchToComponent)(i,r),(0,ie.notify)({type:"success",message:(0,d.__)("Component created successfully.","elementor-pro"),id:`component-saved-successfully-${n}`}),s()}catch{const e=(0,d.__)("Failed to create component. Please try again.","elementor-pro");(0,ie.notify)({type:"error",message:e,id:"component-save-failed"}),s()}},closePopup:l})))}const Xe="tiny",Ze=({initialValues:e,handleSave:t,closePopup:n})=>{const{values:r,errors:i,isValid:a,handleChange:s,validateForm:l}=Fe(e),c=(0,f.useTextFieldAutoSelect)(),{components:p}=(0,o.useComponents)(),m=(0,u.useMemo)(()=>p?.map(e=>e.name)??[],[p]),g=(0,u.useMemo)(()=>le(m),[m]),y=(0,u.useMemo)(()=>ce(m),[m]),b={heading:(0,d.__)("Create component","elementor-pro"),name:(0,d.__)("Name","elementor-pro"),cancel:(0,d.__)("Cancel","elementor-pro"),create:(0,d.__)("Create","elementor-pro")},E="component-name";return u.createElement(f.Form,{onSubmit:()=>{const{success:e,parsedValues:n}=l(y);e&&t(n)}},u.createElement(v.Stack,{alignItems:"start",width:"268px"},u.createElement(v.Stack,{direction:"row",alignItems:"center",py:1,px:1.5,sx:{columnGap:.5,borderBottom:"1px solid",borderColor:"divider",width:"100%"}},u.createElement(h.ComponentsIcon,{fontSize:Xe}),u.createElement(v.Typography,{variant:"caption",sx:{color:"text.primary",fontWeight:"500",lineHeight:1}},b.heading)),u.createElement(v.Grid,{container:!0,gap:.75,alignItems:"start",p:1.5},u.createElement(v.Grid,{item:!0,xs:12},u.createElement(v.FormLabel,{htmlFor:E,size:"tiny"},b.name)),u.createElement(v.Grid,{item:!0,xs:12},u.createElement(v.TextField,{id:E,size:Xe,fullWidth:!0,value:r.componentName,onChange:e=>s(e,"componentName",g),inputProps:{style:{color:"text.primary",fontWeight:"600"}},error:Boolean(i.componentName),helperText:i.componentName,inputRef:c}))),u.createElement(v.Stack,{direction:"row",justifyContent:"flex-end",alignSelf:"end",py:1,px:1.5},u.createElement(v.Button,{onClick:n,color:"secondary",variant:"text",size:"small"},b.cancel),u.createElement(v.Button,{type:"submit",disabled:!a,variant:"contained",color:"primary",size:"small"},b.create))))},Qe="overridable-prop",et="elementor_component",tt="Elementor Editor Components MCP - Tools for creating and managing reusable components.\n Components are reusable blocks of content that can be used multiple times across the pages, its a widget which contains a set of elements and styles.\n\t\t\n\t\tBefore using the tools, you must fetch the list of components from the resource (as mentioned in the required resources), if you see something that might fit, get the component instance.\n\t\tThen you can save the component instance as a new component (Name is unique so do not repeat it).\n\n\t\tIf you see that there is a component that might match the needs of the user, get the component, see if it's published and suggest the user to use it (but only if you are 100% sure on that).\n\t\tIgnore this If statement when the users asks to create a new component, you can only suggest it after the work is done.";function nt(e){o.componentsActions.setPath(e.path),o.componentsActions.setCurrentComponentId(e.currentComponentId)}var ot=window.ReactDOM;function rt({topLevelElementDom:e,onClose:t}){const n=(0,p.__privateUseListenTo)((0,p.commandEndEvent)("editor/documents/attach-preview"),()=>(0,p.getCanvasIframeDocument)());return(0,u.useEffect)(()=>{const e=e=>{"Escape"===e.key&&t()};return n?.body.addEventListener("keydown",e),()=>{n?.body.removeEventListener("keydown",e)}},[n,t]),n?.body?(0,ot.createPortal)(u.createElement(u.Fragment,null,u.createElement(at,null),u.createElement(it,{canvas:n,element:e,onClose:t})),n.body):null}function it({canvas:e,element:t,onClose:n}){const o=function(e){const[t,n]=(0,u.useState)(new DOMRect(0,0,0,0)),o=(0,_.throttle)(()=>{n(e?.getBoundingClientRect()??new DOMRect(0,0,0,0))},20,!0);return function({element:e,onChange:t}){(0,u.useEffect)(()=>{if(!e)return;const n=e.ownerDocument?.defaultView;return n?.addEventListener("scroll",t,{passive:!0}),()=>{n?.removeEventListener("scroll",t)}},[e,t])}({element:e,onChange:o}),function({element:e,onChange:t}){(0,u.useEffect)(()=>{if(!e)return;const n=new ResizeObserver(t);n.observe(e);const o=e.ownerDocument?.defaultView;return o?.addEventListener("resize",t,{passive:!0}),()=>{n.disconnect(),o?.removeEventListener("resize",t)}},[e,t])}({element:e,onChange:o}),function({element:e,onChange:t}){(0,u.useEffect)(()=>{if(!e)return;const n=new MutationObserver(t);return n.observe(e,{childList:!0,subtree:!0}),()=>{n.disconnect()}},[e,t])}({element:e,onChange:o}),(0,u.useEffect)(()=>()=>{o.cancel()},[o]),t}(t),r=t?function(e,t){const{x:n,y:o,width:r,height:i}=e,{innerWidth:a,innerHeight:s}=t;return`path(evenodd, 'M 0 0 \n\t\tL ${a} 0\n\t\tL ${a} ${s}\n\t\tL 0 ${s}\n\t\tZ\n\t\tM ${n} ${o}\n\t\tL ${n+r} ${o}\n\t\tL ${n+r} ${o+i}\n\t\tL ${n} ${o+i}\n\t\tL ${n} ${o}\n \tZ'\n\t)`.replace(/\s{2,}/g," ")}(o,e.defaultView):void 0,i={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",backgroundColor:"rgba(0, 0, 0, 0.5)",zIndex:999,pointerEvents:"painted",cursor:"pointer",clipPath:r};return u.createElement("div",{style:i,onClick:n,onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),n())},role:"button",tabIndex:0,"aria-label":(0,d.__)("Exit component editing mode","elementor-pro")})}function at(){return u.createElement("style",{"data-e-style-id":"e-block-v3-document-handles-styles"},"\n\t.elementor-editor-active {\n\t\t& .elementor-section-wrap.ui-sortable {\n\t\t\tdisplay: contents;\n\t\t}\n\n\t\t& *[data-editable-elementor-document]:not(.elementor-edit-mode):hover {\n\t\t\t& .elementor-document-handle:not(.elementor-document-save-back-handle) {\n\t\t\t\tdisplay: none;\n\n\t\t\t\t&::before,\n\t\t\t\t& .elementor-document-handle__inner {\n\t\t\t\t\tdisplay: none;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t")}function st(){const e=(0,o.useCurrentComponentId)();!function(){const e=(0,i.getV1DocumentsManager)(),t=(0,o.useCurrentComponentId)(),n=(0,y.__useSelector)(o.selectPath);(0,u.useEffect)(()=>(0,p.__privateListenTo)((0,p.commandEndEvent)("editor/documents/open"),()=>{const r=e.getCurrent();r.id!==t&&(t&&o.apiClient.unlockComponent(t),o.componentsActions.resetSanitizedComponents(),r.config.type===et?nt({path:lt(n,r),currentComponentId:r.id}):nt({path:[],currentComponentId:null}))}),[n,e,t])}();const t=b(),n=(0,_.throttle)(t,100),r=function(e){const{componentContainerDomElement:t,topLevelElementDom:n}=function(e){if(!e)return{componentContainerDomElement:null,topLevelElementDom:null};const t=(0,i.getV1DocumentsManager)().get(e),n=t?.container,o=n?.view?.el?.children?.[0]??null;return{componentContainerDomElement:o,topLevelElementDom:o?.children[0]??null}}(e),[o,r]=(0,u.useState)(n);return(0,u.useEffect)(()=>{r(n)},[n]),(0,u.useEffect)(()=>{if(!t)return;const e=new MutationObserver(()=>{const e=t.children[0];r(e)});return e.observe(t,{childList:!0}),()=>{e.disconnect()}},[t]),o}(e??void 0);return e?u.createElement(rt,{topLevelElementDom:r,onClose:n}):null}function lt(e,t){const n=e.findIndex(({componentId:e})=>e===t.id);if(n>=0)return e.slice(0,n+1);const o=t?.container.view?.el?.dataset.id,r=function(e,t){if(!e)return;const n=(0,i.getV1DocumentsManager)(),o=t.at(-1)?.componentId??n.getInitialId(),r=n.get(o),a=r?.container,s=a?.children?.findRecursive?.(t=>t.id===e),l=s?.model?.get?.("editor_settings");return l?.title}(o,e);return[...e,{instanceId:o,instanceTitle:r,componentId:t.id}]}function ct(){const{canEdit:e}=(0,o.useComponentsPermissions)(),t=(0,o.useInstancePanelData)();if(!t)return null;const{componentId:n,component:r,overrides:i,overridableProps:a,groups:s,isEmpty:l,componentInstanceId:c}=t,p=(0,d.__)("Edit %s","elementor-pro").replace("%s",r.name),m=()=>(0,o.switchToComponent)(n,c),g=u.createElement(v.Stack,{direction:"row",gap:.5},u.createElement(o.DetachAction,{componentInstanceId:c,componentId:n}),e?u.createElement(o.EditComponentAction,{label:p,onClick:m,icon:h.PencilIcon}):null);return u.createElement(v.Box,{"data-testid":"instance-editing-panel",sx:{height:"100%"}},u.createElement(o.ComponentInstanceProvider,{componentId:n,overrides:i,overridableProps:a},u.createElement(o.InstancePanelHeader,{componentName:r.name,actions:g}),u.createElement(o.InstancePanelBody,{groups:s,isEmpty:l,emptyState:u.createElement(o.InstanceEmptyState,{onEditComponent:e?m:void 0}),componentInstanceId:c})))}function pt(){return pt=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},pt.apply(null,arguments)}function mt({OriginalControl:e,...t}){const{elementType:n}=(0,a.useElement)(),{value:i,bind:s,setValue:l,placeholder:c,...p}=(0,r.useBoundProp)(o.componentOverridablePropTypeUtil),m=(0,o.useCurrentComponentId)(),d=(0,o.useOverridableProps)(m),g=(0,r.getControlReplacements)().filter(e=>!e.id||e.id!==Qe);if(!m)return null;if(!i?.override_key)throw new Error("Override key is required");const f="e-component"===n.key,h=d?.props?.[i.override_key],y=n.propsSchema[s],v=(h?(0,o.getPropTypeForComponentOverride)(h):void 0)??y;if(!v)return null;const b=(0,a.createTopLevelObjectType)({schema:{[s]:v}}),E=f?(i.origin_value?.value).override_value:i.origin_value,_=c?{[s]:c}:void 0;return u.createElement(o.OverridablePropProvider,{value:i},u.createElement(r.PropProvider,pt({},p,{propType:b,setValue:e=>{const t={...i,origin_value:e[s]};l(t),f||(0,o.updateOverridableProp)(m,t,h?.originPropFields)},value:{[s]:E},placeholder:_}),u.createElement(r.PropKeyProvider,{bind:s},u.createElement(r.ControlReplacementsProvider,{replacements:g},u.createElement(dt,{OriginalControl:e,props:t})))))}function dt({OriginalControl:e,props:t}){const{ControlToRender:n,isReplaced:o}=(0,r.useControlReplacement)(e);if(o){const o=n;return u.createElement(o,pt({},t,{OriginalControl:e}))}return u.createElement(e,t)}function ut({componentId:e,overrideKey:t,elementId:n,label:r,groupId:i,propKey:a,elType:s,widgetType:l,originValue:c,originPropFields:p,source:m}){const u=o.componentsSelectors.getOverridableProps(e);if(!u)return;const g=t?u.props[t]:null,f=Object.values(u.props).filter(e=>e.elementId===n&&e.propKey===a&&e!==g),{groups:h,groupId:y}=function(e,t){return t&&e.items[t]?{groups:e,groupId:t}:!t&&e.order.length>0?{groups:e,groupId:e.order[0]}:function(e,t){const n=t||(0,_.generateUniqueId)("group"),o=(0,d.__)("Default","elementor-pro");return{groups:{...e,items:{...e.items,[n]:{id:n,label:o,props:[]}},order:[...e.order,n]},groupId:n}}(e,t)}(u.groups,i||g?.groupId||void 0),v={overrideKey:g?.overrideKey||(0,_.generateUniqueId)("prop"),label:r,elementId:n,propKey:a,widgetType:l,elType:s,originValue:c,groupId:y,originPropFields:p},b=function(e,t){const n=t.map(e=>e.overrideKey);return{props:Object.fromEntries(Object.entries(e.props).filter(([,e])=>!t.includes(e))),groups:{items:Object.fromEntries(Object.entries(e.groups.items).map(([e,t])=>[e,{...t,props:t.props.filter(e=>!n.includes(e))}])),order:e.groups.order.filter(e=>!n.includes(e))}}}({...u,groups:h},f),E={...b.props,[v.overrideKey]:v};let x=C(b.groups,y,v.overrideKey);if(x=function(e,t){return e.order.includes(t)?e:{...e,order:[...e.order,t]}}(x,y),g&&g.groupId!==y&&(x=w(x,g.groupId,v.overrideKey)),o.componentsActions.setOverridableProps(e,{props:E,groups:x}),!g){const e=o.componentsSelectors.getCurrentComponent();(0,o.trackComponentEvent)({action:"propertyExposed",source:m,component_uid:e?.uid,property_id:v.overrideKey,property_path:a,property_name:r,element_type:l??s})}return v}function gt(){return gt=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},gt.apply(null,arguments)}const ft="tiny",ht=(0,v.styled)(v.Box)`
|
|
pointer-events: none;
|
|
opacity: 0;
|
|
transition: opacity 0.2s ease-in-out;
|
|
|
|
& > svg {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate( -50%, -50% );
|
|
width: 10px;
|
|
height: 10px;
|
|
fill: ${({theme:e})=>e.palette.primary.contrastText};
|
|
stroke: ${({theme:e})=>e.palette.primary.contrastText};
|
|
stroke-width: 2px;
|
|
}
|
|
`,yt=(0,v.styled)(v.Box)`
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
cursor: pointer;
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-inline: ${({theme:e})=>e.spacing(.5)};
|
|
|
|
&:before {
|
|
content: '';
|
|
display: block;
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate( -50%, -50% ) rotate( 45deg );
|
|
width: 5px;
|
|
height: 5px;
|
|
border-radius: 1px;
|
|
background-color: ${({theme:e})=>e.palette.primary.main};
|
|
transition: all 0.1s ease-in-out;
|
|
}
|
|
|
|
&:hover,
|
|
&.enlarged {
|
|
&:before {
|
|
width: 12px;
|
|
height: 12px;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.icon {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
`,vt=(0,u.forwardRef)(({isOpen:e,isOverridable:t,...n},o)=>u.createElement(yt,gt({role:"button",ref:o},n,{className:e||t?"enlarged":"","aria-label":t?(0,d.__)("Overridable property","elementor-pro"):(0,d.__)("Make prop overridable","elementor-pro")}),u.createElement(ht,{className:"icon"},t?u.createElement(h.CheckIcon,{fontSize:ft}):u.createElement(h.PlusIcon,{fontSize:ft}))));function bt(){return bt=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},bt.apply(null,arguments)}function Et(){const{propType:e}=(0,r.useBoundProp)(),t=(0,o.useCurrentComponentId)(),n=(0,o.useSanitizeOverridableProps)(t);return function(e){return!1!==e.meta.overridable}(e)&&t&&n?u.createElement(_t,{componentId:t,overridableProps:n}):null}function _t({componentId:e,overridableProps:t}){const{element:{id:n},elementType:i}=(0,a.useElement)(),{value:s,bind:l,propType:c}=(0,r.useBoundProp)(),p=(0,o.useOverridablePropValue)(),m=(0,o.useComponentInstanceElement)(),{value:g,setValue:f}=(0,r.useBoundProp)(o.componentOverridablePropTypeUtil),h=g??p,y=(0,v.usePopupState)({variant:"popover"}),b=(0,v.bindTrigger)(y),E=(0,v.bindPopover)(y),{elType:_}=(0,x.getWidgetsCache)()?.[i.key]??{elType:"widget"},C=h?(0,o.getOverridableProp)({componentId:e,overrideKey:h.override_key}):void 0;return u.createElement(u.Fragment,null,u.createElement(v.Tooltip,{placement:"top",title:(0,d.__)("Override Property","elementor-pro")},u.createElement(vt,bt({},b,{isOpen:!!E.open,isOverridable:!!h}))),u.createElement(v.Popover,bt({disableScrollLock:!0,anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},PaperProps:{sx:{my:2.5}}},E),u.createElement(U,{onSubmit:({label:r,group:a})=>{const p=c.default??{},d=(0,o.resolveOverridePropValue)(h?.origin_value)??s??p,u=h?t?.props?.[h.override_key]:void 0,g=ut({componentId:e,overrideKey:h?.override_key??null,elementId:m?.element.id??n,label:r,groupId:a,propKey:l,elType:_??"widget",widgetType:m?.elementType.key??i.key,originValue:d,originPropFields:u?.originPropFields,source:"user"});!h&&g&&f({override_key:g.overrideKey,origin_value:d}),y.close()},groups:t?.groups.order.map(e=>({value:e,label:t.groups.items[e].label})),existingLabels:Object.values(t?.props??{}).map(e=>e.label),currentValue:C})))}const Ct="elementor://components/list",wt=e=>{const{resource:t,sendResourceUpdated:n}=e;t("components-list",Ct,{description:"Live list of all reusable components (published and unpublished) with full component data."},()=>({contents:[{uri:Ct,mimeType:"application/json",text:JSON.stringify([...o.componentsSelectors.getComponents()??[],...o.componentsSelectors.getUnpublishedComponents()??[]])}]})),(0,y.__subscribeWithSelector)(e=>e[o.SLICE_NAME],()=>{n({uri:Ct})})};var xt=window.elementorV2.httpClient;const It={action:ae.z.enum(["save","get"]).describe('The operation to perform: "get" - retrieve a specific component by UID; "save" - create a new component from an existing element.'),element_id:ae.z.string().optional().describe('[Required for "save"] The unique identifier of the element to save as a component. Use the "list-elements" tool to find available element IDs in the current document.'),component_name:ae.z.string().optional().describe('[Required for "save"] The name for the new component. Should be descriptive and unique among existing components. Must be unique among all components.'),overridable_props:ae.z.object({props:ae.z.record(ae.z.object({elementId:ae.z.string().describe("The id of the child element that you want to override its settings"),propKey:ae.z.string().describe('The property key of the child element that you want to override its settings (e.g., "text", "url", "tag"). To get the available propKeys for an element, use the "get-element-type-config" tool.'),label:ae.z.string().describe('A unique, user-friendly display name for this property (e.g., "Hero Headline", "CTA Button Text"). Must be unique within the same component.'),group:ae.z.string().optional().describe("Non unique, optional property grouping")}))}).optional().describe('[Optional for "save"] Overridable properties configuration. Specify which CHILD element properties can be customized. Only elementId and propKey are required; To get the available propKeys for a child element you must use the "get-element-type-config" tool.'),groups:ae.z.array(ae.z.string()).describe('[Optional for "save"] Property Groups, by order, unique values').optional(),component_uid:ae.z.string().optional().describe('[Required for "get"] The unique identifier of the component to retrieve.')},Tt={message:ae.z.string().optional().describe("Additional information about the operation result"),component_uid:ae.z.string().optional().describe('The unique identifier of the newly created component (only present on "save" success)'),component:ae.z.object({uid:ae.z.string(),name:ae.z.string(),status:ae.z.enum(["published","unpublished"]),id:ae.z.number().optional(),overridableProps:ae.z.unknown().optional(),elements:ae.z.array(ae.z.any()).optional().describe("The elements of the component (only when component is unpublished)")}).optional().describe('The requested component data (only present on "get")')},Pt=async e=>{const{action:t}=e;switch(t){case"get":return async function(e){const{component_uid:t}=e;if(!t)throw new Error('component_uid is required for the "get" action.');const n=o.componentsSelectors.getComponentByUid(t);if(!n)throw new Error(`Component with UID "${t}" not found.`);const r="id"in n;let a;if(r){const e=(0,i.getV1DocumentsManager)();try{const t=await e.request(n.id);a=t?.elements}catch{a=void 0}}return{status:"ok",component:{uid:n.uid,name:n.name,status:r?"published":"unpublished",id:r?n.id:void 0,overridableProps:n.overridableProps,elements:a}}}(e);case"save":return async function(e){const{groups:t=[],element_id:n,component_name:r,overridable_props:i}=e;if(!n)throw new Error('element_id is required for the "save" action.');if(!r)throw new Error('component_name is required for the "save" action.');const a=function(){const e=(0,x.getWidgetsCache)();return e?Object.entries(e).reduce((e,[t,n])=>n.atomic_props_schema&&n.show_in_panel&&"widget"!==n.elType?(e.push(t),e):e,[]):[]}(),s=(0,x.getContainer)(n);if(!s)throw new Error("Element not found. Use 'list-elements' to get valid element IDs.");const l=s.model.get("elType");if(!a.includes(l))throw new Error(`Element is not one of the following types: ${a.join(", ")}`);const c=s.model.toJSON({remove:["default"]});if(c?.isLocked)throw new Error("Cannot save a locked element as a component.");const p=(t.indexOf("Default")>=0?[...t]:["Default",...t]).map(e=>({id:(0,_.generateUniqueId)("group"),label:e,props:[]})),m=i?function(e,t,n){const o={},r={},i=n.find(e=>"Default"===e.label);if(!i)throw new Error("Internal mcp error: could not generate default group");return Object.entries(e.props).forEach(([,e])=>{const{elementId:a,propKey:s,label:l,group:c="Default"}=e,p=n.find(e=>e.label===c)||i,m=p.id,d=St(t,a);if(!d)throw new Error(`Element with ID "${a}" not found in component`);const u=d.elType,g=d.widgetType||d.elType,f=(0,x.getElementType)(g);if(!f)throw new Error(`Element type "${g}" is not atomic or does not have a settings schema. Cannot expose property "${s}" for element "${a}".`);if(!f.propsSchema[s]){const e=Object.keys(f.propsSchema).join(", ");throw new Error(`Property "${s}" does not exist in element "${a}" (type: ${g}). Available properties: ${e}`)}const h=(0,_.generateUniqueId)("prop"),y=d.settings?.[s]?d.settings[s]:f.propsSchema[s].default??null;r[m]||(r[m]={id:m,label:p.label,props:[]}),r[m].props.push(h),o[h]={overrideKey:h,label:l,elementId:a,propKey:s,elType:u,widgetType:g,originValue:y,groupId:m}}),{props:o,groups:{items:r,order:n.filter(e=>r[e.id]).map(e=>e.id)}}}(i,c,p):void 0;m&&function(e,t){Object.values(t.props).forEach(t=>{const n=St(e,t.elementId);n&&n.settings&&(n.settings[t.propKey]={$$type:"overridable",value:{override_key:t.overrideKey,origin_value:t.originValue}})})}(c,m);const d=(0,_.generateUniqueId)("component");try{await o.apiClient.validate({items:[{uid:d,title:r,elements:[c],settings:{overridable_props:m}}]})}catch(e){if(e instanceof xt.AxiosError)throw new Error(e.response?.data.message);throw new Error("Unknown error")}return await Ue({name:r,element:c,eventData:null,uid:d,overridableProps:m,source:"mcp_tool"}),{status:"ok",message:`Component "${r}" created successfully.`,component_uid:d}}(e)}};function St(e,t){if(e.id===t)return e;if(e.elements)for(const n of e.elements){const e=St(n,t);if(e)return e}return null}const kt=()=>{const e=(0,l.toolPrompts)("manage-component");return e.description(`\nManage reusable components in the Elementor editor: retrieve a specific component or save an element as a new component.\n\n# **CRITICAL - Before any operation, read the resources**\nAlways read all required resources before performing any action.\n\n# Actions\n\n## "get" - Get a specific component\nReturns full details of a component including its overridable properties.\nRequired: component_uid\n\n## "save" - Save an element as a new component\nCreates a new reusable component from an existing element.\nRequired: element_id, component_name\nOptional: overridable_props, groups\n\n# IMPORTANT - Before saving a new component\n**Always read [${Ct}] first** to see existing components and avoid creating duplicates.\nUse "get" to inspect an existing component if you need to understand its structure.\n\n# When NOT to use "save"\n- Element is already a component (widgetType: 'e-component')\n- Element is locked\n- Element is not an atomic element (atomic_props_schema is not defined)\n- Element elType is a 'widget'\n\n# **REQUIRED RESOURCES (Must read before any operation)**\n1. [${Ct}]\n **MANDATORY** - Live list of all existing components. Always read this first to check for duplicates.\n\n2. [${re.DOCUMENT_STRUCTURE_URI}]\n **MANDATORY** - Required to understand the document structure and identify child elements for overridable properties.\n\n3. [${re.WIDGET_SCHEMA_URI}]\n **MANDATORY** - Required to understand which properties are available for each widget type.\n\n# Instructions for "save" - MUST FOLLOW IN ORDER\n## Step 1: Check existing components\n1. Read the [${Ct}] resource to see all existing components\n2. If a suitable component already exists, consider using it instead\n\n## Step 2: Identify the Target Element\n1. Read the [${re.DOCUMENT_STRUCTURE_URI}] resource\n2. Locate the element by its element_id\n3. Verify the element type is valid, not locked, and not already a component\n\n## Step 3: Define Overridable Properties\nSkip ONLY if the user explicitly requests no customizable properties.\n\n1. **Identify Child Elements** via [${re.DOCUMENT_STRUCTURE_URI}]\n2. **Find Available Properties** via [${re.WIDGET_SCHEMA_URI}] → atomic_props_schema\n - Use only top-level props (e.g., "text", "url", "tag", "size")\n3. **Build the overridable_props object** with unique, user-friendly labels\n\n## Step 4: Execute "save"\nCall with element_id, component_name, and optionally overridable_props and groups.\n\n# CONSTRAINTS\n- NEVER try to override properties of the parent element itself — ONLY child elements\n- NEVER use invalid propKeys — always verify against atomic_props_schema in [${re.WIDGET_SCHEMA_URI}]\n- Element IDs must exist within the target element's children\n- The element being saved must not be inside another component\n`),e.parameter("action",'**MANDATORY** The operation to perform:\n- "get": Returns details of a specific component. Requires component_uid.\n- "save": Creates a new component from an element. Requires element_id and component_name.'),e.parameter("component_uid",`**Required for "get"** The unique identifier of the component to retrieve.\nRead the [${Ct}] resource first to discover available component UIDs.`),e.parameter("element_id",`**Required for "save"** The unique identifier of the element to save as a component.\nUse the [${re.DOCUMENT_STRUCTURE_URI}] resource to find available element IDs.`),e.parameter("component_name",'**Required for "save"** A descriptive name for the new component.\nShould be unique and clearly describe the component\'s purpose (e.g., "Hero Section", "Feature Card").'),e.parameter("overridable_props",`**Optional for "save"** Configuration for which child element properties can be customized in component instances.\n\nStructure:\n\`\`\`json\n{\n "props": {\n "<unique-key>": {\n "elementId": "<child-element-id>",\n "propKey": "<property-key>",\n "label": "<user-friendly-name>"\n }\n }\n}\n\`\`\`\n\nTo populate this correctly:\n1. Use [${re.DOCUMENT_STRUCTURE_URI}] to find child element IDs and their widgetType\n2. Use [${re.WIDGET_SCHEMA_URI}] to find the atomic_props_schema for each child element's widgetType\n3. Only include properties you want to be customizable in component instances\n4. Provide a unique, user-friendly label for each property`),e.example('\nGet a specific component:\n```json\n{ "action": "get", "component_uid": "component-abc123" }\n```\n\nSave without overridable properties:\n```json\n{ "action": "save", "element_id": "abc123", "component_name": "Hero Section" }\n```\n\nSave with overridable properties:\n```json\n{\n "action": "save",\n "element_id": "abc123",\n "component_name": "Feature Card",\n "overridable_props": {\n "props": {\n "heading-text": {\n "elementId": "heading-123",\n "propKey": "text",\n "label": "Card Title",\n "group": "Content"\n },\n "button-link": {\n "elementId": "button-456",\n "propKey": "url",\n "label": "Button Link",\n "group": "Settings"\n }\n }\n }\n}\n```\n'),e.instruction('After successful "save", the component will be available in the components library and can be inserted into any page or template.'),e.instruction("When overridable properties are defined, component instances will show customization controls for those specific properties in the editing panel."),e.prompt()},Ot=e=>{const{addTool:t}=e;t({name:"manage-component",schema:It,outputSchema:Tt,description:kt(),requiredResources:[{uri:Ct,description:"List of all components"},{uri:re.DOCUMENT_STRUCTURE_URI,description:"Document structure"},{uri:re.WIDGET_SCHEMA_URI,description:"Widget schema"}],handler:Pt})},Dt="ctrl+shift+k",At="elementor/editor/open-save-as-component-form";function Rt(){const e=(0,x.getSelectedElements)();if(1!==e.length)return{allowed:!1};const t=e[0];if(!(0,x.getElementType)(t.type))return{allowed:!1};const n=(0,x.getWidgetsCache)(),o=n?.[t.type];if(!o?.atomic_props_schema||!o?.show_in_panel||"widget"===o?.elType)return{allowed:!1};const r=window.elementor.getContainer(t.id);return!r||r.isLocked()?{allowed:!1}:{allowed:!0,container:r}}const zt=({container:e})=>{const t=e.document;if(!t||t.config.type!==et)return;const n=o.componentsSelectors.getOverridableProps(t.id);n&&e.settings.set("overridable_props",n)};async function Mt({elements:e,status:t}){const n=o.componentsSelectors.getUnpublishedComponents();if(n.length)try{const r=await async function(e,t){const n=await o.apiClient.create({status:t,items:e.map(e=>({uid:e.uid,title:e.name,elements:e.elements,settings:e.overridableProps?{overridable_props:e.overridableProps}:void 0}))}),r=new Map;return Object.entries(n).forEach(([e,t])=>{r.set(e,t)}),r}(n,t);Ut(e,r),o.componentsActions.add(n.map(e=>({id:r.get(e.uid),name:e.name,uid:e.uid,overridableProps:e.overridableProps?e.overridableProps:void 0}))),o.componentsActions.resetUnpublished()}catch(e){const t=n.map(e=>e.uid);throw o.componentsActions.removeUnpublished(t),new Error(`Failed to publish components: ${e}`)}}function Ut(e,t){e.forEach(e=>{const{shouldUpdate:n,newComponentId:o}=function(e,t){if("e-component"===e.widgetType){const n=e.settings?.component_instance?.value?.component_id.value;if(n&&t.has(n.toString()))return{shouldUpdate:!0,newComponentId:t.get(n.toString())}}return{shouldUpdate:!1,newComponentId:null}}(e,t);var r,i;n&&(r=e.id,i=o,(0,x.updateElementSettings)({id:r,props:{component_instance:{$$type:"component-instance",value:{component_id:{$$type:"number",value:i}}}},withHistory:!1})),e.elements&&Ut(e.elements,t)})}const Lt=({container:e,status:t})=>{const n=e?.model.get("elements").toJSON?.()??[];return Promise.all([jt({elements:n,status:t}),zt({container:e})])},jt=async({elements:e,status:t})=>{await Nt({elements:e,status:t}),await Mt({elements:e,status:t})},Nt=async({elements:e,status:t})=>{await(async e=>{const t=o.componentsSelectors.getUpdatedComponentNames();t.length&&0===(await o.apiClient.updateComponentTitle(t,e)).failedIds.length&&o.componentsActions.cleanUpdatedComponentNames()})(t),await(async e=>{try{const t=o.componentsSelectors.getArchivedThisSession();if(!t.length)return;const n=(await o.apiClient.updateArchivedComponents(t,e)).failedIds.join(", ");n&&(0,ie.notify)({type:"error",message:`Failed to archive components: ${n}`,id:"failed-archived-components-notification"})}catch(e){throw new Error(`Failed to update archived components: ${e}`)}})(t),await(0,o.publishDraftComponentsInPageBeforeSave)({elements:e,status:t})};const Vt="e-flexbox";function Bt(e){const t=(0,x.createElement)({container:e,model:{elType:Vt}});(0,x.selectElement)(t.id)}function $t(e){const t=e.children?.[0];return t?{shouldRedirect:!0,container:t}:{shouldRedirect:!1,container:e}}function qt(e){return!("document"!==e.id)&&e.document?.config.type===et}function Kt(){(0,p.registerDataHook)("after","document/elements/duplicate",(e,t)=>{var n;Le()&&(n=t,(Array.isArray(n)?n:[n]).forEach(e=>{!function(e){(0,x.getAllDescendants)(e).forEach(e=>{e.model.get("widgetType")===o.COMPONENT_WIDGET_TYPE?function(e){const t=e.settings?.toJSON()??{},n=o.componentInstancePropTypeUtil.extract(t.component_instance),r=o.componentInstanceOverridesPropTypeUtil.extract(n?.overrides);if(!r?.length)return;const i=T(r),a=o.componentInstancePropTypeUtil.create({...n,overrides:o.componentInstanceOverridesPropTypeUtil.create(i)});(0,x.updateElementSettings)({id:e.id,props:{component_instance:a},withHistory:!1})}(e):function(e){const t=e.settings?.toJSON()??{},{hasChanges:n,settings:o}=P(t);n&&(0,x.updateElementSettings)({id:e.id,props:o,withHistory:!1})}(e)})}(e)}))}),(0,p.registerDataHook)("after","document/elements/copy",e=>{Le()&&function(e){const t=window.elementorCommon?.storage;if(!t)return;const n=t.get(e);if(!n?.elements?.length)return;const o=n.elements.map(S);t.set(e,{...n,elements:o})}(e.storageKey??"clipboard")})}function Ft(){const e=(0,o.useCurrentComponentId)(),t=(0,o.useOverridableProps)(e),n=(0,o.useIsSanitizedComponent)(e,"overridableProps");return(0,u.useEffect)(()=>{if(n||!t||!e)return;const r=(0,o.filterValidOverridableProps)(t),i=Object.keys(t.props??{}).filter(e=>!r.props[e]);var a;i.length>0&&i.forEach(t=>{k({componentId:e,propKey:t,source:"system"})}),a=e,o.componentsActions.updateComponentSanitizedAttribute(a,"overridableProps")},[e,n,t]),null}const Gt=1;function Wt(){(function(e){const t=window.elementorCommonConfig?.version??"0.0",[n,o]=t.split(".").map(Number),[r,i]=e.split(".").map(Number);return n>r||n===r&&o>=i})("4.0.0")&&((0,a.registerEditingPanelReplacement)({id:"extended-component-instance-edit-panel",priority:Gt,condition:(e,t)=>"e-component"===t.key,component:ct}),(0,s.registerTab)({id:"components",label:(0,d.__)("Components","elementor-pro"),component:ke,priority:Gt}),(0,c.__registerPanel)(J),(0,p.registerDataHook)("dependency","editor/documents/close",e=>((0,i.getV1CurrentDocument)().config.type===et&&(e.mode="autosave"),!0)),(0,p.registerDataHook)("after","preview/drop",o.onElementDrop),window.elementorCommon.__beforeSave=Lt,(0,n.injectIntoTop)({id:"create-component-popup",component:Je,options:{overwrite:!0}}),(0,n.injectIntoTop)({id:"edit-component",component:st,options:{overwrite:!0}}),(0,a.injectIntoPanelHeaderTop)({id:"component-panel-header",component:oe,options:{overwrite:!0}}),(0,a.registerFieldIndicator)({fieldType:a.FIELD_TYPE.SETTINGS,id:"component-overridable-prop",priority:1,indicator:Et}),(0,r.registerControlReplacement)({id:Qe,component:mt,condition:({value:e})=>o.componentOverridablePropTypeUtil.isValid(e)}),(0,p.registerDataHook)("dependency","document/elements/delete",(e,t)=>{if(function(e){const t=e?.commandsCurrentTrace?.includes("document/elements/move")||e?.commandsCurrentTrace?.includes("document/repeater/move");return Boolean(t)}(t))return!0;const n=o.componentsSelectors.getCurrentComponentId();if(!n)return!0;const r=o.componentsSelectors.getOverridableProps(n);if(!r||0===Object.keys(r.props).length)return!0;const i=e.containers??(e.container?[e.container]:[]);if(0===i.length)return!0;const a=function(e){return e.filter(Boolean).flatMap(e=>[e,...(0,x.getAllDescendants)(e)]).map(e=>e.model?.get?.("id")??e.id).filter(e=>Boolean(e))}(i);if(0===a.length)return!0;const s=Object.entries(r.props).filter(([,e])=>a.includes(e.elementId)).map(([e])=>e);return 0===s.length||k({componentId:n,propKey:s,source:"system"}),!0}),(0,p.blockCommand)({command:"document/elements/create",condition:Ve}),(0,p.blockCommand)({command:"document/elements/move",condition:Be}),(0,p.blockCommand)({command:"document/elements/paste",condition:$e}),(0,p.registerDataHook)("dependency","preview/drop",e=>{if(!Le())return!0;const t=e.containers??(e.container?[e.container]:[]);for(const n of t){if(!qt(n))continue;const{shouldRedirect:t,container:o}=$t(n);if(t)if(e.containers){const t=e.containers.indexOf(n);e.containers[t]=o}else e.container=o}return!0}),(0,p.registerDataHook)("after","document/elements/delete",e=>{if(!Le())return;const t=e.containers??(e.container?[e.container]:[]);for(const e of t){if(!e.parent||!qt(e.parent))continue;const t=e.parent;0===t.children?.length&&Bt(e.parent)}}),Kt(),(0,n.injectIntoLogic)({id:"sanitize-overridable-props",component:Ft,options:{overwrite:!0}}),(0,m.fetchLicenseStatus)().then(e=>{e||window.$e.shortcuts.register(Dt,{callback:()=>{const e=Rt();e.allowed&&function(e){const t=window,n=e.view.el.getBoundingClientRect(),o=t.elementor.$preview[0].getBoundingClientRect(),r={left:o.left+n.left+n.width/2,top:o.top+n.top};window.dispatchEvent(new CustomEvent(At,{detail:{element:e.model.toJSON({remove:["default"]}),anchorPosition:r,options:{trigger:"keyboard",location:"canvas",secondaryLocation:"canvasElement"}}}))}(e.container)},dependency:()=>Rt().allowed,exclude:["input"]})}).catch(()=>{}),function(e){const{setMCPDescription:t,waitForReady:n}=e;t("Components V4 MCP Server - Tools for creating and managing reusable components."),n().then(()=>{wt(e),Ot(e)})}((0,l.getMCPByDomain)("components",{instructions:tt})))}(window.elementorV2=window.elementorV2||{}).editorComponentsExtended=t}(),window.elementorV2.editorComponentsExtended?.init?.();
|