@elementor/editor-canvas 0.11.0 → 0.12.0

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @elementor/editor-canvas@0.11.0 build
+> @elementor/editor-canvas@0.12.0 build
 > tsup --config=../../tsup.build.ts
 
 CLI Building entry: src/index.ts
@@ -10,13 +10,13 @@
 CLI Cleaning output folder
 ESM Build start
 CJS Build start
-ESM dist/index.mjs     17.23 KB
-ESM dist/index.mjs.map 37.61 KB
-ESM ⚡️ Build success in 134ms
-CJS dist/index.js     19.31 KB
-CJS dist/index.js.map 37.66 KB
-CJS ⚡️ Build success in 139ms
+ESM dist/index.mjs     17.96 KB
+ESM dist/index.mjs.map 39.31 KB
+ESM ⚡️ Build success in 193ms
+CJS dist/index.js     20.07 KB
+CJS dist/index.js.map 39.36 KB
+CJS ⚡️ Build success in 195ms
 DTS Build start
-DTS ⚡️ Build success in 19626ms
+DTS ⚡️ Build success in 22077ms
 DTS dist/index.d.mts 561.00 B
 DTS dist/index.d.ts  561.00 B

package/CHANGELOG.md

@@ -1,5 +1,37 @@
 # @elementor/editor-canvas
 
+## 0.12.0
+
+### Minor Changes
+
+- 7d37fc1: Add background gradient overlay control
+
+### Patch Changes
+
+- Updated dependencies [7d37fc1]
+  - @elementor/editor-props@0.10.0
+  - @elementor/editor-styles-repository@0.7.5
+  - @elementor/editor-elements@0.6.2
+  - @elementor/editor-styles@0.6.2
+
+## 0.11.1
+
+### Patch Changes
+
+- 23458d1: Make atomic controls use Logical Properties
+- 959e02c: Disable canvas and app bar buttons when opening the class manager panel
+- Updated dependencies [23458d1]
+- Updated dependencies [f6a4d4f]
+- Updated dependencies [959e02c]
+  - @elementor/editor-props@0.9.4
+  - @elementor/wp-media@0.5.0
+  - @elementor/editor-v1-adapters@0.10.2
+  - @elementor/editor-styles-repository@0.7.4
+  - @elementor/editor-elements@0.6.1
+  - @elementor/editor-styles@0.6.1
+  - @elementor/editor@0.18.2
+  - @elementor/editor-responsive@0.13.2
+
 ## 0.11.0
 
 ### Minor Changes

package/dist/index.js

@@ -147,9 +147,10 @@ function ElementOverlay({ element, isSelected }) {
 function ElementsOverlays() {
   const selected = (0, import_editor_elements.useSelectedElement)();
   const domElements = (0, import_editor_elements.useElementsDomRef)();
-  const isPreviewMode = (0, import_editor_v1_adapters.__privateUseIsPreviewMode)();
+  const currentEditMode = (0, import_editor_v1_adapters.useEditMode)();
+  const isEditMode = currentEditMode === "edit";
   const isKitRouteActive = (0, import_editor_v1_adapters.__privateUseIsRouteActive)("panel/global");
-  const isActive = !isPreviewMode && !isKitRouteActive;
+  const isActive = isEditMode && !isKitRouteActive;
   return isActive && domElements.map((el) => /* @__PURE__ */ React2.createElement(
     ElementOverlay,
     {
@@ -187,6 +188,14 @@ var backgroundColorOverlayTransformer = createTransformer(
   (value) => `linear-gradient(${value}, ${value})`
 );
 
+// src/transformers/styles/background-gradient-overlay-transformer.ts
+var backgroundGradientOverlayTransformer = createTransformer((value) => {
+  if (value.type === "radial") {
+    return `radial-gradient(circle at ${value.positions}, ${value.stops})`;
+  }
+  return `linear-gradient(${value.angle}deg, ${value.stops})`;
+});
+
 // src/transformers/styles/background-image-overlay-transformer.ts
 var DEFAULT_POSITION_VALUE = "0% 0%";
 var backgroundImageOverlayTransformer = createTransformer((value) => {
@@ -220,6 +229,11 @@ var backgroundTransformer = createTransformer((value) => {
   return `${overlays} ${color}`.trim();
 });
 
+// src/transformers/styles/color-stop-transformer.ts
+var colorStopTransformer = createTransformer(
+  (value) => `${value?.color} ${value?.offset ?? 0}%`
+);
+
 // src/transformers/styles/create-combine-array-transformer.ts
 var createCombineArrayTransformer = (delimiter) => {
   return createTransformer((value) => value.filter(Boolean).join(delimiter));
@@ -308,15 +322,18 @@ function initStyleTransformers() {
   styleTransformersRegistry.register("size", sizeTransformer).register("shadow", shadowTransformer).register("stroke", strokeTransformer).register(
     "dimensions",
     createMultiPropsTransformer(
-      ["top", "right", "bottom", "left"],
+      ["block-start", "block-end", "inline-start", "inline-end"],
       ({ propKey, key }) => `${propKey}-${key}`
     )
-  ).register("color", primitiveTransformer).register("number", primitiveTransformer).register("string", primitiveTransformer).register("url", primitiveTransformer).register("box-shadow", createCombineArrayTransformer(",")).register("background", backgroundTransformer).register("background-overlay", createCombineArrayTransformer(",")).register("background-color-overlay", backgroundColorOverlayTransformer).register("background-image-overlay", backgroundImageOverlayTransformer).register("background-image-position-offset", backgroundImagePositionOffsetTransformer).register("background-image-size-scale", backgroundImageSizeScaleTransformer).register("image-attachment-id", imageAttachmentTransformer).register("image-src", imageSrcTransformer).register("image", imageTransformer).register(
+  ).register("color", primitiveTransformer).register("number", primitiveTransformer).register("string", primitiveTransformer).register("url", primitiveTransformer).register("box-shadow", createCombineArrayTransformer(",")).register("background", backgroundTransformer).register("background-overlay", createCombineArrayTransformer(",")).register("background-color-overlay", backgroundColorOverlayTransformer).register("background-image-overlay", backgroundImageOverlayTransformer).register("background-gradient-overlay", backgroundGradientOverlayTransformer).register("gradient-color-stop", createCombineArrayTransformer(",")).register("color-stop", colorStopTransformer).register("background-image-position-offset", backgroundImagePositionOffsetTransformer).register("background-image-size-scale", backgroundImageSizeScaleTransformer).register("image-attachment-id", imageAttachmentTransformer).register("image-src", imageSrcTransformer).register("image", imageTransformer).register(
     "layout-direction",
     createMultiPropsTransformer(["row", "column"], ({ propKey, key }) => `${key}-${propKey}`)
   ).register(
     "border-width",
-    createMultiPropsTransformer(["top", "right", "bottom", "left"], ({ key }) => `border-${key}-width`)
+    createMultiPropsTransformer(
+      ["block-start", "block-end", "inline-start", "inline-end"],
+      ({ key }) => `border-${key}-width`
+    )
   ).register(
     "border-radius",
     createMultiPropsTransformer(

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/init.tsx","../src/components/elements-overlays.tsx","../src/components/element-overlay.tsx","../src/hooks/use-bind-react-props-to-element.ts","../src/hooks/use-floating-on-element.ts","../src/transformers/create-transformers-registry.ts","../src/style-transformers-registry.ts","../src/transformers/create-transformer.ts","../src/transformers/styles/background-color-overlay-transformer.ts","../src/transformers/styles/background-image-overlay-transformer.ts","../src/transformers/styles/background-image-position-offset-transformer.ts","../src/transformers/styles/background-image-size-scale-transformer.ts","../src/transformers/styles/background-transformer.ts","../src/transformers/styles/create-combine-array-transformer.ts","../src/renderers/multi-props.ts","../src/transformers/styles/create-multi-props-transformer.ts","../src/transformers/styles/image-attachment-transformer.ts","../src/transformers/styles/image-src-transformer.ts","../src/transformers/styles/image-transformer.ts","../src/transformers/styles/primitive-transformer.ts","../src/transformers/styles/shadow-transformer.ts","../src/transformers/styles/size-transformer.ts","../src/transformers/styles/stroke-transformer.ts","../src/init-style-transformers.ts","../src/init-styles-renderer.ts","../src/renderers/create-props-resolver.ts","../src/renderers/errors.ts","../src/renderers/render-styles.ts","../src/sync/enqueue-font.ts","../src/sync/get-canvas-iframe-body.ts"],"sourcesContent":["import { init } from './init';\n\nexport { styleTransformersRegistry } from './style-transformers-registry';\n\ninit();\n","import { injectIntoTop } from '@elementor/editor';\n\nimport { ElementsOverlays } from './components/elements-overlays';\nimport { initStyleTransformers } from './init-style-transformers';\nimport { initStylesRenderer } from './init-styles-renderer';\n\nexport function init() {\n\tinitStyleTransformers();\n\tinitStylesRenderer();\n\n\tinjectIntoTop( {\n\t\tid: 'elements-overlays',\n\t\tcomponent: ElementsOverlays,\n\t} );\n}\n","import * as React from 'react';\nimport { useElementsDomRef, useSelectedElement } from '@elementor/editor-elements';\nimport {\n\t__privateUseIsPreviewMode as useIsPreviewMode,\n\t__privateUseIsRouteActive as useIsRouteActive,\n} from '@elementor/editor-v1-adapters';\n\nimport { ElementOverlay } from './element-overlay';\n\nexport function ElementsOverlays() {\n\tconst selected = useSelectedElement();\n\tconst domElements = useElementsDomRef();\n\n\tconst isPreviewMode = useIsPreviewMode();\n\tconst isKitRouteActive = useIsRouteActive( 'panel/global' );\n\n\tconst isActive = ! isPreviewMode && ! isKitRouteActive;\n\n\treturn (\n\t\tisActive &&\n\t\tdomElements.map( ( el ) => (\n\t\t\t<ElementOverlay\n\t\t\t\telement={ el }\n\t\t\t\tkey={ el.dataset.id }\n\t\t\t\tisSelected={ selected.element?.id === el.dataset.id }\n\t\t\t/>\n\t\t) )\n\t);\n}\n","import * as React from 'react';\nimport { Box, styled } from '@elementor/ui';\nimport { FloatingPortal, useHover, useInteractions } from '@floating-ui/react';\n\nimport { useBindReactPropsToElement } from '../hooks/use-bind-react-props-to-element';\nimport { useFloatingOnElement } from '../hooks/use-floating-on-element';\n\nexport const CANVAS_WRAPPER_ID = 'elementor-preview-responsive-wrapper';\n\ntype Props = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nconst OverlayBox = styled( Box, { shouldForwardProp: ( prop ) => prop !== 'isSelected' } )<\n\tPick< Props, 'isSelected' >\n>( ( { theme, isSelected } ) => ( {\n\toutline: `${ isSelected ? '2px' : '1px' } solid ${ theme.palette.primary.light }`,\n\toutlineOffset: isSelected ? '-2px' : '-1px',\n\tpointerEvents: 'none',\n} ) );\n\nexport function ElementOverlay( { element, isSelected }: Props ) {\n\tconst { context, floating, isVisible } = useFloatingOnElement( { element, isSelected } );\n\tconst { getFloatingProps, getReferenceProps } = useInteractions( [ useHover( context ) ] );\n\n\tuseBindReactPropsToElement( element, getReferenceProps );\n\n\treturn (\n\t\tisVisible && (\n\t\t\t<FloatingPortal id={ CANVAS_WRAPPER_ID }>\n\t\t\t\t<OverlayBox\n\t\t\t\t\tref={ floating.setRef }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tstyle={ floating.styles }\n\t\t\t\t\tdata-element-overlay={ element.dataset.id }\n\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t{ ...getFloatingProps() }\n\t\t\t\t/>\n\t\t\t</FloatingPortal>\n\t\t)\n\t);\n}\n","import { useEffect } from 'react';\n\ntype Props = Record< string, unknown >;\n\nexport function useBindReactPropsToElement( element: HTMLElement, getProps: () => Props ) {\n\tuseEffect( () => {\n\t\tconst el = element;\n\n\t\tconst { events, attrs } = groupProps( getProps() );\n\n\t\tevents.forEach( ( [ eventName, listener ] ) => el.addEventListener( eventName, listener ) );\n\t\tattrs.forEach( ( [ attrName, attrValue ] ) => el.setAttribute( attrName, attrValue ) );\n\n\t\treturn () => {\n\t\t\tevents.forEach( ( [ eventName, listener ] ) => el.removeEventListener( eventName, listener ) );\n\t\t\tattrs.forEach( ( [ attrName ] ) => el.removeAttribute( attrName ) );\n\t\t};\n\t}, [ getProps, element ] );\n}\n\ntype GroupedProps = {\n\tevents: Array< [ string, () => void ] >;\n\tattrs: Array< [ string, string ] >;\n};\n\nfunction groupProps( props: Props ) {\n\tconst eventRegex = /^on(?=[A-Z])/;\n\n\treturn Object.entries( props ).reduce< GroupedProps >(\n\t\t( acc, [ propName, propValue ] ) => {\n\t\t\tif ( ! eventRegex.test( propName ) ) {\n\t\t\t\tacc.attrs.push( [ propName, propValue as string ] );\n\n\t\t\t\treturn acc;\n\t\t\t}\n\n\t\t\tconst eventName = propName.replace( eventRegex, '' ).toLowerCase();\n\t\t\tconst listener = propValue as () => void;\n\n\t\t\tacc.events.push( [ eventName, listener ] );\n\n\t\t\treturn acc;\n\t\t},\n\t\t{\n\t\t\tevents: [],\n\t\t\tattrs: [],\n\t\t}\n\t);\n}\n","import { useState } from 'react';\nimport { autoUpdate, offset, size, useFloating } from '@floating-ui/react';\n\ntype Options = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nexport function useFloatingOnElement( { element, isSelected }: Options ) {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst { refs, floatingStyles, context } = useFloating( {\n\t\t// Must be controlled for interactions (like hover) to work.\n\t\topen: isOpen || isSelected,\n\t\tonOpenChange: setIsOpen,\n\n\t\t// Add an animation frame to support scroll events (without it the floating element will stay in the same position).\n\t\twhileElementsMounted: ( ...args ) => autoUpdate( ...args, { animationFrame: true } ),\n\n\t\t// The first element in the canvas is `display: contents` so we need to use the first child.\n\t\telements: { reference: element.firstElementChild },\n\n\t\tmiddleware: [\n\t\t\t// Match the floating element's size to the reference element.\n\t\t\tsize( {\n\t\t\t\tapply( { elements, rects } ) {\n\t\t\t\t\tObject.assign( elements.floating.style, {\n\t\t\t\t\t\twidth: `${ rects.reference.width }px`,\n\t\t\t\t\t\theight: `${ rects.reference.height }px`,\n\t\t\t\t\t} );\n\t\t\t\t},\n\t\t\t} ),\n\n\t\t\t// Center the floating element on the reference element.\n\t\t\toffset( ( { rects } ) => -rects.reference.height / 2 - rects.floating.height / 2 ),\n\t\t],\n\t} );\n\n\treturn {\n\t\tisVisible: isOpen || isSelected,\n\t\tcontext,\n\t\tfloating: {\n\t\t\tsetRef: refs.setFloating,\n\t\t\tref: refs.floating,\n\t\t\tstyles: floatingStyles,\n\t\t},\n\t};\n}\n","import { type AnyTransformer, type TransformerName, type TransformersMap } from './types';\n\nexport function createTransformersRegistry() {\n\tconst transformers: TransformersMap = {};\n\n\treturn {\n\t\tregister( name: TransformerName, transformer: AnyTransformer ) {\n\t\t\ttransformers[ name ] = transformer;\n\n\t\t\treturn this;\n\t\t},\n\t\tall() {\n\t\t\treturn transformers;\n\t\t},\n\t};\n}\n","import { createTransformersRegistry } from './transformers/create-transformers-registry';\n\nexport const styleTransformersRegistry = createTransformersRegistry();\n","import { type AnyTransformable } from '@elementor/editor-props';\n\nimport { type Transformer, type UnbrandedTransformer } from './types';\n\n// Wrap transformer for better DX (types).\n// Inspired by: https://tkdodo.eu/blog/the-query-options-api\nexport function createTransformer< TValue = never >(\n\tcb: TValue extends AnyTransformable\n\t\t? 'Transformable values are invalid, use the actual value instead.'\n\t\t: UnbrandedTransformer< TValue >\n): Transformer< NoInfer< TValue > > {\n\treturn cb as never;\n}\n","import { createTransformer } from '../create-transformer';\n\nexport const backgroundColorOverlayTransformer = createTransformer(\n\t( value: string ) => `linear-gradient(${ value }, ${ value })`\n);\n","import { createTransformer } from '../create-transformer';\n\nconst DEFAULT_POSITION_VALUE = '0% 0%';\n\ntype BackgroundImageOverlay = {\n\timage?: string;\n\tsize?: string;\n\tposition?: string;\n\trepeat?: string;\n\tattachment?: string;\n};\n\nexport const backgroundImageOverlayTransformer = createTransformer( ( value: BackgroundImageOverlay ) => {\n\tconst { image, size = null, position = null, repeat = null, attachment = null } = value;\n\n\tif ( ! image ) {\n\t\treturn null;\n\t}\n\n\tconst backgroundStyles = [\n\t\timage,\n\t\trepeat,\n\t\tattachment,\n\t\tsize ? `${ position || DEFAULT_POSITION_VALUE } / ${ size }` : position,\n\t].filter( Boolean );\n\n\treturn backgroundStyles.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImagePositionOffset = {\n\tx?: string;\n\ty?: string;\n};\n\nexport const backgroundImagePositionOffsetTransformer = createTransformer(\n\t( { x = '0px', y = '0px' }: BackgroundImagePositionOffset ) => `${ x } ${ y }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImageSizeScale = {\n\twidth?: string;\n\theight?: string;\n};\n\nexport const backgroundImageSizeScaleTransformer = createTransformer(\n\t( { width = 'auto', height = 'auto' }: BackgroundImageSizeScale ) => `${ width } ${ height }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype Background = {\n\t'background-overlay'?: string;\n\tcolor?: string;\n};\n\nexport const backgroundTransformer = createTransformer( ( value: Background ) => {\n\tconst overlays = value[ 'background-overlay' ] ?? '';\n\tconst color = value.color ?? '';\n\n\treturn `${ overlays } ${ color }`.trim();\n} );\n","import { createTransformer } from '../create-transformer';\n\nexport const createCombineArrayTransformer = ( delimiter: string ) => {\n\treturn createTransformer( ( value: Array< string | number > ) => value.filter( Boolean ).join( delimiter ) );\n};\n","import { type Props, type PropValue } from '@elementor/editor-props';\n\ntype MultiProps = {\n\t'$$multi-props': true;\n\tvalue: Props;\n};\n\nexport const isMultiProps = ( propValue: PropValue ): propValue is MultiProps => {\n\treturn (\n\t\t!! propValue &&\n\t\ttypeof propValue === 'object' &&\n\t\t'$$multi-props' in propValue &&\n\t\tpropValue[ '$$multi-props' ] === true\n\t);\n};\n\nexport const createMultiPropsValue = ( props: Props ): MultiProps => {\n\treturn {\n\t\t'$$multi-props': true,\n\t\tvalue: props,\n\t};\n};\n\nexport const getMultiPropsValue = ( multiProps: MultiProps ): Props => {\n\treturn multiProps.value;\n};\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype KeyGenerator = ( { propKey, key }: { propKey: string; key: string } ) => string;\n\nexport const createMultiPropsTransformer = ( keys: string[], keyGenerator: KeyGenerator ) => {\n\treturn createTransformer< Record< string, string > >( ( value, { key: propKey } ) => {\n\t\tconst entries = keys\n\t\t\t.filter( ( key ) => value[ key ] )\n\t\t\t.map( ( key ) => [ keyGenerator( { propKey, key } ), value[ key ] ] );\n\n\t\treturn createMultiPropsValue( Object.fromEntries( entries ) );\n\t} );\n};\n","import { getMediaAttachment } from '@elementor/wp-media';\n\nimport { createTransformer } from '../create-transformer';\n\ntype ImageAttachmentId = number;\n\nexport const imageAttachmentTransformer = createTransformer( async ( value: ImageAttachmentId ) => {\n\tconst attachment = await getMediaAttachment( { id: value } );\n\n\tif ( ! attachment ) {\n\t\treturn null;\n\t}\n\n\treturn attachment;\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype ImageSrc = {\n\tid?: unknown;\n\turl?: unknown;\n};\n\nexport const imageSrcTransformer = createTransformer( ( value: ImageSrc ) => ( {\n\tattachment: value.id,\n\turl: value.url,\n} ) );\n","import { createTransformer } from '../create-transformer';\n\ntype Image = {\n\tsrc?: {\n\t\turl?: string;\n\t\tattachment?: {\n\t\t\turl?: string;\n\t\t\tsizes?: Record< string, { url: string } >;\n\t\t};\n\t};\n\tsize?: string;\n};\n\nexport const imageTransformer = createTransformer( ( value: Image ) => {\n\tconst { src, size } = value;\n\n\tif ( src?.url ) {\n\t\treturn `url(${ src.url })`;\n\t}\n\n\tconst sizeUrl = src?.attachment?.sizes?.[ size ?? '' ]?.url;\n\n\tif ( sizeUrl ) {\n\t\treturn `url(${ sizeUrl })`;\n\t}\n\n\tconst attachmentUrl = src?.attachment?.url;\n\n\tif ( attachmentUrl ) {\n\t\treturn `url(${ attachmentUrl })`;\n\t}\n\n\treturn null;\n} );\n","import { createTransformer } from '../create-transformer';\n\nexport const primitiveTransformer = createTransformer( ( value: unknown ) => value );\n","import { createTransformer } from '../create-transformer';\n\ntype Shadow = {\n\thOffset?: string;\n\tvOffset?: string;\n\tblur?: string;\n\tspread?: string;\n\tcolor?: string;\n\tposition?: string;\n};\n\nexport const shadowTransformer = createTransformer( ( value: Shadow ) => {\n\treturn [ value.hOffset, value.vOffset, value.blur, value.spread, value.color, value.position ]\n\t\t.filter( Boolean )\n\t\t.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype Size = {\n\tsize?: number;\n\tunit?: string;\n};\n\nexport const sizeTransformer = createTransformer( ( value: Size ) => {\n\treturn `${ value.size }${ value.unit }`;\n} );\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype Stroke = {\n\twidth?: string;\n\tcolor?: string;\n};\n\nexport const strokeTransformer = createTransformer( ( value: Stroke ) => {\n\tconst parsed = {\n\t\t'-webkit-text-stroke': `${ value.width } ${ value.color }`,\n\t\tstroke: `${ value.color }`,\n\t\t'stroke-width': `${ value.width }`,\n\t};\n\n\treturn createMultiPropsValue( parsed );\n} );\n","import { styleTransformersRegistry } from './style-transformers-registry';\nimport { backgroundColorOverlayTransformer } from './transformers/styles/background-color-overlay-transformer';\nimport { backgroundImageOverlayTransformer } from './transformers/styles/background-image-overlay-transformer';\nimport { backgroundImagePositionOffsetTransformer } from './transformers/styles/background-image-position-offset-transformer';\nimport { backgroundImageSizeScaleTransformer } from './transformers/styles/background-image-size-scale-transformer';\nimport { backgroundTransformer } from './transformers/styles/background-transformer';\nimport { createCombineArrayTransformer } from './transformers/styles/create-combine-array-transformer';\nimport { createMultiPropsTransformer } from './transformers/styles/create-multi-props-transformer';\nimport { imageAttachmentTransformer } from './transformers/styles/image-attachment-transformer';\nimport { imageSrcTransformer } from './transformers/styles/image-src-transformer';\nimport { imageTransformer } from './transformers/styles/image-transformer';\nimport { primitiveTransformer } from './transformers/styles/primitive-transformer';\nimport { shadowTransformer } from './transformers/styles/shadow-transformer';\nimport { sizeTransformer } from './transformers/styles/size-transformer';\nimport { strokeTransformer } from './transformers/styles/stroke-transformer';\n\nexport function initStyleTransformers() {\n\tstyleTransformersRegistry\n\t\t.register( 'size', sizeTransformer )\n\t\t.register( 'shadow', shadowTransformer )\n\t\t.register( 'stroke', strokeTransformer )\n\t\t.register(\n\t\t\t'dimensions',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'top', 'right', 'bottom', 'left' ],\n\t\t\t\t( { propKey, key } ) => `${ propKey }-${ key }`\n\t\t\t)\n\t\t)\n\t\t.register( 'color', primitiveTransformer )\n\t\t.register( 'number', primitiveTransformer )\n\t\t.register( 'string', primitiveTransformer )\n\t\t.register( 'url', primitiveTransformer )\n\t\t.register( 'box-shadow', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background', backgroundTransformer )\n\t\t.register( 'background-overlay', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background-color-overlay', backgroundColorOverlayTransformer )\n\t\t.register( 'background-image-overlay', backgroundImageOverlayTransformer )\n\t\t.register( 'background-image-position-offset', backgroundImagePositionOffsetTransformer )\n\t\t.register( 'background-image-size-scale', backgroundImageSizeScaleTransformer )\n\t\t.register( 'image-attachment-id', imageAttachmentTransformer )\n\t\t.register( 'image-src', imageSrcTransformer )\n\t\t.register( 'image', imageTransformer )\n\t\t.register(\n\t\t\t'layout-direction',\n\t\t\tcreateMultiPropsTransformer( [ 'row', 'column' ], ( { propKey, key } ) => `${ key }-${ propKey }` )\n\t\t)\n\t\t.register(\n\t\t\t'border-width',\n\t\t\tcreateMultiPropsTransformer( [ 'top', 'right', 'bottom', 'left' ], ( { key } ) => `border-${ key }-width` )\n\t\t)\n\t\t.register(\n\t\t\t'border-radius',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'start-start', 'start-end', 'end-start', 'end-end' ],\n\t\t\t\t( { key } ) => `border-${ key }-radius`\n\t\t\t)\n\t\t);\n}\n","import { getBreakpointsMap } from '@elementor/editor-responsive';\nimport { getStylesSchema } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nimport { createPropsResolver } from './renderers/create-props-resolver';\nimport renderStyles from './renderers/render-styles';\nimport { styleTransformersRegistry } from './style-transformers-registry';\nimport { enqueueFont } from './sync/enqueue-font';\nimport { getCanvasIframeBody } from './sync/get-canvas-iframe-body';\n\nconst WRAPPER_DATA_ATTR = 'data-styles-container';\nconst SELECTOR_PREFIX = '.elementor';\n\nexport function initStylesRenderer() {\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tlet abortController: AbortController | null = null;\n\n\t\tconst resolve = createPropsResolver( {\n\t\t\ttransformers: styleTransformersRegistry.all(),\n\t\t\tschema: getStylesSchema(),\n\t\t\tonPropResolve: enqueueUsedFonts,\n\t\t} );\n\n\t\tstylesRepository.subscribe( async () => {\n\t\t\tconst styleContainer = getStylesContainer();\n\n\t\t\t// Styles should be printed in a reversed order, so the high priority styles will be printed last.\n\t\t\tconst styles = stylesRepository.all().reverse();\n\t\t\tconst breakpoints = getBreakpointsMap();\n\n\t\t\tif ( abortController ) {\n\t\t\t\tabortController.abort();\n\t\t\t}\n\n\t\t\tabortController = new AbortController();\n\n\t\t\tstyleContainer.innerHTML = await renderStyles( {\n\t\t\t\tstyles,\n\t\t\t\tresolve,\n\t\t\t\tbreakpoints,\n\t\t\t\tselectorPrefix: SELECTOR_PREFIX,\n\t\t\t\tsignal: abortController.signal,\n\t\t\t} );\n\t\t} );\n\t} );\n}\n\nfunction getStylesContainer() {\n\tconst preview = getCanvasIframeBody();\n\tconst stylesContainer = preview?.querySelector( `[${ WRAPPER_DATA_ATTR }]` );\n\n\tif ( stylesContainer ) {\n\t\treturn stylesContainer;\n\t}\n\n\tconst el = createStylesContainer();\n\n\tpreview?.prepend( el );\n\n\treturn el;\n}\n\nfunction createStylesContainer() {\n\tconst el = document.createElement( 'div' );\n\tel.style.display = 'none';\n\tel.setAttribute( WRAPPER_DATA_ATTR, '' );\n\n\treturn el;\n}\n\nfunction enqueueUsedFonts( { key, value }: { key: string; value: unknown } ) {\n\tif ( key !== 'font-family' || typeof value !== 'string' ) {\n\t\treturn;\n\t}\n\n\tenqueueFont( value );\n}\n","import {\n\tisTransformable,\n\ttype PropKey,\n\ttype Props,\n\ttype PropsSchema,\n\ttype PropType,\n\ttype PropValue,\n} from '@elementor/editor-props';\n\nimport { type TransformersMap } from '../transformers/types';\nimport { getMultiPropsValue, isMultiProps } from './multi-props';\n\ntype CreatePropResolverArgs = {\n\ttransformers: TransformersMap;\n\tschema: PropsSchema;\n\tonPropResolve?: ( args: { key: string; value: unknown } ) => void;\n};\n\ntype ResolveArgs = {\n\tprops: Props;\n\tschema?: PropsSchema;\n\tsignal?: AbortSignal;\n};\n\ntype TransformArgs = {\n\tvalue: unknown;\n\tkey: PropKey;\n\ttype: PropType;\n\tsignal?: AbortSignal;\n\tdepth?: number;\n};\n\nexport type PropsResolver = ReturnType< typeof createPropsResolver >;\n\nconst TRANSFORM_DEPTH_LIMIT = 3;\n\nexport function createPropsResolver( { transformers, schema: initialSchema, onPropResolve }: CreatePropResolverArgs ) {\n\tasync function resolve( { props, schema, signal }: ResolveArgs ) {\n\t\tschema = schema ?? initialSchema;\n\n\t\tconst promises = Promise.all(\n\t\t\tObject.entries( schema ).map( async ( [ key, type ] ) => {\n\t\t\t\tconst value = props[ key ] ?? type.default;\n\n\t\t\t\tconst transformed = await transform( { value, key, type, signal } );\n\n\t\t\t\tif ( transformed === null ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonPropResolve?.( { key, value: transformed } );\n\n\t\t\t\tif ( isMultiProps( transformed ) ) {\n\t\t\t\t\treturn getMultiPropsValue( transformed );\n\t\t\t\t}\n\n\t\t\t\treturn { [ key ]: transformed };\n\t\t\t} )\n\t\t);\n\n\t\treturn Object.assign( {}, ...( await promises ).filter( Boolean ) );\n\t}\n\n\tasync function transform( { value, key, type, signal, depth = 0 }: TransformArgs ) {\n\t\tif ( value === null || value === undefined ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( ! isTransformable( value ) ) {\n\t\t\treturn value;\n\t\t}\n\n\t\tif ( depth > TRANSFORM_DEPTH_LIMIT ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( value.disabled === true ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( type.kind === 'union' ) {\n\t\t\ttype = type.prop_types[ value.$$type ];\n\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t}\n\n\t\t// Warning: This variable is loosely-typed - use with caution.\n\t\tlet resolvedValue = value.value;\n\n\t\tif ( type.kind === 'object' ) {\n\t\t\tresolvedValue = await resolve( {\n\t\t\t\tprops: resolvedValue,\n\t\t\t\tschema: type.shape,\n\t\t\t\tsignal,\n\t\t\t} );\n\t\t}\n\n\t\tif ( type.kind === 'array' ) {\n\t\t\tresolvedValue = await Promise.all(\n\t\t\t\tresolvedValue.map( ( item: PropValue ) =>\n\t\t\t\t\ttransform( { value: item, key, type: type.item_prop_type, depth, signal } )\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tconst transformer = transformers[ value.$$type ];\n\n\t\tif ( ! transformer ) {\n\t\t\treturn null;\n\t\t}\n\n\t\ttry {\n\t\t\tconst transformed = await transformer( resolvedValue, { key, signal } );\n\n\t\t\treturn transform( { value: transformed, key, type, signal, depth: depth + 1 } );\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\treturn resolve;\n}\n","import { createError } from '@elementor/utils';\n\nexport const UnknownStyleTypeError = createError< { type: string } >( {\n\tcode: 'unknown_style_type',\n\tmessage: 'Unknown style type',\n} );\n","import { type Props } from '@elementor/editor-props';\nimport { type Breakpoint, type BreakpointsMap } from '@elementor/editor-responsive';\nimport { type StyleDefinition, type StyleDefinitionState, type StyleDefinitionType } from '@elementor/editor-styles';\n\nimport { type PropsResolver } from './create-props-resolver';\nimport { UnknownStyleTypeError } from './errors';\n\ntype RenderParams = {\n\tresolve: PropsResolver;\n\tstyles: StyleDefinition[];\n\tbreakpoints: BreakpointsMap;\n\tselectorPrefix?: string;\n\tsignal?: AbortSignal;\n};\n\ntype PropsToCssArgs = {\n\tprops: Props;\n\tresolve: PropsResolver;\n\tsignal?: AbortSignal;\n};\n\nconst SELECTORS_MAP: Record< StyleDefinitionType, string > = {\n\tclass: '.',\n};\n\nexport default async function renderStyles( {\n\tresolve,\n\tstyles,\n\tbreakpoints,\n\tselectorPrefix = '',\n\tsignal,\n}: RenderParams ) {\n\tconst stylesCssPromises = styles.map( async ( style ) => {\n\t\tconst variantCssPromises = Object.values( style.variants ).map( async ( variant ) => {\n\t\t\tconst css = await propsToCss( { props: variant.props, resolve, signal } );\n\n\t\t\treturn createStyleWrapper()\n\t\t\t\t.forStyle( style )\n\t\t\t\t.withPrefix( selectorPrefix )\n\t\t\t\t.withState( variant.meta.state )\n\t\t\t\t.withMediaQuery( variant.meta.breakpoint ? breakpoints[ variant.meta.breakpoint ] : null )\n\t\t\t\t.wrap( css );\n\t\t} );\n\n\t\tconst variantsCss = await Promise.all( variantCssPromises );\n\n\t\treturn wrapCssWithStyleElement( style.id, variantsCss.join( '' ) );\n\t} );\n\n\tconst stylesCss = await Promise.all( stylesCssPromises );\n\n\treturn stylesCss.join( '' );\n}\n\nfunction createStyleWrapper( value: string = '', wrapper?: ( css: string ) => string ) {\n\treturn {\n\t\tforStyle: ( { id, type }: StyleDefinition ) => {\n\t\t\tconst symbol = SELECTORS_MAP[ type ];\n\n\t\t\tif ( ! symbol ) {\n\t\t\t\tthrow new UnknownStyleTypeError( { context: { type } } );\n\t\t\t}\n\n\t\t\treturn createStyleWrapper( `${ value }${ symbol }${ id }`, wrapper );\n\t\t},\n\n\t\twithPrefix: ( prefix: string ) =>\n\t\t\tcreateStyleWrapper( [ prefix, value ].filter( Boolean ).join( ' ' ), wrapper ),\n\n\t\twithState: ( state: StyleDefinitionState ) =>\n\t\t\tcreateStyleWrapper( state ? `${ value }:${ state }` : value, wrapper ),\n\n\t\twithMediaQuery: ( breakpoint: Breakpoint | null ) => {\n\t\t\tif ( ! breakpoint?.type ) {\n\t\t\t\treturn createStyleWrapper( value, wrapper );\n\t\t\t}\n\n\t\t\tconst size = `${ breakpoint.type }:${ breakpoint.width }px`;\n\n\t\t\treturn createStyleWrapper( value, ( css ) => `@media(${ size }){${ css }}` );\n\t\t},\n\n\t\twrap: ( css: string ) => {\n\t\t\tconst res = `${ value }{${ css }}`;\n\n\t\t\tif ( ! wrapper ) {\n\t\t\t\treturn res;\n\t\t\t}\n\n\t\t\treturn wrapper( res );\n\t\t},\n\t};\n}\n\nasync function propsToCss( { props, resolve, signal }: PropsToCssArgs ) {\n\tconst transformed = await resolve( { props, signal } );\n\n\treturn Object.entries( transformed )\n\t\t.reduce< string[] >( ( acc, [ propName, propValue ] ) => {\n\t\t\tacc.push( propName + ':' + propValue + ';' );\n\n\t\t\treturn acc;\n\t\t}, [] )\n\t\t.join( '' );\n}\n\nfunction wrapCssWithStyleElement( id: string, css: string ) {\n\treturn `<style data-style-id=\"${ id }\">${ css }</style>`;\n}\n","import { type CanvasExtendedWindow, type EnqueueFont } from './types';\n\nexport const enqueueFont: EnqueueFont = ( fontFamily, context = 'preview' ) => {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.helpers?.enqueueFont?.( fontFamily, context ) ?? null;\n};\n","import type { CanvasExtendedWindow } from './types';\n\nexport function getCanvasIframeBody() {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.$preview?.[ 0 ]?.contentDocument?.body;\n}\n"],"mappings":"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","names":["React","import_react","import_react","useIsPreviewMode","useIsRouteActive","size","size","import_editor_v1_adapters","size","listenTo"]}
+{"version":3,"sources":["../src/index.ts","../src/init.tsx","../src/components/elements-overlays.tsx","../src/components/element-overlay.tsx","../src/hooks/use-bind-react-props-to-element.ts","../src/hooks/use-floating-on-element.ts","../src/transformers/create-transformers-registry.ts","../src/style-transformers-registry.ts","../src/transformers/create-transformer.ts","../src/transformers/styles/background-color-overlay-transformer.ts","../src/transformers/styles/background-gradient-overlay-transformer.ts","../src/transformers/styles/background-image-overlay-transformer.ts","../src/transformers/styles/background-image-position-offset-transformer.ts","../src/transformers/styles/background-image-size-scale-transformer.ts","../src/transformers/styles/background-transformer.ts","../src/transformers/styles/color-stop-transformer.ts","../src/transformers/styles/create-combine-array-transformer.ts","../src/renderers/multi-props.ts","../src/transformers/styles/create-multi-props-transformer.ts","../src/transformers/styles/image-attachment-transformer.ts","../src/transformers/styles/image-src-transformer.ts","../src/transformers/styles/image-transformer.ts","../src/transformers/styles/primitive-transformer.ts","../src/transformers/styles/shadow-transformer.ts","../src/transformers/styles/size-transformer.ts","../src/transformers/styles/stroke-transformer.ts","../src/init-style-transformers.ts","../src/init-styles-renderer.ts","../src/renderers/create-props-resolver.ts","../src/renderers/errors.ts","../src/renderers/render-styles.ts","../src/sync/enqueue-font.ts","../src/sync/get-canvas-iframe-body.ts"],"sourcesContent":["import { init } from './init';\n\nexport { styleTransformersRegistry } from './style-transformers-registry';\n\ninit();\n","import { injectIntoTop } from '@elementor/editor';\n\nimport { ElementsOverlays } from './components/elements-overlays';\nimport { initStyleTransformers } from './init-style-transformers';\nimport { initStylesRenderer } from './init-styles-renderer';\n\nexport function init() {\n\tinitStyleTransformers();\n\tinitStylesRenderer();\n\n\tinjectIntoTop( {\n\t\tid: 'elements-overlays',\n\t\tcomponent: ElementsOverlays,\n\t} );\n}\n","import * as React from 'react';\nimport { useElementsDomRef, useSelectedElement } from '@elementor/editor-elements';\nimport { __privateUseIsRouteActive as useIsRouteActive, useEditMode } from '@elementor/editor-v1-adapters';\n\nimport { ElementOverlay } from './element-overlay';\n\nexport function ElementsOverlays() {\n\tconst selected = useSelectedElement();\n\tconst domElements = useElementsDomRef();\n\tconst currentEditMode = useEditMode();\n\n\tconst isEditMode = currentEditMode === 'edit';\n\tconst isKitRouteActive = useIsRouteActive( 'panel/global' );\n\n\tconst isActive = isEditMode && ! isKitRouteActive;\n\n\treturn (\n\t\tisActive &&\n\t\tdomElements.map( ( el ) => (\n\t\t\t<ElementOverlay\n\t\t\t\telement={ el }\n\t\t\t\tkey={ el.dataset.id }\n\t\t\t\tisSelected={ selected.element?.id === el.dataset.id }\n\t\t\t/>\n\t\t) )\n\t);\n}\n","import * as React from 'react';\nimport { Box, styled } from '@elementor/ui';\nimport { FloatingPortal, useHover, useInteractions } from '@floating-ui/react';\n\nimport { useBindReactPropsToElement } from '../hooks/use-bind-react-props-to-element';\nimport { useFloatingOnElement } from '../hooks/use-floating-on-element';\n\nexport const CANVAS_WRAPPER_ID = 'elementor-preview-responsive-wrapper';\n\ntype Props = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nconst OverlayBox = styled( Box, { shouldForwardProp: ( prop ) => prop !== 'isSelected' } )<\n\tPick< Props, 'isSelected' >\n>( ( { theme, isSelected } ) => ( {\n\toutline: `${ isSelected ? '2px' : '1px' } solid ${ theme.palette.primary.light }`,\n\toutlineOffset: isSelected ? '-2px' : '-1px',\n\tpointerEvents: 'none',\n} ) );\n\nexport function ElementOverlay( { element, isSelected }: Props ) {\n\tconst { context, floating, isVisible } = useFloatingOnElement( { element, isSelected } );\n\tconst { getFloatingProps, getReferenceProps } = useInteractions( [ useHover( context ) ] );\n\n\tuseBindReactPropsToElement( element, getReferenceProps );\n\n\treturn (\n\t\tisVisible && (\n\t\t\t<FloatingPortal id={ CANVAS_WRAPPER_ID }>\n\t\t\t\t<OverlayBox\n\t\t\t\t\tref={ floating.setRef }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tstyle={ floating.styles }\n\t\t\t\t\tdata-element-overlay={ element.dataset.id }\n\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t{ ...getFloatingProps() }\n\t\t\t\t/>\n\t\t\t</FloatingPortal>\n\t\t)\n\t);\n}\n","import { useEffect } from 'react';\n\ntype Props = Record< string, unknown >;\n\nexport function useBindReactPropsToElement( element: HTMLElement, getProps: () => Props ) {\n\tuseEffect( () => {\n\t\tconst el = element;\n\n\t\tconst { events, attrs } = groupProps( getProps() );\n\n\t\tevents.forEach( ( [ eventName, listener ] ) => el.addEventListener( eventName, listener ) );\n\t\tattrs.forEach( ( [ attrName, attrValue ] ) => el.setAttribute( attrName, attrValue ) );\n\n\t\treturn () => {\n\t\t\tevents.forEach( ( [ eventName, listener ] ) => el.removeEventListener( eventName, listener ) );\n\t\t\tattrs.forEach( ( [ attrName ] ) => el.removeAttribute( attrName ) );\n\t\t};\n\t}, [ getProps, element ] );\n}\n\ntype GroupedProps = {\n\tevents: Array< [ string, () => void ] >;\n\tattrs: Array< [ string, string ] >;\n};\n\nfunction groupProps( props: Props ) {\n\tconst eventRegex = /^on(?=[A-Z])/;\n\n\treturn Object.entries( props ).reduce< GroupedProps >(\n\t\t( acc, [ propName, propValue ] ) => {\n\t\t\tif ( ! eventRegex.test( propName ) ) {\n\t\t\t\tacc.attrs.push( [ propName, propValue as string ] );\n\n\t\t\t\treturn acc;\n\t\t\t}\n\n\t\t\tconst eventName = propName.replace( eventRegex, '' ).toLowerCase();\n\t\t\tconst listener = propValue as () => void;\n\n\t\t\tacc.events.push( [ eventName, listener ] );\n\n\t\t\treturn acc;\n\t\t},\n\t\t{\n\t\t\tevents: [],\n\t\t\tattrs: [],\n\t\t}\n\t);\n}\n","import { useState } from 'react';\nimport { autoUpdate, offset, size, useFloating } from '@floating-ui/react';\n\ntype Options = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nexport function useFloatingOnElement( { element, isSelected }: Options ) {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst { refs, floatingStyles, context } = useFloating( {\n\t\t// Must be controlled for interactions (like hover) to work.\n\t\topen: isOpen || isSelected,\n\t\tonOpenChange: setIsOpen,\n\n\t\t// Add an animation frame to support scroll events (without it the floating element will stay in the same position).\n\t\twhileElementsMounted: ( ...args ) => autoUpdate( ...args, { animationFrame: true } ),\n\n\t\t// The first element in the canvas is `display: contents` so we need to use the first child.\n\t\telements: { reference: element.firstElementChild },\n\n\t\tmiddleware: [\n\t\t\t// Match the floating element's size to the reference element.\n\t\t\tsize( {\n\t\t\t\tapply( { elements, rects } ) {\n\t\t\t\t\tObject.assign( elements.floating.style, {\n\t\t\t\t\t\twidth: `${ rects.reference.width }px`,\n\t\t\t\t\t\theight: `${ rects.reference.height }px`,\n\t\t\t\t\t} );\n\t\t\t\t},\n\t\t\t} ),\n\n\t\t\t// Center the floating element on the reference element.\n\t\t\toffset( ( { rects } ) => -rects.reference.height / 2 - rects.floating.height / 2 ),\n\t\t],\n\t} );\n\n\treturn {\n\t\tisVisible: isOpen || isSelected,\n\t\tcontext,\n\t\tfloating: {\n\t\t\tsetRef: refs.setFloating,\n\t\t\tref: refs.floating,\n\t\t\tstyles: floatingStyles,\n\t\t},\n\t};\n}\n","import { type AnyTransformer, type TransformerName, type TransformersMap } from './types';\n\nexport function createTransformersRegistry() {\n\tconst transformers: TransformersMap = {};\n\n\treturn {\n\t\tregister( name: TransformerName, transformer: AnyTransformer ) {\n\t\t\ttransformers[ name ] = transformer;\n\n\t\t\treturn this;\n\t\t},\n\t\tall() {\n\t\t\treturn transformers;\n\t\t},\n\t};\n}\n","import { createTransformersRegistry } from './transformers/create-transformers-registry';\n\nexport const styleTransformersRegistry = createTransformersRegistry();\n","import { type AnyTransformable } from '@elementor/editor-props';\n\nimport { type Transformer, type UnbrandedTransformer } from './types';\n\n// Wrap transformer for better DX (types).\n// Inspired by: https://tkdodo.eu/blog/the-query-options-api\nexport function createTransformer< TValue = never >(\n\tcb: TValue extends AnyTransformable\n\t\t? 'Transformable values are invalid, use the actual value instead.'\n\t\t: UnbrandedTransformer< TValue >\n): Transformer< NoInfer< TValue > > {\n\treturn cb as never;\n}\n","import { createTransformer } from '../create-transformer';\n\nexport const backgroundColorOverlayTransformer = createTransformer(\n\t( value: string ) => `linear-gradient(${ value }, ${ value })`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundGradientOverlay = {\n\ttype?: 'linear' | 'radial';\n\tangle?: string;\n\tstops?: string;\n\tpositions?: string;\n};\n\nexport const backgroundGradientOverlayTransformer = createTransformer( ( value: BackgroundGradientOverlay ) => {\n\tif ( value.type === 'radial' ) {\n\t\treturn `radial-gradient(circle at ${ value.positions }, ${ value.stops })`;\n\t}\n\n\treturn `linear-gradient(${ value.angle }deg, ${ value.stops })`;\n} );\n","import { createTransformer } from '../create-transformer';\n\nconst DEFAULT_POSITION_VALUE = '0% 0%';\n\ntype BackgroundImageOverlay = {\n\timage?: string;\n\tsize?: string;\n\tposition?: string;\n\trepeat?: string;\n\tattachment?: string;\n};\n\nexport const backgroundImageOverlayTransformer = createTransformer( ( value: BackgroundImageOverlay ) => {\n\tconst { image, size = null, position = null, repeat = null, attachment = null } = value;\n\n\tif ( ! image ) {\n\t\treturn null;\n\t}\n\n\tconst backgroundStyles = [\n\t\timage,\n\t\trepeat,\n\t\tattachment,\n\t\tsize ? `${ position || DEFAULT_POSITION_VALUE } / ${ size }` : position,\n\t].filter( Boolean );\n\n\treturn backgroundStyles.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImagePositionOffset = {\n\tx?: string;\n\ty?: string;\n};\n\nexport const backgroundImagePositionOffsetTransformer = createTransformer(\n\t( { x = '0px', y = '0px' }: BackgroundImagePositionOffset ) => `${ x } ${ y }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImageSizeScale = {\n\twidth?: string;\n\theight?: string;\n};\n\nexport const backgroundImageSizeScaleTransformer = createTransformer(\n\t( { width = 'auto', height = 'auto' }: BackgroundImageSizeScale ) => `${ width } ${ height }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype Background = {\n\t'background-overlay'?: string;\n\tcolor?: string;\n};\n\nexport const backgroundTransformer = createTransformer( ( value: Background ) => {\n\tconst overlays = value[ 'background-overlay' ] ?? '';\n\tconst color = value.color ?? '';\n\n\treturn `${ overlays } ${ color }`.trim();\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype ColorStop = {\n\tcolor?: string;\n\toffset?: number;\n};\n\nexport const colorStopTransformer = createTransformer(\n\t( value: ColorStop ) => `${ value?.color } ${ value?.offset ?? 0 }%`\n);\n","import { createTransformer } from '../create-transformer';\n\nexport const createCombineArrayTransformer = ( delimiter: string ) => {\n\treturn createTransformer( ( value: Array< string | number > ) => value.filter( Boolean ).join( delimiter ) );\n};\n","import { type Props, type PropValue } from '@elementor/editor-props';\n\ntype MultiProps = {\n\t'$$multi-props': true;\n\tvalue: Props;\n};\n\nexport const isMultiProps = ( propValue: PropValue ): propValue is MultiProps => {\n\treturn (\n\t\t!! propValue &&\n\t\ttypeof propValue === 'object' &&\n\t\t'$$multi-props' in propValue &&\n\t\tpropValue[ '$$multi-props' ] === true\n\t);\n};\n\nexport const createMultiPropsValue = ( props: Props ): MultiProps => {\n\treturn {\n\t\t'$$multi-props': true,\n\t\tvalue: props,\n\t};\n};\n\nexport const getMultiPropsValue = ( multiProps: MultiProps ): Props => {\n\treturn multiProps.value;\n};\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype KeyGenerator = ( { propKey, key }: { propKey: string; key: string } ) => string;\n\nexport const createMultiPropsTransformer = ( keys: string[], keyGenerator: KeyGenerator ) => {\n\treturn createTransformer< Record< string, string > >( ( value, { key: propKey } ) => {\n\t\tconst entries = keys\n\t\t\t.filter( ( key ) => value[ key ] )\n\t\t\t.map( ( key ) => [ keyGenerator( { propKey, key } ), value[ key ] ] );\n\n\t\treturn createMultiPropsValue( Object.fromEntries( entries ) );\n\t} );\n};\n","import { getMediaAttachment } from '@elementor/wp-media';\n\nimport { createTransformer } from '../create-transformer';\n\ntype ImageAttachmentId = number;\n\nexport const imageAttachmentTransformer = createTransformer( async ( value: ImageAttachmentId ) => {\n\tconst attachment = await getMediaAttachment( { id: value } );\n\n\tif ( ! attachment ) {\n\t\treturn null;\n\t}\n\n\treturn attachment;\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype ImageSrc = {\n\tid?: unknown;\n\turl?: unknown;\n};\n\nexport const imageSrcTransformer = createTransformer( ( value: ImageSrc ) => ( {\n\tattachment: value.id,\n\turl: value.url,\n} ) );\n","import { createTransformer } from '../create-transformer';\n\ntype Image = {\n\tsrc?: {\n\t\turl?: string;\n\t\tattachment?: {\n\t\t\turl?: string;\n\t\t\tsizes?: Record< string, { url: string } >;\n\t\t};\n\t};\n\tsize?: string;\n};\n\nexport const imageTransformer = createTransformer( ( value: Image ) => {\n\tconst { src, size } = value;\n\n\tif ( src?.url ) {\n\t\treturn `url(${ src.url })`;\n\t}\n\n\tconst sizeUrl = src?.attachment?.sizes?.[ size ?? '' ]?.url;\n\n\tif ( sizeUrl ) {\n\t\treturn `url(${ sizeUrl })`;\n\t}\n\n\tconst attachmentUrl = src?.attachment?.url;\n\n\tif ( attachmentUrl ) {\n\t\treturn `url(${ attachmentUrl })`;\n\t}\n\n\treturn null;\n} );\n","import { createTransformer } from '../create-transformer';\n\nexport const primitiveTransformer = createTransformer( ( value: unknown ) => value );\n","import { createTransformer } from '../create-transformer';\n\ntype Shadow = {\n\thOffset?: string;\n\tvOffset?: string;\n\tblur?: string;\n\tspread?: string;\n\tcolor?: string;\n\tposition?: string;\n};\n\nexport const shadowTransformer = createTransformer( ( value: Shadow ) => {\n\treturn [ value.hOffset, value.vOffset, value.blur, value.spread, value.color, value.position ]\n\t\t.filter( Boolean )\n\t\t.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype Size = {\n\tsize?: number;\n\tunit?: string;\n};\n\nexport const sizeTransformer = createTransformer( ( value: Size ) => {\n\treturn `${ value.size }${ value.unit }`;\n} );\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype Stroke = {\n\twidth?: string;\n\tcolor?: string;\n};\n\nexport const strokeTransformer = createTransformer( ( value: Stroke ) => {\n\tconst parsed = {\n\t\t'-webkit-text-stroke': `${ value.width } ${ value.color }`,\n\t\tstroke: `${ value.color }`,\n\t\t'stroke-width': `${ value.width }`,\n\t};\n\n\treturn createMultiPropsValue( parsed );\n} );\n","import { styleTransformersRegistry } from './style-transformers-registry';\nimport { backgroundColorOverlayTransformer } from './transformers/styles/background-color-overlay-transformer';\nimport { backgroundGradientOverlayTransformer } from './transformers/styles/background-gradient-overlay-transformer';\nimport { backgroundImageOverlayTransformer } from './transformers/styles/background-image-overlay-transformer';\nimport { backgroundImagePositionOffsetTransformer } from './transformers/styles/background-image-position-offset-transformer';\nimport { backgroundImageSizeScaleTransformer } from './transformers/styles/background-image-size-scale-transformer';\nimport { backgroundTransformer } from './transformers/styles/background-transformer';\nimport { colorStopTransformer } from './transformers/styles/color-stop-transformer';\nimport { createCombineArrayTransformer } from './transformers/styles/create-combine-array-transformer';\nimport { createMultiPropsTransformer } from './transformers/styles/create-multi-props-transformer';\nimport { imageAttachmentTransformer } from './transformers/styles/image-attachment-transformer';\nimport { imageSrcTransformer } from './transformers/styles/image-src-transformer';\nimport { imageTransformer } from './transformers/styles/image-transformer';\nimport { primitiveTransformer } from './transformers/styles/primitive-transformer';\nimport { shadowTransformer } from './transformers/styles/shadow-transformer';\nimport { sizeTransformer } from './transformers/styles/size-transformer';\nimport { strokeTransformer } from './transformers/styles/stroke-transformer';\n\nexport function initStyleTransformers() {\n\tstyleTransformersRegistry\n\t\t.register( 'size', sizeTransformer )\n\t\t.register( 'shadow', shadowTransformer )\n\t\t.register( 'stroke', strokeTransformer )\n\t\t.register(\n\t\t\t'dimensions',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'block-start', 'block-end', 'inline-start', 'inline-end' ],\n\t\t\t\t( { propKey, key } ) => `${ propKey }-${ key }`\n\t\t\t)\n\t\t)\n\t\t.register( 'color', primitiveTransformer )\n\t\t.register( 'number', primitiveTransformer )\n\t\t.register( 'string', primitiveTransformer )\n\t\t.register( 'url', primitiveTransformer )\n\t\t.register( 'box-shadow', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background', backgroundTransformer )\n\t\t.register( 'background-overlay', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background-color-overlay', backgroundColorOverlayTransformer )\n\t\t.register( 'background-image-overlay', backgroundImageOverlayTransformer )\n\t\t.register( 'background-gradient-overlay', backgroundGradientOverlayTransformer )\n\t\t.register( 'gradient-color-stop', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'color-stop', colorStopTransformer )\n\t\t.register( 'background-image-position-offset', backgroundImagePositionOffsetTransformer )\n\t\t.register( 'background-image-size-scale', backgroundImageSizeScaleTransformer )\n\t\t.register( 'image-attachment-id', imageAttachmentTransformer )\n\t\t.register( 'image-src', imageSrcTransformer )\n\t\t.register( 'image', imageTransformer )\n\t\t.register(\n\t\t\t'layout-direction',\n\t\t\tcreateMultiPropsTransformer( [ 'row', 'column' ], ( { propKey, key } ) => `${ key }-${ propKey }` )\n\t\t)\n\t\t.register(\n\t\t\t'border-width',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'block-start', 'block-end', 'inline-start', 'inline-end' ],\n\t\t\t\t( { key } ) => `border-${ key }-width`\n\t\t\t)\n\t\t)\n\t\t.register(\n\t\t\t'border-radius',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'start-start', 'start-end', 'end-start', 'end-end' ],\n\t\t\t\t( { key } ) => `border-${ key }-radius`\n\t\t\t)\n\t\t);\n}\n","import { getBreakpointsMap } from '@elementor/editor-responsive';\nimport { getStylesSchema } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nimport { createPropsResolver } from './renderers/create-props-resolver';\nimport renderStyles from './renderers/render-styles';\nimport { styleTransformersRegistry } from './style-transformers-registry';\nimport { enqueueFont } from './sync/enqueue-font';\nimport { getCanvasIframeBody } from './sync/get-canvas-iframe-body';\n\nconst WRAPPER_DATA_ATTR = 'data-styles-container';\nconst SELECTOR_PREFIX = '.elementor';\n\nexport function initStylesRenderer() {\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tlet abortController: AbortController | null = null;\n\n\t\tconst resolve = createPropsResolver( {\n\t\t\ttransformers: styleTransformersRegistry.all(),\n\t\t\tschema: getStylesSchema(),\n\t\t\tonPropResolve: enqueueUsedFonts,\n\t\t} );\n\n\t\tstylesRepository.subscribe( async () => {\n\t\t\tconst styleContainer = getStylesContainer();\n\n\t\t\t// Styles should be printed in a reversed order, so the high priority styles will be printed last.\n\t\t\tconst styles = stylesRepository.all().reverse();\n\t\t\tconst breakpoints = getBreakpointsMap();\n\n\t\t\tif ( abortController ) {\n\t\t\t\tabortController.abort();\n\t\t\t}\n\n\t\t\tabortController = new AbortController();\n\n\t\t\tstyleContainer.innerHTML = await renderStyles( {\n\t\t\t\tstyles,\n\t\t\t\tresolve,\n\t\t\t\tbreakpoints,\n\t\t\t\tselectorPrefix: SELECTOR_PREFIX,\n\t\t\t\tsignal: abortController.signal,\n\t\t\t} );\n\t\t} );\n\t} );\n}\n\nfunction getStylesContainer() {\n\tconst preview = getCanvasIframeBody();\n\tconst stylesContainer = preview?.querySelector( `[${ WRAPPER_DATA_ATTR }]` );\n\n\tif ( stylesContainer ) {\n\t\treturn stylesContainer;\n\t}\n\n\tconst el = createStylesContainer();\n\n\tpreview?.prepend( el );\n\n\treturn el;\n}\n\nfunction createStylesContainer() {\n\tconst el = document.createElement( 'div' );\n\tel.style.display = 'none';\n\tel.setAttribute( WRAPPER_DATA_ATTR, '' );\n\n\treturn el;\n}\n\nfunction enqueueUsedFonts( { key, value }: { key: string; value: unknown } ) {\n\tif ( key !== 'font-family' || typeof value !== 'string' ) {\n\t\treturn;\n\t}\n\n\tenqueueFont( value );\n}\n","import {\n\tisTransformable,\n\ttype PropKey,\n\ttype Props,\n\ttype PropsSchema,\n\ttype PropType,\n\ttype PropValue,\n} from '@elementor/editor-props';\n\nimport { type TransformersMap } from '../transformers/types';\nimport { getMultiPropsValue, isMultiProps } from './multi-props';\n\ntype CreatePropResolverArgs = {\n\ttransformers: TransformersMap;\n\tschema: PropsSchema;\n\tonPropResolve?: ( args: { key: string; value: unknown } ) => void;\n};\n\ntype ResolveArgs = {\n\tprops: Props;\n\tschema?: PropsSchema;\n\tsignal?: AbortSignal;\n};\n\ntype TransformArgs = {\n\tvalue: unknown;\n\tkey: PropKey;\n\ttype: PropType;\n\tsignal?: AbortSignal;\n\tdepth?: number;\n};\n\nexport type PropsResolver = ReturnType< typeof createPropsResolver >;\n\nconst TRANSFORM_DEPTH_LIMIT = 3;\n\nexport function createPropsResolver( { transformers, schema: initialSchema, onPropResolve }: CreatePropResolverArgs ) {\n\tasync function resolve( { props, schema, signal }: ResolveArgs ) {\n\t\tschema = schema ?? initialSchema;\n\n\t\tconst promises = Promise.all(\n\t\t\tObject.entries( schema ).map( async ( [ key, type ] ) => {\n\t\t\t\tconst value = props[ key ] ?? type.default;\n\n\t\t\t\tconst transformed = await transform( { value, key, type, signal } );\n\n\t\t\t\tif ( transformed === null ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonPropResolve?.( { key, value: transformed } );\n\n\t\t\t\tif ( isMultiProps( transformed ) ) {\n\t\t\t\t\treturn getMultiPropsValue( transformed );\n\t\t\t\t}\n\n\t\t\t\treturn { [ key ]: transformed };\n\t\t\t} )\n\t\t);\n\n\t\treturn Object.assign( {}, ...( await promises ).filter( Boolean ) );\n\t}\n\n\tasync function transform( { value, key, type, signal, depth = 0 }: TransformArgs ) {\n\t\tif ( value === null || value === undefined ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( ! isTransformable( value ) ) {\n\t\t\treturn value;\n\t\t}\n\n\t\tif ( depth > TRANSFORM_DEPTH_LIMIT ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( value.disabled === true ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( type.kind === 'union' ) {\n\t\t\ttype = type.prop_types[ value.$$type ];\n\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t}\n\n\t\t// Warning: This variable is loosely-typed - use with caution.\n\t\tlet resolvedValue = value.value;\n\n\t\tif ( type.kind === 'object' ) {\n\t\t\tresolvedValue = await resolve( {\n\t\t\t\tprops: resolvedValue,\n\t\t\t\tschema: type.shape,\n\t\t\t\tsignal,\n\t\t\t} );\n\t\t}\n\n\t\tif ( type.kind === 'array' ) {\n\t\t\tresolvedValue = await Promise.all(\n\t\t\t\tresolvedValue.map( ( item: PropValue ) =>\n\t\t\t\t\ttransform( { value: item, key, type: type.item_prop_type, depth, signal } )\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tconst transformer = transformers[ value.$$type ];\n\n\t\tif ( ! transformer ) {\n\t\t\treturn null;\n\t\t}\n\n\t\ttry {\n\t\t\tconst transformed = await transformer( resolvedValue, { key, signal } );\n\n\t\t\treturn transform( { value: transformed, key, type, signal, depth: depth + 1 } );\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\treturn resolve;\n}\n","import { createError } from '@elementor/utils';\n\nexport const UnknownStyleTypeError = createError< { type: string } >( {\n\tcode: 'unknown_style_type',\n\tmessage: 'Unknown style type',\n} );\n","import { type Props } from '@elementor/editor-props';\nimport { type Breakpoint, type BreakpointsMap } from '@elementor/editor-responsive';\nimport { type StyleDefinition, type StyleDefinitionState, type StyleDefinitionType } from '@elementor/editor-styles';\n\nimport { type PropsResolver } from './create-props-resolver';\nimport { UnknownStyleTypeError } from './errors';\n\ntype RenderParams = {\n\tresolve: PropsResolver;\n\tstyles: StyleDefinition[];\n\tbreakpoints: BreakpointsMap;\n\tselectorPrefix?: string;\n\tsignal?: AbortSignal;\n};\n\ntype PropsToCssArgs = {\n\tprops: Props;\n\tresolve: PropsResolver;\n\tsignal?: AbortSignal;\n};\n\nconst SELECTORS_MAP: Record< StyleDefinitionType, string > = {\n\tclass: '.',\n};\n\nexport default async function renderStyles( {\n\tresolve,\n\tstyles,\n\tbreakpoints,\n\tselectorPrefix = '',\n\tsignal,\n}: RenderParams ) {\n\tconst stylesCssPromises = styles.map( async ( style ) => {\n\t\tconst variantCssPromises = Object.values( style.variants ).map( async ( variant ) => {\n\t\t\tconst css = await propsToCss( { props: variant.props, resolve, signal } );\n\n\t\t\treturn createStyleWrapper()\n\t\t\t\t.forStyle( style )\n\t\t\t\t.withPrefix( selectorPrefix )\n\t\t\t\t.withState( variant.meta.state )\n\t\t\t\t.withMediaQuery( variant.meta.breakpoint ? breakpoints[ variant.meta.breakpoint ] : null )\n\t\t\t\t.wrap( css );\n\t\t} );\n\n\t\tconst variantsCss = await Promise.all( variantCssPromises );\n\n\t\treturn wrapCssWithStyleElement( style.id, variantsCss.join( '' ) );\n\t} );\n\n\tconst stylesCss = await Promise.all( stylesCssPromises );\n\n\treturn stylesCss.join( '' );\n}\n\nfunction createStyleWrapper( value: string = '', wrapper?: ( css: string ) => string ) {\n\treturn {\n\t\tforStyle: ( { id, type }: StyleDefinition ) => {\n\t\t\tconst symbol = SELECTORS_MAP[ type ];\n\n\t\t\tif ( ! symbol ) {\n\t\t\t\tthrow new UnknownStyleTypeError( { context: { type } } );\n\t\t\t}\n\n\t\t\treturn createStyleWrapper( `${ value }${ symbol }${ id }`, wrapper );\n\t\t},\n\n\t\twithPrefix: ( prefix: string ) =>\n\t\t\tcreateStyleWrapper( [ prefix, value ].filter( Boolean ).join( ' ' ), wrapper ),\n\n\t\twithState: ( state: StyleDefinitionState ) =>\n\t\t\tcreateStyleWrapper( state ? `${ value }:${ state }` : value, wrapper ),\n\n\t\twithMediaQuery: ( breakpoint: Breakpoint | null ) => {\n\t\t\tif ( ! breakpoint?.type ) {\n\t\t\t\treturn createStyleWrapper( value, wrapper );\n\t\t\t}\n\n\t\t\tconst size = `${ breakpoint.type }:${ breakpoint.width }px`;\n\n\t\t\treturn createStyleWrapper( value, ( css ) => `@media(${ size }){${ css }}` );\n\t\t},\n\n\t\twrap: ( css: string ) => {\n\t\t\tconst res = `${ value }{${ css }}`;\n\n\t\t\tif ( ! wrapper ) {\n\t\t\t\treturn res;\n\t\t\t}\n\n\t\t\treturn wrapper( res );\n\t\t},\n\t};\n}\n\nasync function propsToCss( { props, resolve, signal }: PropsToCssArgs ) {\n\tconst transformed = await resolve( { props, signal } );\n\n\treturn Object.entries( transformed )\n\t\t.reduce< string[] >( ( acc, [ propName, propValue ] ) => {\n\t\t\tacc.push( propName + ':' + propValue + ';' );\n\n\t\t\treturn acc;\n\t\t}, [] )\n\t\t.join( '' );\n}\n\nfunction wrapCssWithStyleElement( id: string, css: string ) {\n\treturn `<style data-style-id=\"${ id }\">${ css }</style>`;\n}\n","import { type CanvasExtendedWindow, type EnqueueFont } from './types';\n\nexport const enqueueFont: EnqueueFont = ( fontFamily, context = 'preview' ) => {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.helpers?.enqueueFont?.( fontFamily, context ) ?? null;\n};\n","import type { CanvasExtendedWindow } from './types';\n\nexport function getCanvasIframeBody() {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.$preview?.[ 0 ]?.contentDocument?.body;\n}\n"],"mappings":"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","names":["React","import_react","import_react","useIsRouteActive","size","size","import_editor_v1_adapters","size","listenTo"]}

package/dist/index.mjs

@@ -4,10 +4,7 @@ import { injectIntoTop } from "@elementor/editor";
 // src/components/elements-overlays.tsx
 import * as React2 from "react";
 import { useElementsDomRef, useSelectedElement } from "@elementor/editor-elements";
-import {
-  __privateUseIsPreviewMode as useIsPreviewMode,
-  __privateUseIsRouteActive as useIsRouteActive
-} from "@elementor/editor-v1-adapters";
+import { __privateUseIsRouteActive as useIsRouteActive, useEditMode } from "@elementor/editor-v1-adapters";
 
 // src/components/element-overlay.tsx
 import * as React from "react";
@@ -114,9 +111,10 @@ function ElementOverlay({ element, isSelected }) {
 function ElementsOverlays() {
   const selected = useSelectedElement();
   const domElements = useElementsDomRef();
-  const isPreviewMode = useIsPreviewMode();
+  const currentEditMode = useEditMode();
+  const isEditMode = currentEditMode === "edit";
   const isKitRouteActive = useIsRouteActive("panel/global");
-  const isActive = !isPreviewMode && !isKitRouteActive;
+  const isActive = isEditMode && !isKitRouteActive;
   return isActive && domElements.map((el) => /* @__PURE__ */ React2.createElement(
     ElementOverlay,
     {
@@ -154,6 +152,14 @@ var backgroundColorOverlayTransformer = createTransformer(
   (value) => `linear-gradient(${value}, ${value})`
 );
 
+// src/transformers/styles/background-gradient-overlay-transformer.ts
+var backgroundGradientOverlayTransformer = createTransformer((value) => {
+  if (value.type === "radial") {
+    return `radial-gradient(circle at ${value.positions}, ${value.stops})`;
+  }
+  return `linear-gradient(${value.angle}deg, ${value.stops})`;
+});
+
 // src/transformers/styles/background-image-overlay-transformer.ts
 var DEFAULT_POSITION_VALUE = "0% 0%";
 var backgroundImageOverlayTransformer = createTransformer((value) => {
@@ -187,6 +193,11 @@ var backgroundTransformer = createTransformer((value) => {
   return `${overlays} ${color}`.trim();
 });
 
+// src/transformers/styles/color-stop-transformer.ts
+var colorStopTransformer = createTransformer(
+  (value) => `${value?.color} ${value?.offset ?? 0}%`
+);
+
 // src/transformers/styles/create-combine-array-transformer.ts
 var createCombineArrayTransformer = (delimiter) => {
   return createTransformer((value) => value.filter(Boolean).join(delimiter));
@@ -275,15 +286,18 @@ function initStyleTransformers() {
   styleTransformersRegistry.register("size", sizeTransformer).register("shadow", shadowTransformer).register("stroke", strokeTransformer).register(
     "dimensions",
     createMultiPropsTransformer(
-      ["top", "right", "bottom", "left"],
+      ["block-start", "block-end", "inline-start", "inline-end"],
       ({ propKey, key }) => `${propKey}-${key}`
     )
-  ).register("color", primitiveTransformer).register("number", primitiveTransformer).register("string", primitiveTransformer).register("url", primitiveTransformer).register("box-shadow", createCombineArrayTransformer(",")).register("background", backgroundTransformer).register("background-overlay", createCombineArrayTransformer(",")).register("background-color-overlay", backgroundColorOverlayTransformer).register("background-image-overlay", backgroundImageOverlayTransformer).register("background-image-position-offset", backgroundImagePositionOffsetTransformer).register("background-image-size-scale", backgroundImageSizeScaleTransformer).register("image-attachment-id", imageAttachmentTransformer).register("image-src", imageSrcTransformer).register("image", imageTransformer).register(
+  ).register("color", primitiveTransformer).register("number", primitiveTransformer).register("string", primitiveTransformer).register("url", primitiveTransformer).register("box-shadow", createCombineArrayTransformer(",")).register("background", backgroundTransformer).register("background-overlay", createCombineArrayTransformer(",")).register("background-color-overlay", backgroundColorOverlayTransformer).register("background-image-overlay", backgroundImageOverlayTransformer).register("background-gradient-overlay", backgroundGradientOverlayTransformer).register("gradient-color-stop", createCombineArrayTransformer(",")).register("color-stop", colorStopTransformer).register("background-image-position-offset", backgroundImagePositionOffsetTransformer).register("background-image-size-scale", backgroundImageSizeScaleTransformer).register("image-attachment-id", imageAttachmentTransformer).register("image-src", imageSrcTransformer).register("image", imageTransformer).register(
     "layout-direction",
     createMultiPropsTransformer(["row", "column"], ({ propKey, key }) => `${key}-${propKey}`)
   ).register(
     "border-width",
-    createMultiPropsTransformer(["top", "right", "bottom", "left"], ({ key }) => `border-${key}-width`)
+    createMultiPropsTransformer(
+      ["block-start", "block-end", "inline-start", "inline-end"],
+      ({ key }) => `border-${key}-width`
+    )
   ).register(
     "border-radius",
     createMultiPropsTransformer(

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/init.tsx","../src/components/elements-overlays.tsx","../src/components/element-overlay.tsx","../src/hooks/use-bind-react-props-to-element.ts","../src/hooks/use-floating-on-element.ts","../src/transformers/create-transformers-registry.ts","../src/style-transformers-registry.ts","../src/transformers/create-transformer.ts","../src/transformers/styles/background-color-overlay-transformer.ts","../src/transformers/styles/background-image-overlay-transformer.ts","../src/transformers/styles/background-image-position-offset-transformer.ts","../src/transformers/styles/background-image-size-scale-transformer.ts","../src/transformers/styles/background-transformer.ts","../src/transformers/styles/create-combine-array-transformer.ts","../src/renderers/multi-props.ts","../src/transformers/styles/create-multi-props-transformer.ts","../src/transformers/styles/image-attachment-transformer.ts","../src/transformers/styles/image-src-transformer.ts","../src/transformers/styles/image-transformer.ts","../src/transformers/styles/primitive-transformer.ts","../src/transformers/styles/shadow-transformer.ts","../src/transformers/styles/size-transformer.ts","../src/transformers/styles/stroke-transformer.ts","../src/init-style-transformers.ts","../src/init-styles-renderer.ts","../src/renderers/create-props-resolver.ts","../src/renderers/errors.ts","../src/renderers/render-styles.ts","../src/sync/enqueue-font.ts","../src/sync/get-canvas-iframe-body.ts","../src/index.ts"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\n\nimport { ElementsOverlays } from './components/elements-overlays';\nimport { initStyleTransformers } from './init-style-transformers';\nimport { initStylesRenderer } from './init-styles-renderer';\n\nexport function init() {\n\tinitStyleTransformers();\n\tinitStylesRenderer();\n\n\tinjectIntoTop( {\n\t\tid: 'elements-overlays',\n\t\tcomponent: ElementsOverlays,\n\t} );\n}\n","import * as React from 'react';\nimport { useElementsDomRef, useSelectedElement } from '@elementor/editor-elements';\nimport {\n\t__privateUseIsPreviewMode as useIsPreviewMode,\n\t__privateUseIsRouteActive as useIsRouteActive,\n} from '@elementor/editor-v1-adapters';\n\nimport { ElementOverlay } from './element-overlay';\n\nexport function ElementsOverlays() {\n\tconst selected = useSelectedElement();\n\tconst domElements = useElementsDomRef();\n\n\tconst isPreviewMode = useIsPreviewMode();\n\tconst isKitRouteActive = useIsRouteActive( 'panel/global' );\n\n\tconst isActive = ! isPreviewMode && ! isKitRouteActive;\n\n\treturn (\n\t\tisActive &&\n\t\tdomElements.map( ( el ) => (\n\t\t\t<ElementOverlay\n\t\t\t\telement={ el }\n\t\t\t\tkey={ el.dataset.id }\n\t\t\t\tisSelected={ selected.element?.id === el.dataset.id }\n\t\t\t/>\n\t\t) )\n\t);\n}\n","import * as React from 'react';\nimport { Box, styled } from '@elementor/ui';\nimport { FloatingPortal, useHover, useInteractions } from '@floating-ui/react';\n\nimport { useBindReactPropsToElement } from '../hooks/use-bind-react-props-to-element';\nimport { useFloatingOnElement } from '../hooks/use-floating-on-element';\n\nexport const CANVAS_WRAPPER_ID = 'elementor-preview-responsive-wrapper';\n\ntype Props = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nconst OverlayBox = styled( Box, { shouldForwardProp: ( prop ) => prop !== 'isSelected' } )<\n\tPick< Props, 'isSelected' >\n>( ( { theme, isSelected } ) => ( {\n\toutline: `${ isSelected ? '2px' : '1px' } solid ${ theme.palette.primary.light }`,\n\toutlineOffset: isSelected ? '-2px' : '-1px',\n\tpointerEvents: 'none',\n} ) );\n\nexport function ElementOverlay( { element, isSelected }: Props ) {\n\tconst { context, floating, isVisible } = useFloatingOnElement( { element, isSelected } );\n\tconst { getFloatingProps, getReferenceProps } = useInteractions( [ useHover( context ) ] );\n\n\tuseBindReactPropsToElement( element, getReferenceProps );\n\n\treturn (\n\t\tisVisible && (\n\t\t\t<FloatingPortal id={ CANVAS_WRAPPER_ID }>\n\t\t\t\t<OverlayBox\n\t\t\t\t\tref={ floating.setRef }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tstyle={ floating.styles }\n\t\t\t\t\tdata-element-overlay={ element.dataset.id }\n\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t{ ...getFloatingProps() }\n\t\t\t\t/>\n\t\t\t</FloatingPortal>\n\t\t)\n\t);\n}\n","import { useEffect } from 'react';\n\ntype Props = Record< string, unknown >;\n\nexport function useBindReactPropsToElement( element: HTMLElement, getProps: () => Props ) {\n\tuseEffect( () => {\n\t\tconst el = element;\n\n\t\tconst { events, attrs } = groupProps( getProps() );\n\n\t\tevents.forEach( ( [ eventName, listener ] ) => el.addEventListener( eventName, listener ) );\n\t\tattrs.forEach( ( [ attrName, attrValue ] ) => el.setAttribute( attrName, attrValue ) );\n\n\t\treturn () => {\n\t\t\tevents.forEach( ( [ eventName, listener ] ) => el.removeEventListener( eventName, listener ) );\n\t\t\tattrs.forEach( ( [ attrName ] ) => el.removeAttribute( attrName ) );\n\t\t};\n\t}, [ getProps, element ] );\n}\n\ntype GroupedProps = {\n\tevents: Array< [ string, () => void ] >;\n\tattrs: Array< [ string, string ] >;\n};\n\nfunction groupProps( props: Props ) {\n\tconst eventRegex = /^on(?=[A-Z])/;\n\n\treturn Object.entries( props ).reduce< GroupedProps >(\n\t\t( acc, [ propName, propValue ] ) => {\n\t\t\tif ( ! eventRegex.test( propName ) ) {\n\t\t\t\tacc.attrs.push( [ propName, propValue as string ] );\n\n\t\t\t\treturn acc;\n\t\t\t}\n\n\t\t\tconst eventName = propName.replace( eventRegex, '' ).toLowerCase();\n\t\t\tconst listener = propValue as () => void;\n\n\t\t\tacc.events.push( [ eventName, listener ] );\n\n\t\t\treturn acc;\n\t\t},\n\t\t{\n\t\t\tevents: [],\n\t\t\tattrs: [],\n\t\t}\n\t);\n}\n","import { useState } from 'react';\nimport { autoUpdate, offset, size, useFloating } from '@floating-ui/react';\n\ntype Options = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nexport function useFloatingOnElement( { element, isSelected }: Options ) {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst { refs, floatingStyles, context } = useFloating( {\n\t\t// Must be controlled for interactions (like hover) to work.\n\t\topen: isOpen || isSelected,\n\t\tonOpenChange: setIsOpen,\n\n\t\t// Add an animation frame to support scroll events (without it the floating element will stay in the same position).\n\t\twhileElementsMounted: ( ...args ) => autoUpdate( ...args, { animationFrame: true } ),\n\n\t\t// The first element in the canvas is `display: contents` so we need to use the first child.\n\t\telements: { reference: element.firstElementChild },\n\n\t\tmiddleware: [\n\t\t\t// Match the floating element's size to the reference element.\n\t\t\tsize( {\n\t\t\t\tapply( { elements, rects } ) {\n\t\t\t\t\tObject.assign( elements.floating.style, {\n\t\t\t\t\t\twidth: `${ rects.reference.width }px`,\n\t\t\t\t\t\theight: `${ rects.reference.height }px`,\n\t\t\t\t\t} );\n\t\t\t\t},\n\t\t\t} ),\n\n\t\t\t// Center the floating element on the reference element.\n\t\t\toffset( ( { rects } ) => -rects.reference.height / 2 - rects.floating.height / 2 ),\n\t\t],\n\t} );\n\n\treturn {\n\t\tisVisible: isOpen || isSelected,\n\t\tcontext,\n\t\tfloating: {\n\t\t\tsetRef: refs.setFloating,\n\t\t\tref: refs.floating,\n\t\t\tstyles: floatingStyles,\n\t\t},\n\t};\n}\n","import { type AnyTransformer, type TransformerName, type TransformersMap } from './types';\n\nexport function createTransformersRegistry() {\n\tconst transformers: TransformersMap = {};\n\n\treturn {\n\t\tregister( name: TransformerName, transformer: AnyTransformer ) {\n\t\t\ttransformers[ name ] = transformer;\n\n\t\t\treturn this;\n\t\t},\n\t\tall() {\n\t\t\treturn transformers;\n\t\t},\n\t};\n}\n","import { createTransformersRegistry } from './transformers/create-transformers-registry';\n\nexport const styleTransformersRegistry = createTransformersRegistry();\n","import { type AnyTransformable } from '@elementor/editor-props';\n\nimport { type Transformer, type UnbrandedTransformer } from './types';\n\n// Wrap transformer for better DX (types).\n// Inspired by: https://tkdodo.eu/blog/the-query-options-api\nexport function createTransformer< TValue = never >(\n\tcb: TValue extends AnyTransformable\n\t\t? 'Transformable values are invalid, use the actual value instead.'\n\t\t: UnbrandedTransformer< TValue >\n): Transformer< NoInfer< TValue > > {\n\treturn cb as never;\n}\n","import { createTransformer } from '../create-transformer';\n\nexport const backgroundColorOverlayTransformer = createTransformer(\n\t( value: string ) => `linear-gradient(${ value }, ${ value })`\n);\n","import { createTransformer } from '../create-transformer';\n\nconst DEFAULT_POSITION_VALUE = '0% 0%';\n\ntype BackgroundImageOverlay = {\n\timage?: string;\n\tsize?: string;\n\tposition?: string;\n\trepeat?: string;\n\tattachment?: string;\n};\n\nexport const backgroundImageOverlayTransformer = createTransformer( ( value: BackgroundImageOverlay ) => {\n\tconst { image, size = null, position = null, repeat = null, attachment = null } = value;\n\n\tif ( ! image ) {\n\t\treturn null;\n\t}\n\n\tconst backgroundStyles = [\n\t\timage,\n\t\trepeat,\n\t\tattachment,\n\t\tsize ? `${ position || DEFAULT_POSITION_VALUE } / ${ size }` : position,\n\t].filter( Boolean );\n\n\treturn backgroundStyles.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImagePositionOffset = {\n\tx?: string;\n\ty?: string;\n};\n\nexport const backgroundImagePositionOffsetTransformer = createTransformer(\n\t( { x = '0px', y = '0px' }: BackgroundImagePositionOffset ) => `${ x } ${ y }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImageSizeScale = {\n\twidth?: string;\n\theight?: string;\n};\n\nexport const backgroundImageSizeScaleTransformer = createTransformer(\n\t( { width = 'auto', height = 'auto' }: BackgroundImageSizeScale ) => `${ width } ${ height }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype Background = {\n\t'background-overlay'?: string;\n\tcolor?: string;\n};\n\nexport const backgroundTransformer = createTransformer( ( value: Background ) => {\n\tconst overlays = value[ 'background-overlay' ] ?? '';\n\tconst color = value.color ?? '';\n\n\treturn `${ overlays } ${ color }`.trim();\n} );\n","import { createTransformer } from '../create-transformer';\n\nexport const createCombineArrayTransformer = ( delimiter: string ) => {\n\treturn createTransformer( ( value: Array< string | number > ) => value.filter( Boolean ).join( delimiter ) );\n};\n","import { type Props, type PropValue } from '@elementor/editor-props';\n\ntype MultiProps = {\n\t'$$multi-props': true;\n\tvalue: Props;\n};\n\nexport const isMultiProps = ( propValue: PropValue ): propValue is MultiProps => {\n\treturn (\n\t\t!! propValue &&\n\t\ttypeof propValue === 'object' &&\n\t\t'$$multi-props' in propValue &&\n\t\tpropValue[ '$$multi-props' ] === true\n\t);\n};\n\nexport const createMultiPropsValue = ( props: Props ): MultiProps => {\n\treturn {\n\t\t'$$multi-props': true,\n\t\tvalue: props,\n\t};\n};\n\nexport const getMultiPropsValue = ( multiProps: MultiProps ): Props => {\n\treturn multiProps.value;\n};\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype KeyGenerator = ( { propKey, key }: { propKey: string; key: string } ) => string;\n\nexport const createMultiPropsTransformer = ( keys: string[], keyGenerator: KeyGenerator ) => {\n\treturn createTransformer< Record< string, string > >( ( value, { key: propKey } ) => {\n\t\tconst entries = keys\n\t\t\t.filter( ( key ) => value[ key ] )\n\t\t\t.map( ( key ) => [ keyGenerator( { propKey, key } ), value[ key ] ] );\n\n\t\treturn createMultiPropsValue( Object.fromEntries( entries ) );\n\t} );\n};\n","import { getMediaAttachment } from '@elementor/wp-media';\n\nimport { createTransformer } from '../create-transformer';\n\ntype ImageAttachmentId = number;\n\nexport const imageAttachmentTransformer = createTransformer( async ( value: ImageAttachmentId ) => {\n\tconst attachment = await getMediaAttachment( { id: value } );\n\n\tif ( ! attachment ) {\n\t\treturn null;\n\t}\n\n\treturn attachment;\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype ImageSrc = {\n\tid?: unknown;\n\turl?: unknown;\n};\n\nexport const imageSrcTransformer = createTransformer( ( value: ImageSrc ) => ( {\n\tattachment: value.id,\n\turl: value.url,\n} ) );\n","import { createTransformer } from '../create-transformer';\n\ntype Image = {\n\tsrc?: {\n\t\turl?: string;\n\t\tattachment?: {\n\t\t\turl?: string;\n\t\t\tsizes?: Record< string, { url: string } >;\n\t\t};\n\t};\n\tsize?: string;\n};\n\nexport const imageTransformer = createTransformer( ( value: Image ) => {\n\tconst { src, size } = value;\n\n\tif ( src?.url ) {\n\t\treturn `url(${ src.url })`;\n\t}\n\n\tconst sizeUrl = src?.attachment?.sizes?.[ size ?? '' ]?.url;\n\n\tif ( sizeUrl ) {\n\t\treturn `url(${ sizeUrl })`;\n\t}\n\n\tconst attachmentUrl = src?.attachment?.url;\n\n\tif ( attachmentUrl ) {\n\t\treturn `url(${ attachmentUrl })`;\n\t}\n\n\treturn null;\n} );\n","import { createTransformer } from '../create-transformer';\n\nexport const primitiveTransformer = createTransformer( ( value: unknown ) => value );\n","import { createTransformer } from '../create-transformer';\n\ntype Shadow = {\n\thOffset?: string;\n\tvOffset?: string;\n\tblur?: string;\n\tspread?: string;\n\tcolor?: string;\n\tposition?: string;\n};\n\nexport const shadowTransformer = createTransformer( ( value: Shadow ) => {\n\treturn [ value.hOffset, value.vOffset, value.blur, value.spread, value.color, value.position ]\n\t\t.filter( Boolean )\n\t\t.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype Size = {\n\tsize?: number;\n\tunit?: string;\n};\n\nexport const sizeTransformer = createTransformer( ( value: Size ) => {\n\treturn `${ value.size }${ value.unit }`;\n} );\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype Stroke = {\n\twidth?: string;\n\tcolor?: string;\n};\n\nexport const strokeTransformer = createTransformer( ( value: Stroke ) => {\n\tconst parsed = {\n\t\t'-webkit-text-stroke': `${ value.width } ${ value.color }`,\n\t\tstroke: `${ value.color }`,\n\t\t'stroke-width': `${ value.width }`,\n\t};\n\n\treturn createMultiPropsValue( parsed );\n} );\n","import { styleTransformersRegistry } from './style-transformers-registry';\nimport { backgroundColorOverlayTransformer } from './transformers/styles/background-color-overlay-transformer';\nimport { backgroundImageOverlayTransformer } from './transformers/styles/background-image-overlay-transformer';\nimport { backgroundImagePositionOffsetTransformer } from './transformers/styles/background-image-position-offset-transformer';\nimport { backgroundImageSizeScaleTransformer } from './transformers/styles/background-image-size-scale-transformer';\nimport { backgroundTransformer } from './transformers/styles/background-transformer';\nimport { createCombineArrayTransformer } from './transformers/styles/create-combine-array-transformer';\nimport { createMultiPropsTransformer } from './transformers/styles/create-multi-props-transformer';\nimport { imageAttachmentTransformer } from './transformers/styles/image-attachment-transformer';\nimport { imageSrcTransformer } from './transformers/styles/image-src-transformer';\nimport { imageTransformer } from './transformers/styles/image-transformer';\nimport { primitiveTransformer } from './transformers/styles/primitive-transformer';\nimport { shadowTransformer } from './transformers/styles/shadow-transformer';\nimport { sizeTransformer } from './transformers/styles/size-transformer';\nimport { strokeTransformer } from './transformers/styles/stroke-transformer';\n\nexport function initStyleTransformers() {\n\tstyleTransformersRegistry\n\t\t.register( 'size', sizeTransformer )\n\t\t.register( 'shadow', shadowTransformer )\n\t\t.register( 'stroke', strokeTransformer )\n\t\t.register(\n\t\t\t'dimensions',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'top', 'right', 'bottom', 'left' ],\n\t\t\t\t( { propKey, key } ) => `${ propKey }-${ key }`\n\t\t\t)\n\t\t)\n\t\t.register( 'color', primitiveTransformer )\n\t\t.register( 'number', primitiveTransformer )\n\t\t.register( 'string', primitiveTransformer )\n\t\t.register( 'url', primitiveTransformer )\n\t\t.register( 'box-shadow', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background', backgroundTransformer )\n\t\t.register( 'background-overlay', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background-color-overlay', backgroundColorOverlayTransformer )\n\t\t.register( 'background-image-overlay', backgroundImageOverlayTransformer )\n\t\t.register( 'background-image-position-offset', backgroundImagePositionOffsetTransformer )\n\t\t.register( 'background-image-size-scale', backgroundImageSizeScaleTransformer )\n\t\t.register( 'image-attachment-id', imageAttachmentTransformer )\n\t\t.register( 'image-src', imageSrcTransformer )\n\t\t.register( 'image', imageTransformer )\n\t\t.register(\n\t\t\t'layout-direction',\n\t\t\tcreateMultiPropsTransformer( [ 'row', 'column' ], ( { propKey, key } ) => `${ key }-${ propKey }` )\n\t\t)\n\t\t.register(\n\t\t\t'border-width',\n\t\t\tcreateMultiPropsTransformer( [ 'top', 'right', 'bottom', 'left' ], ( { key } ) => `border-${ key }-width` )\n\t\t)\n\t\t.register(\n\t\t\t'border-radius',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'start-start', 'start-end', 'end-start', 'end-end' ],\n\t\t\t\t( { key } ) => `border-${ key }-radius`\n\t\t\t)\n\t\t);\n}\n","import { getBreakpointsMap } from '@elementor/editor-responsive';\nimport { getStylesSchema } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nimport { createPropsResolver } from './renderers/create-props-resolver';\nimport renderStyles from './renderers/render-styles';\nimport { styleTransformersRegistry } from './style-transformers-registry';\nimport { enqueueFont } from './sync/enqueue-font';\nimport { getCanvasIframeBody } from './sync/get-canvas-iframe-body';\n\nconst WRAPPER_DATA_ATTR = 'data-styles-container';\nconst SELECTOR_PREFIX = '.elementor';\n\nexport function initStylesRenderer() {\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tlet abortController: AbortController | null = null;\n\n\t\tconst resolve = createPropsResolver( {\n\t\t\ttransformers: styleTransformersRegistry.all(),\n\t\t\tschema: getStylesSchema(),\n\t\t\tonPropResolve: enqueueUsedFonts,\n\t\t} );\n\n\t\tstylesRepository.subscribe( async () => {\n\t\t\tconst styleContainer = getStylesContainer();\n\n\t\t\t// Styles should be printed in a reversed order, so the high priority styles will be printed last.\n\t\t\tconst styles = stylesRepository.all().reverse();\n\t\t\tconst breakpoints = getBreakpointsMap();\n\n\t\t\tif ( abortController ) {\n\t\t\t\tabortController.abort();\n\t\t\t}\n\n\t\t\tabortController = new AbortController();\n\n\t\t\tstyleContainer.innerHTML = await renderStyles( {\n\t\t\t\tstyles,\n\t\t\t\tresolve,\n\t\t\t\tbreakpoints,\n\t\t\t\tselectorPrefix: SELECTOR_PREFIX,\n\t\t\t\tsignal: abortController.signal,\n\t\t\t} );\n\t\t} );\n\t} );\n}\n\nfunction getStylesContainer() {\n\tconst preview = getCanvasIframeBody();\n\tconst stylesContainer = preview?.querySelector( `[${ WRAPPER_DATA_ATTR }]` );\n\n\tif ( stylesContainer ) {\n\t\treturn stylesContainer;\n\t}\n\n\tconst el = createStylesContainer();\n\n\tpreview?.prepend( el );\n\n\treturn el;\n}\n\nfunction createStylesContainer() {\n\tconst el = document.createElement( 'div' );\n\tel.style.display = 'none';\n\tel.setAttribute( WRAPPER_DATA_ATTR, '' );\n\n\treturn el;\n}\n\nfunction enqueueUsedFonts( { key, value }: { key: string; value: unknown } ) {\n\tif ( key !== 'font-family' || typeof value !== 'string' ) {\n\t\treturn;\n\t}\n\n\tenqueueFont( value );\n}\n","import {\n\tisTransformable,\n\ttype PropKey,\n\ttype Props,\n\ttype PropsSchema,\n\ttype PropType,\n\ttype PropValue,\n} from '@elementor/editor-props';\n\nimport { type TransformersMap } from '../transformers/types';\nimport { getMultiPropsValue, isMultiProps } from './multi-props';\n\ntype CreatePropResolverArgs = {\n\ttransformers: TransformersMap;\n\tschema: PropsSchema;\n\tonPropResolve?: ( args: { key: string; value: unknown } ) => void;\n};\n\ntype ResolveArgs = {\n\tprops: Props;\n\tschema?: PropsSchema;\n\tsignal?: AbortSignal;\n};\n\ntype TransformArgs = {\n\tvalue: unknown;\n\tkey: PropKey;\n\ttype: PropType;\n\tsignal?: AbortSignal;\n\tdepth?: number;\n};\n\nexport type PropsResolver = ReturnType< typeof createPropsResolver >;\n\nconst TRANSFORM_DEPTH_LIMIT = 3;\n\nexport function createPropsResolver( { transformers, schema: initialSchema, onPropResolve }: CreatePropResolverArgs ) {\n\tasync function resolve( { props, schema, signal }: ResolveArgs ) {\n\t\tschema = schema ?? initialSchema;\n\n\t\tconst promises = Promise.all(\n\t\t\tObject.entries( schema ).map( async ( [ key, type ] ) => {\n\t\t\t\tconst value = props[ key ] ?? type.default;\n\n\t\t\t\tconst transformed = await transform( { value, key, type, signal } );\n\n\t\t\t\tif ( transformed === null ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonPropResolve?.( { key, value: transformed } );\n\n\t\t\t\tif ( isMultiProps( transformed ) ) {\n\t\t\t\t\treturn getMultiPropsValue( transformed );\n\t\t\t\t}\n\n\t\t\t\treturn { [ key ]: transformed };\n\t\t\t} )\n\t\t);\n\n\t\treturn Object.assign( {}, ...( await promises ).filter( Boolean ) );\n\t}\n\n\tasync function transform( { value, key, type, signal, depth = 0 }: TransformArgs ) {\n\t\tif ( value === null || value === undefined ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( ! isTransformable( value ) ) {\n\t\t\treturn value;\n\t\t}\n\n\t\tif ( depth > TRANSFORM_DEPTH_LIMIT ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( value.disabled === true ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( type.kind === 'union' ) {\n\t\t\ttype = type.prop_types[ value.$$type ];\n\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t}\n\n\t\t// Warning: This variable is loosely-typed - use with caution.\n\t\tlet resolvedValue = value.value;\n\n\t\tif ( type.kind === 'object' ) {\n\t\t\tresolvedValue = await resolve( {\n\t\t\t\tprops: resolvedValue,\n\t\t\t\tschema: type.shape,\n\t\t\t\tsignal,\n\t\t\t} );\n\t\t}\n\n\t\tif ( type.kind === 'array' ) {\n\t\t\tresolvedValue = await Promise.all(\n\t\t\t\tresolvedValue.map( ( item: PropValue ) =>\n\t\t\t\t\ttransform( { value: item, key, type: type.item_prop_type, depth, signal } )\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tconst transformer = transformers[ value.$$type ];\n\n\t\tif ( ! transformer ) {\n\t\t\treturn null;\n\t\t}\n\n\t\ttry {\n\t\t\tconst transformed = await transformer( resolvedValue, { key, signal } );\n\n\t\t\treturn transform( { value: transformed, key, type, signal, depth: depth + 1 } );\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\treturn resolve;\n}\n","import { createError } from '@elementor/utils';\n\nexport const UnknownStyleTypeError = createError< { type: string } >( {\n\tcode: 'unknown_style_type',\n\tmessage: 'Unknown style type',\n} );\n","import { type Props } from '@elementor/editor-props';\nimport { type Breakpoint, type BreakpointsMap } from '@elementor/editor-responsive';\nimport { type StyleDefinition, type StyleDefinitionState, type StyleDefinitionType } from '@elementor/editor-styles';\n\nimport { type PropsResolver } from './create-props-resolver';\nimport { UnknownStyleTypeError } from './errors';\n\ntype RenderParams = {\n\tresolve: PropsResolver;\n\tstyles: StyleDefinition[];\n\tbreakpoints: BreakpointsMap;\n\tselectorPrefix?: string;\n\tsignal?: AbortSignal;\n};\n\ntype PropsToCssArgs = {\n\tprops: Props;\n\tresolve: PropsResolver;\n\tsignal?: AbortSignal;\n};\n\nconst SELECTORS_MAP: Record< StyleDefinitionType, string > = {\n\tclass: '.',\n};\n\nexport default async function renderStyles( {\n\tresolve,\n\tstyles,\n\tbreakpoints,\n\tselectorPrefix = '',\n\tsignal,\n}: RenderParams ) {\n\tconst stylesCssPromises = styles.map( async ( style ) => {\n\t\tconst variantCssPromises = Object.values( style.variants ).map( async ( variant ) => {\n\t\t\tconst css = await propsToCss( { props: variant.props, resolve, signal } );\n\n\t\t\treturn createStyleWrapper()\n\t\t\t\t.forStyle( style )\n\t\t\t\t.withPrefix( selectorPrefix )\n\t\t\t\t.withState( variant.meta.state )\n\t\t\t\t.withMediaQuery( variant.meta.breakpoint ? breakpoints[ variant.meta.breakpoint ] : null )\n\t\t\t\t.wrap( css );\n\t\t} );\n\n\t\tconst variantsCss = await Promise.all( variantCssPromises );\n\n\t\treturn wrapCssWithStyleElement( style.id, variantsCss.join( '' ) );\n\t} );\n\n\tconst stylesCss = await Promise.all( stylesCssPromises );\n\n\treturn stylesCss.join( '' );\n}\n\nfunction createStyleWrapper( value: string = '', wrapper?: ( css: string ) => string ) {\n\treturn {\n\t\tforStyle: ( { id, type }: StyleDefinition ) => {\n\t\t\tconst symbol = SELECTORS_MAP[ type ];\n\n\t\t\tif ( ! symbol ) {\n\t\t\t\tthrow new UnknownStyleTypeError( { context: { type } } );\n\t\t\t}\n\n\t\t\treturn createStyleWrapper( `${ value }${ symbol }${ id }`, wrapper );\n\t\t},\n\n\t\twithPrefix: ( prefix: string ) =>\n\t\t\tcreateStyleWrapper( [ prefix, value ].filter( Boolean ).join( ' ' ), wrapper ),\n\n\t\twithState: ( state: StyleDefinitionState ) =>\n\t\t\tcreateStyleWrapper( state ? `${ value }:${ state }` : value, wrapper ),\n\n\t\twithMediaQuery: ( breakpoint: Breakpoint | null ) => {\n\t\t\tif ( ! breakpoint?.type ) {\n\t\t\t\treturn createStyleWrapper( value, wrapper );\n\t\t\t}\n\n\t\t\tconst size = `${ breakpoint.type }:${ breakpoint.width }px`;\n\n\t\t\treturn createStyleWrapper( value, ( css ) => `@media(${ size }){${ css }}` );\n\t\t},\n\n\t\twrap: ( css: string ) => {\n\t\t\tconst res = `${ value }{${ css }}`;\n\n\t\t\tif ( ! wrapper ) {\n\t\t\t\treturn res;\n\t\t\t}\n\n\t\t\treturn wrapper( res );\n\t\t},\n\t};\n}\n\nasync function propsToCss( { props, resolve, signal }: PropsToCssArgs ) {\n\tconst transformed = await resolve( { props, signal } );\n\n\treturn Object.entries( transformed )\n\t\t.reduce< string[] >( ( acc, [ propName, propValue ] ) => {\n\t\t\tacc.push( propName + ':' + propValue + ';' );\n\n\t\t\treturn acc;\n\t\t}, [] )\n\t\t.join( '' );\n}\n\nfunction wrapCssWithStyleElement( id: string, css: string ) {\n\treturn `<style data-style-id=\"${ id }\">${ css }</style>`;\n}\n","import { type CanvasExtendedWindow, type EnqueueFont } from './types';\n\nexport const enqueueFont: EnqueueFont = ( fontFamily, context = 'preview' ) => {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.helpers?.enqueueFont?.( fontFamily, context ) ?? null;\n};\n","import type { CanvasExtendedWindow } from './types';\n\nexport function getCanvasIframeBody() {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.$preview?.[ 0 ]?.contentDocument?.body;\n}\n","import { init } from './init';\n\nexport { styleTransformersRegistry } from './style-transformers-registry';\n\ninit();\n"],"mappings":"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","names":["React","size","size","size"]}
+{"version":3,"sources":["../src/init.tsx","../src/components/elements-overlays.tsx","../src/components/element-overlay.tsx","../src/hooks/use-bind-react-props-to-element.ts","../src/hooks/use-floating-on-element.ts","../src/transformers/create-transformers-registry.ts","../src/style-transformers-registry.ts","../src/transformers/create-transformer.ts","../src/transformers/styles/background-color-overlay-transformer.ts","../src/transformers/styles/background-gradient-overlay-transformer.ts","../src/transformers/styles/background-image-overlay-transformer.ts","../src/transformers/styles/background-image-position-offset-transformer.ts","../src/transformers/styles/background-image-size-scale-transformer.ts","../src/transformers/styles/background-transformer.ts","../src/transformers/styles/color-stop-transformer.ts","../src/transformers/styles/create-combine-array-transformer.ts","../src/renderers/multi-props.ts","../src/transformers/styles/create-multi-props-transformer.ts","../src/transformers/styles/image-attachment-transformer.ts","../src/transformers/styles/image-src-transformer.ts","../src/transformers/styles/image-transformer.ts","../src/transformers/styles/primitive-transformer.ts","../src/transformers/styles/shadow-transformer.ts","../src/transformers/styles/size-transformer.ts","../src/transformers/styles/stroke-transformer.ts","../src/init-style-transformers.ts","../src/init-styles-renderer.ts","../src/renderers/create-props-resolver.ts","../src/renderers/errors.ts","../src/renderers/render-styles.ts","../src/sync/enqueue-font.ts","../src/sync/get-canvas-iframe-body.ts","../src/index.ts"],"sourcesContent":["import { injectIntoTop } from '@elementor/editor';\n\nimport { ElementsOverlays } from './components/elements-overlays';\nimport { initStyleTransformers } from './init-style-transformers';\nimport { initStylesRenderer } from './init-styles-renderer';\n\nexport function init() {\n\tinitStyleTransformers();\n\tinitStylesRenderer();\n\n\tinjectIntoTop( {\n\t\tid: 'elements-overlays',\n\t\tcomponent: ElementsOverlays,\n\t} );\n}\n","import * as React from 'react';\nimport { useElementsDomRef, useSelectedElement } from '@elementor/editor-elements';\nimport { __privateUseIsRouteActive as useIsRouteActive, useEditMode } from '@elementor/editor-v1-adapters';\n\nimport { ElementOverlay } from './element-overlay';\n\nexport function ElementsOverlays() {\n\tconst selected = useSelectedElement();\n\tconst domElements = useElementsDomRef();\n\tconst currentEditMode = useEditMode();\n\n\tconst isEditMode = currentEditMode === 'edit';\n\tconst isKitRouteActive = useIsRouteActive( 'panel/global' );\n\n\tconst isActive = isEditMode && ! isKitRouteActive;\n\n\treturn (\n\t\tisActive &&\n\t\tdomElements.map( ( el ) => (\n\t\t\t<ElementOverlay\n\t\t\t\telement={ el }\n\t\t\t\tkey={ el.dataset.id }\n\t\t\t\tisSelected={ selected.element?.id === el.dataset.id }\n\t\t\t/>\n\t\t) )\n\t);\n}\n","import * as React from 'react';\nimport { Box, styled } from '@elementor/ui';\nimport { FloatingPortal, useHover, useInteractions } from '@floating-ui/react';\n\nimport { useBindReactPropsToElement } from '../hooks/use-bind-react-props-to-element';\nimport { useFloatingOnElement } from '../hooks/use-floating-on-element';\n\nexport const CANVAS_WRAPPER_ID = 'elementor-preview-responsive-wrapper';\n\ntype Props = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nconst OverlayBox = styled( Box, { shouldForwardProp: ( prop ) => prop !== 'isSelected' } )<\n\tPick< Props, 'isSelected' >\n>( ( { theme, isSelected } ) => ( {\n\toutline: `${ isSelected ? '2px' : '1px' } solid ${ theme.palette.primary.light }`,\n\toutlineOffset: isSelected ? '-2px' : '-1px',\n\tpointerEvents: 'none',\n} ) );\n\nexport function ElementOverlay( { element, isSelected }: Props ) {\n\tconst { context, floating, isVisible } = useFloatingOnElement( { element, isSelected } );\n\tconst { getFloatingProps, getReferenceProps } = useInteractions( [ useHover( context ) ] );\n\n\tuseBindReactPropsToElement( element, getReferenceProps );\n\n\treturn (\n\t\tisVisible && (\n\t\t\t<FloatingPortal id={ CANVAS_WRAPPER_ID }>\n\t\t\t\t<OverlayBox\n\t\t\t\t\tref={ floating.setRef }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tstyle={ floating.styles }\n\t\t\t\t\tdata-element-overlay={ element.dataset.id }\n\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t{ ...getFloatingProps() }\n\t\t\t\t/>\n\t\t\t</FloatingPortal>\n\t\t)\n\t);\n}\n","import { useEffect } from 'react';\n\ntype Props = Record< string, unknown >;\n\nexport function useBindReactPropsToElement( element: HTMLElement, getProps: () => Props ) {\n\tuseEffect( () => {\n\t\tconst el = element;\n\n\t\tconst { events, attrs } = groupProps( getProps() );\n\n\t\tevents.forEach( ( [ eventName, listener ] ) => el.addEventListener( eventName, listener ) );\n\t\tattrs.forEach( ( [ attrName, attrValue ] ) => el.setAttribute( attrName, attrValue ) );\n\n\t\treturn () => {\n\t\t\tevents.forEach( ( [ eventName, listener ] ) => el.removeEventListener( eventName, listener ) );\n\t\t\tattrs.forEach( ( [ attrName ] ) => el.removeAttribute( attrName ) );\n\t\t};\n\t}, [ getProps, element ] );\n}\n\ntype GroupedProps = {\n\tevents: Array< [ string, () => void ] >;\n\tattrs: Array< [ string, string ] >;\n};\n\nfunction groupProps( props: Props ) {\n\tconst eventRegex = /^on(?=[A-Z])/;\n\n\treturn Object.entries( props ).reduce< GroupedProps >(\n\t\t( acc, [ propName, propValue ] ) => {\n\t\t\tif ( ! eventRegex.test( propName ) ) {\n\t\t\t\tacc.attrs.push( [ propName, propValue as string ] );\n\n\t\t\t\treturn acc;\n\t\t\t}\n\n\t\t\tconst eventName = propName.replace( eventRegex, '' ).toLowerCase();\n\t\t\tconst listener = propValue as () => void;\n\n\t\t\tacc.events.push( [ eventName, listener ] );\n\n\t\t\treturn acc;\n\t\t},\n\t\t{\n\t\t\tevents: [],\n\t\t\tattrs: [],\n\t\t}\n\t);\n}\n","import { useState } from 'react';\nimport { autoUpdate, offset, size, useFloating } from '@floating-ui/react';\n\ntype Options = {\n\telement: HTMLElement;\n\tisSelected: boolean;\n};\n\nexport function useFloatingOnElement( { element, isSelected }: Options ) {\n\tconst [ isOpen, setIsOpen ] = useState( false );\n\n\tconst { refs, floatingStyles, context } = useFloating( {\n\t\t// Must be controlled for interactions (like hover) to work.\n\t\topen: isOpen || isSelected,\n\t\tonOpenChange: setIsOpen,\n\n\t\t// Add an animation frame to support scroll events (without it the floating element will stay in the same position).\n\t\twhileElementsMounted: ( ...args ) => autoUpdate( ...args, { animationFrame: true } ),\n\n\t\t// The first element in the canvas is `display: contents` so we need to use the first child.\n\t\telements: { reference: element.firstElementChild },\n\n\t\tmiddleware: [\n\t\t\t// Match the floating element's size to the reference element.\n\t\t\tsize( {\n\t\t\t\tapply( { elements, rects } ) {\n\t\t\t\t\tObject.assign( elements.floating.style, {\n\t\t\t\t\t\twidth: `${ rects.reference.width }px`,\n\t\t\t\t\t\theight: `${ rects.reference.height }px`,\n\t\t\t\t\t} );\n\t\t\t\t},\n\t\t\t} ),\n\n\t\t\t// Center the floating element on the reference element.\n\t\t\toffset( ( { rects } ) => -rects.reference.height / 2 - rects.floating.height / 2 ),\n\t\t],\n\t} );\n\n\treturn {\n\t\tisVisible: isOpen || isSelected,\n\t\tcontext,\n\t\tfloating: {\n\t\t\tsetRef: refs.setFloating,\n\t\t\tref: refs.floating,\n\t\t\tstyles: floatingStyles,\n\t\t},\n\t};\n}\n","import { type AnyTransformer, type TransformerName, type TransformersMap } from './types';\n\nexport function createTransformersRegistry() {\n\tconst transformers: TransformersMap = {};\n\n\treturn {\n\t\tregister( name: TransformerName, transformer: AnyTransformer ) {\n\t\t\ttransformers[ name ] = transformer;\n\n\t\t\treturn this;\n\t\t},\n\t\tall() {\n\t\t\treturn transformers;\n\t\t},\n\t};\n}\n","import { createTransformersRegistry } from './transformers/create-transformers-registry';\n\nexport const styleTransformersRegistry = createTransformersRegistry();\n","import { type AnyTransformable } from '@elementor/editor-props';\n\nimport { type Transformer, type UnbrandedTransformer } from './types';\n\n// Wrap transformer for better DX (types).\n// Inspired by: https://tkdodo.eu/blog/the-query-options-api\nexport function createTransformer< TValue = never >(\n\tcb: TValue extends AnyTransformable\n\t\t? 'Transformable values are invalid, use the actual value instead.'\n\t\t: UnbrandedTransformer< TValue >\n): Transformer< NoInfer< TValue > > {\n\treturn cb as never;\n}\n","import { createTransformer } from '../create-transformer';\n\nexport const backgroundColorOverlayTransformer = createTransformer(\n\t( value: string ) => `linear-gradient(${ value }, ${ value })`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundGradientOverlay = {\n\ttype?: 'linear' | 'radial';\n\tangle?: string;\n\tstops?: string;\n\tpositions?: string;\n};\n\nexport const backgroundGradientOverlayTransformer = createTransformer( ( value: BackgroundGradientOverlay ) => {\n\tif ( value.type === 'radial' ) {\n\t\treturn `radial-gradient(circle at ${ value.positions }, ${ value.stops })`;\n\t}\n\n\treturn `linear-gradient(${ value.angle }deg, ${ value.stops })`;\n} );\n","import { createTransformer } from '../create-transformer';\n\nconst DEFAULT_POSITION_VALUE = '0% 0%';\n\ntype BackgroundImageOverlay = {\n\timage?: string;\n\tsize?: string;\n\tposition?: string;\n\trepeat?: string;\n\tattachment?: string;\n};\n\nexport const backgroundImageOverlayTransformer = createTransformer( ( value: BackgroundImageOverlay ) => {\n\tconst { image, size = null, position = null, repeat = null, attachment = null } = value;\n\n\tif ( ! image ) {\n\t\treturn null;\n\t}\n\n\tconst backgroundStyles = [\n\t\timage,\n\t\trepeat,\n\t\tattachment,\n\t\tsize ? `${ position || DEFAULT_POSITION_VALUE } / ${ size }` : position,\n\t].filter( Boolean );\n\n\treturn backgroundStyles.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImagePositionOffset = {\n\tx?: string;\n\ty?: string;\n};\n\nexport const backgroundImagePositionOffsetTransformer = createTransformer(\n\t( { x = '0px', y = '0px' }: BackgroundImagePositionOffset ) => `${ x } ${ y }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype BackgroundImageSizeScale = {\n\twidth?: string;\n\theight?: string;\n};\n\nexport const backgroundImageSizeScaleTransformer = createTransformer(\n\t( { width = 'auto', height = 'auto' }: BackgroundImageSizeScale ) => `${ width } ${ height }`\n);\n","import { createTransformer } from '../create-transformer';\n\ntype Background = {\n\t'background-overlay'?: string;\n\tcolor?: string;\n};\n\nexport const backgroundTransformer = createTransformer( ( value: Background ) => {\n\tconst overlays = value[ 'background-overlay' ] ?? '';\n\tconst color = value.color ?? '';\n\n\treturn `${ overlays } ${ color }`.trim();\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype ColorStop = {\n\tcolor?: string;\n\toffset?: number;\n};\n\nexport const colorStopTransformer = createTransformer(\n\t( value: ColorStop ) => `${ value?.color } ${ value?.offset ?? 0 }%`\n);\n","import { createTransformer } from '../create-transformer';\n\nexport const createCombineArrayTransformer = ( delimiter: string ) => {\n\treturn createTransformer( ( value: Array< string | number > ) => value.filter( Boolean ).join( delimiter ) );\n};\n","import { type Props, type PropValue } from '@elementor/editor-props';\n\ntype MultiProps = {\n\t'$$multi-props': true;\n\tvalue: Props;\n};\n\nexport const isMultiProps = ( propValue: PropValue ): propValue is MultiProps => {\n\treturn (\n\t\t!! propValue &&\n\t\ttypeof propValue === 'object' &&\n\t\t'$$multi-props' in propValue &&\n\t\tpropValue[ '$$multi-props' ] === true\n\t);\n};\n\nexport const createMultiPropsValue = ( props: Props ): MultiProps => {\n\treturn {\n\t\t'$$multi-props': true,\n\t\tvalue: props,\n\t};\n};\n\nexport const getMultiPropsValue = ( multiProps: MultiProps ): Props => {\n\treturn multiProps.value;\n};\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype KeyGenerator = ( { propKey, key }: { propKey: string; key: string } ) => string;\n\nexport const createMultiPropsTransformer = ( keys: string[], keyGenerator: KeyGenerator ) => {\n\treturn createTransformer< Record< string, string > >( ( value, { key: propKey } ) => {\n\t\tconst entries = keys\n\t\t\t.filter( ( key ) => value[ key ] )\n\t\t\t.map( ( key ) => [ keyGenerator( { propKey, key } ), value[ key ] ] );\n\n\t\treturn createMultiPropsValue( Object.fromEntries( entries ) );\n\t} );\n};\n","import { getMediaAttachment } from '@elementor/wp-media';\n\nimport { createTransformer } from '../create-transformer';\n\ntype ImageAttachmentId = number;\n\nexport const imageAttachmentTransformer = createTransformer( async ( value: ImageAttachmentId ) => {\n\tconst attachment = await getMediaAttachment( { id: value } );\n\n\tif ( ! attachment ) {\n\t\treturn null;\n\t}\n\n\treturn attachment;\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype ImageSrc = {\n\tid?: unknown;\n\turl?: unknown;\n};\n\nexport const imageSrcTransformer = createTransformer( ( value: ImageSrc ) => ( {\n\tattachment: value.id,\n\turl: value.url,\n} ) );\n","import { createTransformer } from '../create-transformer';\n\ntype Image = {\n\tsrc?: {\n\t\turl?: string;\n\t\tattachment?: {\n\t\t\turl?: string;\n\t\t\tsizes?: Record< string, { url: string } >;\n\t\t};\n\t};\n\tsize?: string;\n};\n\nexport const imageTransformer = createTransformer( ( value: Image ) => {\n\tconst { src, size } = value;\n\n\tif ( src?.url ) {\n\t\treturn `url(${ src.url })`;\n\t}\n\n\tconst sizeUrl = src?.attachment?.sizes?.[ size ?? '' ]?.url;\n\n\tif ( sizeUrl ) {\n\t\treturn `url(${ sizeUrl })`;\n\t}\n\n\tconst attachmentUrl = src?.attachment?.url;\n\n\tif ( attachmentUrl ) {\n\t\treturn `url(${ attachmentUrl })`;\n\t}\n\n\treturn null;\n} );\n","import { createTransformer } from '../create-transformer';\n\nexport const primitiveTransformer = createTransformer( ( value: unknown ) => value );\n","import { createTransformer } from '../create-transformer';\n\ntype Shadow = {\n\thOffset?: string;\n\tvOffset?: string;\n\tblur?: string;\n\tspread?: string;\n\tcolor?: string;\n\tposition?: string;\n};\n\nexport const shadowTransformer = createTransformer( ( value: Shadow ) => {\n\treturn [ value.hOffset, value.vOffset, value.blur, value.spread, value.color, value.position ]\n\t\t.filter( Boolean )\n\t\t.join( ' ' );\n} );\n","import { createTransformer } from '../create-transformer';\n\ntype Size = {\n\tsize?: number;\n\tunit?: string;\n};\n\nexport const sizeTransformer = createTransformer( ( value: Size ) => {\n\treturn `${ value.size }${ value.unit }`;\n} );\n","import { createMultiPropsValue } from '../../renderers/multi-props';\nimport { createTransformer } from '../create-transformer';\n\ntype Stroke = {\n\twidth?: string;\n\tcolor?: string;\n};\n\nexport const strokeTransformer = createTransformer( ( value: Stroke ) => {\n\tconst parsed = {\n\t\t'-webkit-text-stroke': `${ value.width } ${ value.color }`,\n\t\tstroke: `${ value.color }`,\n\t\t'stroke-width': `${ value.width }`,\n\t};\n\n\treturn createMultiPropsValue( parsed );\n} );\n","import { styleTransformersRegistry } from './style-transformers-registry';\nimport { backgroundColorOverlayTransformer } from './transformers/styles/background-color-overlay-transformer';\nimport { backgroundGradientOverlayTransformer } from './transformers/styles/background-gradient-overlay-transformer';\nimport { backgroundImageOverlayTransformer } from './transformers/styles/background-image-overlay-transformer';\nimport { backgroundImagePositionOffsetTransformer } from './transformers/styles/background-image-position-offset-transformer';\nimport { backgroundImageSizeScaleTransformer } from './transformers/styles/background-image-size-scale-transformer';\nimport { backgroundTransformer } from './transformers/styles/background-transformer';\nimport { colorStopTransformer } from './transformers/styles/color-stop-transformer';\nimport { createCombineArrayTransformer } from './transformers/styles/create-combine-array-transformer';\nimport { createMultiPropsTransformer } from './transformers/styles/create-multi-props-transformer';\nimport { imageAttachmentTransformer } from './transformers/styles/image-attachment-transformer';\nimport { imageSrcTransformer } from './transformers/styles/image-src-transformer';\nimport { imageTransformer } from './transformers/styles/image-transformer';\nimport { primitiveTransformer } from './transformers/styles/primitive-transformer';\nimport { shadowTransformer } from './transformers/styles/shadow-transformer';\nimport { sizeTransformer } from './transformers/styles/size-transformer';\nimport { strokeTransformer } from './transformers/styles/stroke-transformer';\n\nexport function initStyleTransformers() {\n\tstyleTransformersRegistry\n\t\t.register( 'size', sizeTransformer )\n\t\t.register( 'shadow', shadowTransformer )\n\t\t.register( 'stroke', strokeTransformer )\n\t\t.register(\n\t\t\t'dimensions',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'block-start', 'block-end', 'inline-start', 'inline-end' ],\n\t\t\t\t( { propKey, key } ) => `${ propKey }-${ key }`\n\t\t\t)\n\t\t)\n\t\t.register( 'color', primitiveTransformer )\n\t\t.register( 'number', primitiveTransformer )\n\t\t.register( 'string', primitiveTransformer )\n\t\t.register( 'url', primitiveTransformer )\n\t\t.register( 'box-shadow', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background', backgroundTransformer )\n\t\t.register( 'background-overlay', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'background-color-overlay', backgroundColorOverlayTransformer )\n\t\t.register( 'background-image-overlay', backgroundImageOverlayTransformer )\n\t\t.register( 'background-gradient-overlay', backgroundGradientOverlayTransformer )\n\t\t.register( 'gradient-color-stop', createCombineArrayTransformer( ',' ) )\n\t\t.register( 'color-stop', colorStopTransformer )\n\t\t.register( 'background-image-position-offset', backgroundImagePositionOffsetTransformer )\n\t\t.register( 'background-image-size-scale', backgroundImageSizeScaleTransformer )\n\t\t.register( 'image-attachment-id', imageAttachmentTransformer )\n\t\t.register( 'image-src', imageSrcTransformer )\n\t\t.register( 'image', imageTransformer )\n\t\t.register(\n\t\t\t'layout-direction',\n\t\t\tcreateMultiPropsTransformer( [ 'row', 'column' ], ( { propKey, key } ) => `${ key }-${ propKey }` )\n\t\t)\n\t\t.register(\n\t\t\t'border-width',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'block-start', 'block-end', 'inline-start', 'inline-end' ],\n\t\t\t\t( { key } ) => `border-${ key }-width`\n\t\t\t)\n\t\t)\n\t\t.register(\n\t\t\t'border-radius',\n\t\t\tcreateMultiPropsTransformer(\n\t\t\t\t[ 'start-start', 'start-end', 'end-start', 'end-end' ],\n\t\t\t\t( { key } ) => `border-${ key }-radius`\n\t\t\t)\n\t\t);\n}\n","import { getBreakpointsMap } from '@elementor/editor-responsive';\nimport { getStylesSchema } from '@elementor/editor-styles';\nimport { stylesRepository } from '@elementor/editor-styles-repository';\nimport { __privateListenTo as listenTo, v1ReadyEvent } from '@elementor/editor-v1-adapters';\n\nimport { createPropsResolver } from './renderers/create-props-resolver';\nimport renderStyles from './renderers/render-styles';\nimport { styleTransformersRegistry } from './style-transformers-registry';\nimport { enqueueFont } from './sync/enqueue-font';\nimport { getCanvasIframeBody } from './sync/get-canvas-iframe-body';\n\nconst WRAPPER_DATA_ATTR = 'data-styles-container';\nconst SELECTOR_PREFIX = '.elementor';\n\nexport function initStylesRenderer() {\n\tlistenTo( v1ReadyEvent(), () => {\n\t\tlet abortController: AbortController | null = null;\n\n\t\tconst resolve = createPropsResolver( {\n\t\t\ttransformers: styleTransformersRegistry.all(),\n\t\t\tschema: getStylesSchema(),\n\t\t\tonPropResolve: enqueueUsedFonts,\n\t\t} );\n\n\t\tstylesRepository.subscribe( async () => {\n\t\t\tconst styleContainer = getStylesContainer();\n\n\t\t\t// Styles should be printed in a reversed order, so the high priority styles will be printed last.\n\t\t\tconst styles = stylesRepository.all().reverse();\n\t\t\tconst breakpoints = getBreakpointsMap();\n\n\t\t\tif ( abortController ) {\n\t\t\t\tabortController.abort();\n\t\t\t}\n\n\t\t\tabortController = new AbortController();\n\n\t\t\tstyleContainer.innerHTML = await renderStyles( {\n\t\t\t\tstyles,\n\t\t\t\tresolve,\n\t\t\t\tbreakpoints,\n\t\t\t\tselectorPrefix: SELECTOR_PREFIX,\n\t\t\t\tsignal: abortController.signal,\n\t\t\t} );\n\t\t} );\n\t} );\n}\n\nfunction getStylesContainer() {\n\tconst preview = getCanvasIframeBody();\n\tconst stylesContainer = preview?.querySelector( `[${ WRAPPER_DATA_ATTR }]` );\n\n\tif ( stylesContainer ) {\n\t\treturn stylesContainer;\n\t}\n\n\tconst el = createStylesContainer();\n\n\tpreview?.prepend( el );\n\n\treturn el;\n}\n\nfunction createStylesContainer() {\n\tconst el = document.createElement( 'div' );\n\tel.style.display = 'none';\n\tel.setAttribute( WRAPPER_DATA_ATTR, '' );\n\n\treturn el;\n}\n\nfunction enqueueUsedFonts( { key, value }: { key: string; value: unknown } ) {\n\tif ( key !== 'font-family' || typeof value !== 'string' ) {\n\t\treturn;\n\t}\n\n\tenqueueFont( value );\n}\n","import {\n\tisTransformable,\n\ttype PropKey,\n\ttype Props,\n\ttype PropsSchema,\n\ttype PropType,\n\ttype PropValue,\n} from '@elementor/editor-props';\n\nimport { type TransformersMap } from '../transformers/types';\nimport { getMultiPropsValue, isMultiProps } from './multi-props';\n\ntype CreatePropResolverArgs = {\n\ttransformers: TransformersMap;\n\tschema: PropsSchema;\n\tonPropResolve?: ( args: { key: string; value: unknown } ) => void;\n};\n\ntype ResolveArgs = {\n\tprops: Props;\n\tschema?: PropsSchema;\n\tsignal?: AbortSignal;\n};\n\ntype TransformArgs = {\n\tvalue: unknown;\n\tkey: PropKey;\n\ttype: PropType;\n\tsignal?: AbortSignal;\n\tdepth?: number;\n};\n\nexport type PropsResolver = ReturnType< typeof createPropsResolver >;\n\nconst TRANSFORM_DEPTH_LIMIT = 3;\n\nexport function createPropsResolver( { transformers, schema: initialSchema, onPropResolve }: CreatePropResolverArgs ) {\n\tasync function resolve( { props, schema, signal }: ResolveArgs ) {\n\t\tschema = schema ?? initialSchema;\n\n\t\tconst promises = Promise.all(\n\t\t\tObject.entries( schema ).map( async ( [ key, type ] ) => {\n\t\t\t\tconst value = props[ key ] ?? type.default;\n\n\t\t\t\tconst transformed = await transform( { value, key, type, signal } );\n\n\t\t\t\tif ( transformed === null ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tonPropResolve?.( { key, value: transformed } );\n\n\t\t\t\tif ( isMultiProps( transformed ) ) {\n\t\t\t\t\treturn getMultiPropsValue( transformed );\n\t\t\t\t}\n\n\t\t\t\treturn { [ key ]: transformed };\n\t\t\t} )\n\t\t);\n\n\t\treturn Object.assign( {}, ...( await promises ).filter( Boolean ) );\n\t}\n\n\tasync function transform( { value, key, type, signal, depth = 0 }: TransformArgs ) {\n\t\tif ( value === null || value === undefined ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( ! isTransformable( value ) ) {\n\t\t\treturn value;\n\t\t}\n\n\t\tif ( depth > TRANSFORM_DEPTH_LIMIT ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( value.disabled === true ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tif ( type.kind === 'union' ) {\n\t\t\ttype = type.prop_types[ value.$$type ];\n\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\t\t}\n\n\t\t// Warning: This variable is loosely-typed - use with caution.\n\t\tlet resolvedValue = value.value;\n\n\t\tif ( type.kind === 'object' ) {\n\t\t\tresolvedValue = await resolve( {\n\t\t\t\tprops: resolvedValue,\n\t\t\t\tschema: type.shape,\n\t\t\t\tsignal,\n\t\t\t} );\n\t\t}\n\n\t\tif ( type.kind === 'array' ) {\n\t\t\tresolvedValue = await Promise.all(\n\t\t\t\tresolvedValue.map( ( item: PropValue ) =>\n\t\t\t\t\ttransform( { value: item, key, type: type.item_prop_type, depth, signal } )\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\n\t\tconst transformer = transformers[ value.$$type ];\n\n\t\tif ( ! transformer ) {\n\t\t\treturn null;\n\t\t}\n\n\t\ttry {\n\t\t\tconst transformed = await transformer( resolvedValue, { key, signal } );\n\n\t\t\treturn transform( { value: transformed, key, type, signal, depth: depth + 1 } );\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\treturn resolve;\n}\n","import { createError } from '@elementor/utils';\n\nexport const UnknownStyleTypeError = createError< { type: string } >( {\n\tcode: 'unknown_style_type',\n\tmessage: 'Unknown style type',\n} );\n","import { type Props } from '@elementor/editor-props';\nimport { type Breakpoint, type BreakpointsMap } from '@elementor/editor-responsive';\nimport { type StyleDefinition, type StyleDefinitionState, type StyleDefinitionType } from '@elementor/editor-styles';\n\nimport { type PropsResolver } from './create-props-resolver';\nimport { UnknownStyleTypeError } from './errors';\n\ntype RenderParams = {\n\tresolve: PropsResolver;\n\tstyles: StyleDefinition[];\n\tbreakpoints: BreakpointsMap;\n\tselectorPrefix?: string;\n\tsignal?: AbortSignal;\n};\n\ntype PropsToCssArgs = {\n\tprops: Props;\n\tresolve: PropsResolver;\n\tsignal?: AbortSignal;\n};\n\nconst SELECTORS_MAP: Record< StyleDefinitionType, string > = {\n\tclass: '.',\n};\n\nexport default async function renderStyles( {\n\tresolve,\n\tstyles,\n\tbreakpoints,\n\tselectorPrefix = '',\n\tsignal,\n}: RenderParams ) {\n\tconst stylesCssPromises = styles.map( async ( style ) => {\n\t\tconst variantCssPromises = Object.values( style.variants ).map( async ( variant ) => {\n\t\t\tconst css = await propsToCss( { props: variant.props, resolve, signal } );\n\n\t\t\treturn createStyleWrapper()\n\t\t\t\t.forStyle( style )\n\t\t\t\t.withPrefix( selectorPrefix )\n\t\t\t\t.withState( variant.meta.state )\n\t\t\t\t.withMediaQuery( variant.meta.breakpoint ? breakpoints[ variant.meta.breakpoint ] : null )\n\t\t\t\t.wrap( css );\n\t\t} );\n\n\t\tconst variantsCss = await Promise.all( variantCssPromises );\n\n\t\treturn wrapCssWithStyleElement( style.id, variantsCss.join( '' ) );\n\t} );\n\n\tconst stylesCss = await Promise.all( stylesCssPromises );\n\n\treturn stylesCss.join( '' );\n}\n\nfunction createStyleWrapper( value: string = '', wrapper?: ( css: string ) => string ) {\n\treturn {\n\t\tforStyle: ( { id, type }: StyleDefinition ) => {\n\t\t\tconst symbol = SELECTORS_MAP[ type ];\n\n\t\t\tif ( ! symbol ) {\n\t\t\t\tthrow new UnknownStyleTypeError( { context: { type } } );\n\t\t\t}\n\n\t\t\treturn createStyleWrapper( `${ value }${ symbol }${ id }`, wrapper );\n\t\t},\n\n\t\twithPrefix: ( prefix: string ) =>\n\t\t\tcreateStyleWrapper( [ prefix, value ].filter( Boolean ).join( ' ' ), wrapper ),\n\n\t\twithState: ( state: StyleDefinitionState ) =>\n\t\t\tcreateStyleWrapper( state ? `${ value }:${ state }` : value, wrapper ),\n\n\t\twithMediaQuery: ( breakpoint: Breakpoint | null ) => {\n\t\t\tif ( ! breakpoint?.type ) {\n\t\t\t\treturn createStyleWrapper( value, wrapper );\n\t\t\t}\n\n\t\t\tconst size = `${ breakpoint.type }:${ breakpoint.width }px`;\n\n\t\t\treturn createStyleWrapper( value, ( css ) => `@media(${ size }){${ css }}` );\n\t\t},\n\n\t\twrap: ( css: string ) => {\n\t\t\tconst res = `${ value }{${ css }}`;\n\n\t\t\tif ( ! wrapper ) {\n\t\t\t\treturn res;\n\t\t\t}\n\n\t\t\treturn wrapper( res );\n\t\t},\n\t};\n}\n\nasync function propsToCss( { props, resolve, signal }: PropsToCssArgs ) {\n\tconst transformed = await resolve( { props, signal } );\n\n\treturn Object.entries( transformed )\n\t\t.reduce< string[] >( ( acc, [ propName, propValue ] ) => {\n\t\t\tacc.push( propName + ':' + propValue + ';' );\n\n\t\t\treturn acc;\n\t\t}, [] )\n\t\t.join( '' );\n}\n\nfunction wrapCssWithStyleElement( id: string, css: string ) {\n\treturn `<style data-style-id=\"${ id }\">${ css }</style>`;\n}\n","import { type CanvasExtendedWindow, type EnqueueFont } from './types';\n\nexport const enqueueFont: EnqueueFont = ( fontFamily, context = 'preview' ) => {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.helpers?.enqueueFont?.( fontFamily, context ) ?? null;\n};\n","import type { CanvasExtendedWindow } from './types';\n\nexport function getCanvasIframeBody() {\n\tconst extendedWindow = window as unknown as CanvasExtendedWindow;\n\n\treturn extendedWindow.elementor?.$preview?.[ 0 ]?.contentDocument?.body;\n}\n","import { init } from './init';\n\nexport { styleTransformersRegistry } from './style-transformers-registry';\n\ninit();\n"],"mappings":"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","names":["React","size","size","size"]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elementor/editor-canvas",
   "description": "Elementor Editor Canvas",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -36,16 +36,16 @@
     "react": "^18.3.1"
   },
   "dependencies": {
-    "@elementor/editor": "0.18.1",
-    "@elementor/editor-elements": "0.6.0",
-    "@elementor/editor-props": "0.9.3",
-    "@elementor/editor-responsive": "0.13.1",
-    "@elementor/editor-styles": "0.6.0",
-    "@elementor/editor-styles-repository": "0.7.3",
-    "@elementor/editor-v1-adapters": "0.10.1",
+    "@elementor/editor": "0.18.2",
+    "@elementor/editor-elements": "0.6.2",
+    "@elementor/editor-props": "0.10.0",
+    "@elementor/editor-responsive": "0.13.2",
+    "@elementor/editor-styles": "0.6.2",
+    "@elementor/editor-styles-repository": "0.7.5",
+    "@elementor/editor-v1-adapters": "0.10.2",
     "@elementor/ui": "1.26.0",
     "@elementor/utils": "0.4.0",
-    "@elementor/wp-media": "0.4.2",
+    "@elementor/wp-media": "0.5.0",
     "@floating-ui/react": "^0.26.28"
   },
   "devDependencies": {

package/src/__tests__/__mocks__/styles-schema.ts

@@ -94,7 +94,7 @@ export const stylesSchemaMock = {
 				meta: {},
 				settings: {},
 			},
-			top: {
+			'block-start': {
 				kind: 'union',
 				default: null,
 				meta: {},
@@ -139,7 +139,7 @@ export const stylesSchemaMock = {
 					},
 				},
 			},
-			right: {
+			'block-end': {
 				kind: 'union',
 				default: null,
 				meta: {},
@@ -184,7 +184,7 @@ export const stylesSchemaMock = {
 					},
 				},
 			},
-			bottom: {
+			'inline-start': {
 				kind: 'union',
 				default: null,
 				meta: {},
@@ -229,7 +229,7 @@ export const stylesSchemaMock = {
 					},
 				},
 			},
-			left: {
+			'inline-end': {
 				kind: 'union',
 				default: null,
 				meta: {},
@@ -440,7 +440,7 @@ export const stylesSchemaMock = {
 		meta: {},
 		settings: {},
 		shape: {
-			top: {
+			'block-start': {
 				kind: 'object',
 				key: 'size',
 				default: null,
@@ -468,7 +468,7 @@ export const stylesSchemaMock = {
 					},
 				},
 			},
-			right: {
+			'block-end': {
 				kind: 'object',
 				key: 'size',
 				default: null,
@@ -496,7 +496,7 @@ export const stylesSchemaMock = {
 					},
 				},
 			},
-			bottom: {
+			'inline-start': {
 				kind: 'object',
 				key: 'size',
 				default: null,
@@ -524,7 +524,7 @@ export const stylesSchemaMock = {
 					},
 				},
 			},
-			left: {
+			'inline-end': {
 				kind: 'object',
 				key: 'size',
 				default: null,
@@ -908,12 +908,72 @@ export const stylesSchemaMock = {
 							meta: {},
 							settings: {},
 							shape: {
-								color: {
+								type: {
 									kind: 'plain',
-									key: 'color',
+									key: 'string',
+									default: null,
+									meta: {},
+									settings: {
+										enum: [ 'linear', 'radial' ],
+									},
+								},
+								angle: {
+									kind: 'plain',
+									key: 'number',
+									default: null,
+									meta: {},
+									settings: {
+										required: true,
+									},
+								},
+								positions: {
+									kind: 'plain',
+									key: 'string',
+									default: null,
+									meta: {},
+									settings: {
+										enum: [
+											'center center',
+											'center left',
+											'center right',
+											'top center',
+											'top left',
+											'top right',
+											'bottom center',
+											'bottom left',
+											'bottom right',
+										],
+									},
+								},
+								stops: {
+									kind: 'array',
+									key: 'gradient-color-stop',
 									default: null,
 									meta: {},
 									settings: {},
+									item_prop_type: {
+										kind: 'object',
+										key: 'color-stop',
+										default: null,
+										meta: {},
+										settings: {},
+										shape: {
+											color: {
+												kind: 'plain',
+												key: 'color',
+												default: null,
+												meta: {},
+												settings: {},
+											},
+											offset: {
+												kind: 'plain',
+												key: 'number',
+												default: null,
+												meta: {},
+												settings: {},
+											},
+										},
+									},
 								},
 							},
 						},

package/src/__tests__/styles-prop-resolver.test.ts

@@ -1,6 +1,7 @@
 import { styleTransformersRegistry } from '@elementor/editor-canvas';
 import {
 	backgroundColorOverlayPropTypeUtil,
+	backgroundGradientOverlayPropTypeUtil,
 	backgroundImageOverlayPropTypeUtil,
 	backgroundImagePositionOffsetPropTypeUtil,
 	backgroundImageSizeScalePropTypeUtil,
@@ -10,11 +11,14 @@ import {
 	borderWidthPropTypeUtil,
 	boxShadowPropTypeUtil,
 	colorPropTypeUtil,
+	colorStopPropTypeUtil,
 	dimensionsPropTypeUtil,
+	gradientColorStopPropTypeUtil,
 	imageAttachmentIdPropType,
 	imagePropTypeUtil,
 	imageSrcPropTypeUtil,
 	layoutDirectionPropTypeUtil,
+	numberPropTypeUtil,
 	type Props,
 	shadowPropTypeUtil,
 	sizePropTypeUtil,
@@ -84,43 +88,43 @@ describe( 'styles prop resolver', () => {
 			name: 'linked-dimensional',
 			props: {
 				margin: dimensionsPropTypeUtil.create( {
-					top: sizePropTypeUtil.create( {
+					'block-start': sizePropTypeUtil.create( {
 						size: 10,
 						unit: 'px',
 					} ),
-					right: sizePropTypeUtil.create( {
+					'block-end': sizePropTypeUtil.create( {
 						size: 20,
 						unit: 'px',
 					} ),
-					bottom: sizePropTypeUtil.create( {
+					'inline-start': sizePropTypeUtil.create( {
 						size: 30,
 						unit: 'px',
 					} ),
-					left: stringPropTypeUtil.create( 'auto' ),
+					'inline-end': stringPropTypeUtil.create( 'auto' ),
 				} ),
 			},
 			expected: {
-				'margin-top': '10px',
-				'margin-right': '20px',
-				'margin-bottom': '30px',
-				'margin-left': 'auto',
+				'margin-block-start': '10px',
+				'margin-block-end': '20px',
+				'margin-inline-start': '30px',
+				'margin-inline-end': 'auto',
 			},
 		},
 		{
 			name: 'border-width',
 			props: {
 				'border-width': borderWidthPropTypeUtil.create( {
-					top: sizePropTypeUtil.create( { size: 10, unit: 'px' } ),
-					right: sizePropTypeUtil.create( { size: 20, unit: 'px' } ),
-					bottom: sizePropTypeUtil.create( { size: 30, unit: 'px' } ),
-					left: sizePropTypeUtil.create( { size: 40, unit: 'px' } ),
+					'block-start': sizePropTypeUtil.create( { size: 10, unit: 'px' } ),
+					'block-end': sizePropTypeUtil.create( { size: 20, unit: 'px' } ),
+					'inline-start': sizePropTypeUtil.create( { size: 30, unit: 'px' } ),
+					'inline-end': sizePropTypeUtil.create( { size: 40, unit: 'px' } ),
 				} ),
 			},
 			expected: {
-				'border-top-width': '10px',
-				'border-right-width': '20px',
-				'border-bottom-width': '30px',
-				'border-left-width': '40px',
+				'border-block-start-width': '10px',
+				'border-block-end-width': '20px',
+				'border-inline-start-width': '30px',
+				'border-inline-end-width': '40px',
 			},
 		},
 		{
@@ -283,6 +287,53 @@ describe( 'styles prop resolver', () => {
 				background: 'url(medium_large-image-url-123) repeat-x,url(thumbnail-image-url-123) fixed',
 			},
 		},
+		{
+			name: 'background (only gradient)',
+			props: {
+				background: backgroundPropTypeUtil.create( {
+					'background-overlay': backgroundOverlayPropTypeUtil.create( [
+						backgroundGradientOverlayPropTypeUtil.create( {
+							type: stringPropTypeUtil.create( 'linear' ),
+							angle: numberPropTypeUtil.create( 190 ),
+							stops: gradientColorStopPropTypeUtil.create( [
+								colorStopPropTypeUtil.create( {
+									color: colorPropTypeUtil.create( 'red' ),
+									offset: numberPropTypeUtil.create( 10 ),
+								} ),
+								colorStopPropTypeUtil.create( {
+									color: colorPropTypeUtil.create( 'yellow' ),
+									offset: numberPropTypeUtil.create( 40 ),
+								} ),
+								colorStopPropTypeUtil.create( {
+									color: colorPropTypeUtil.create( 'rgb(255,0,255)' ),
+									offset: numberPropTypeUtil.create( 87 ),
+								} ),
+							] ),
+						} ),
+						backgroundGradientOverlayPropTypeUtil.create( {
+							type: stringPropTypeUtil.create( 'radial' ),
+							angle: numberPropTypeUtil.create( 95 ),
+							stops: gradientColorStopPropTypeUtil.create( [
+								colorStopPropTypeUtil.create( {
+									color: colorPropTypeUtil.create( 'rgb(0,190,245,0.7)' ),
+									offset: numberPropTypeUtil.create( 60 ),
+								} ),
+								colorStopPropTypeUtil.create( {
+									color: colorPropTypeUtil.create( 'rgb(255,0,255)' ),
+									offset: numberPropTypeUtil.create( 93 ),
+								} ),
+							] ),
+							positions: stringPropTypeUtil.create( 'bottom left' ),
+						} ),
+					] ),
+				} ),
+			},
+			expected: {
+				background:
+					'linear-gradient(190deg, red 10%,yellow 40%,rgb(255,0,255) 87%),' +
+					'radial-gradient(circle at bottom left, rgb(0,190,245,0.7) 60%,rgb(255,0,255) 93%)',
+			},
+		},
 	] )( 'it should resolve props for `$name`', async ( { prepare, props, expected } ) => {
 		// Arrange.
 		prepare?.();

package/src/components/__tests__/elements-overlays.test.tsx

@@ -1,10 +1,7 @@
 import * as React from 'react';
 import { createDOMElement, createMockElementType } from 'test-utils';
 import { useElementsDomRef, useSelectedElement } from '@elementor/editor-elements';
-import {
-	__privateUseIsPreviewMode as useIsPreviewMode,
-	__privateUseIsRouteActive as useIsRouteActive,
-} from '@elementor/editor-v1-adapters';
+import { __privateUseIsRouteActive as useIsRouteActive, useEditMode } from '@elementor/editor-v1-adapters';
 import { render, screen } from '@testing-library/react';
 
 import { CANVAS_WRAPPER_ID } from '../element-overlay';
@@ -48,7 +45,7 @@ describe( '<ElementsOverlays />', () => {
 			} )
 		);
 
-		jest.mocked( useIsPreviewMode ).mockReturnValue( false );
+		jest.mocked( useEditMode ).mockReturnValue( 'edit' );
 		jest.mocked( useIsRouteActive ).mockReturnValue( false );
 
 		jest.mocked( useElementsDomRef ).mockImplementation( () => atomicElements );
@@ -103,7 +100,7 @@ describe( '<ElementsOverlays />', () => {
 		},
 	] )( 'should not render overlays if $message', ( { payload } ) => {
 		// Arrange.
-		jest.mocked( useIsPreviewMode ).mockReturnValue( payload.isPreviewMode );
+		jest.mocked( useEditMode ).mockReturnValue( payload.isPreviewMode ? 'preview' : 'edit' );
 		jest.mocked( useIsRouteActive ).mockReturnValue( payload.isKitRouteActive );
 
 		jest.mocked( useSelectedElement ).mockReturnValue(

package/src/components/elements-overlays.tsx

@@ -1,20 +1,18 @@
 import * as React from 'react';
 import { useElementsDomRef, useSelectedElement } from '@elementor/editor-elements';
-import {
-	__privateUseIsPreviewMode as useIsPreviewMode,
-	__privateUseIsRouteActive as useIsRouteActive,
-} from '@elementor/editor-v1-adapters';
+import { __privateUseIsRouteActive as useIsRouteActive, useEditMode } from '@elementor/editor-v1-adapters';
 
 import { ElementOverlay } from './element-overlay';
 
 export function ElementsOverlays() {
 	const selected = useSelectedElement();
 	const domElements = useElementsDomRef();
+	const currentEditMode = useEditMode();
 
-	const isPreviewMode = useIsPreviewMode();
+	const isEditMode = currentEditMode === 'edit';
 	const isKitRouteActive = useIsRouteActive( 'panel/global' );
 
-	const isActive = ! isPreviewMode && ! isKitRouteActive;
+	const isActive = isEditMode && ! isKitRouteActive;
 
 	return (
 		isActive &&

package/src/init-style-transformers.ts

@@ -1,9 +1,11 @@
 import { styleTransformersRegistry } from './style-transformers-registry';
 import { backgroundColorOverlayTransformer } from './transformers/styles/background-color-overlay-transformer';
+import { backgroundGradientOverlayTransformer } from './transformers/styles/background-gradient-overlay-transformer';
 import { backgroundImageOverlayTransformer } from './transformers/styles/background-image-overlay-transformer';
 import { backgroundImagePositionOffsetTransformer } from './transformers/styles/background-image-position-offset-transformer';
 import { backgroundImageSizeScaleTransformer } from './transformers/styles/background-image-size-scale-transformer';
 import { backgroundTransformer } from './transformers/styles/background-transformer';
+import { colorStopTransformer } from './transformers/styles/color-stop-transformer';
 import { createCombineArrayTransformer } from './transformers/styles/create-combine-array-transformer';
 import { createMultiPropsTransformer } from './transformers/styles/create-multi-props-transformer';
 import { imageAttachmentTransformer } from './transformers/styles/image-attachment-transformer';
@@ -22,7 +24,7 @@ export function initStyleTransformers() {
 		.register(
 			'dimensions',
 			createMultiPropsTransformer(
-				[ 'top', 'right', 'bottom', 'left' ],
+				[ 'block-start', 'block-end', 'inline-start', 'inline-end' ],
 				( { propKey, key } ) => `${ propKey }-${ key }`
 			)
 		)
@@ -35,6 +37,9 @@ export function initStyleTransformers() {
 		.register( 'background-overlay', createCombineArrayTransformer( ',' ) )
 		.register( 'background-color-overlay', backgroundColorOverlayTransformer )
 		.register( 'background-image-overlay', backgroundImageOverlayTransformer )
+		.register( 'background-gradient-overlay', backgroundGradientOverlayTransformer )
+		.register( 'gradient-color-stop', createCombineArrayTransformer( ',' ) )
+		.register( 'color-stop', colorStopTransformer )
 		.register( 'background-image-position-offset', backgroundImagePositionOffsetTransformer )
 		.register( 'background-image-size-scale', backgroundImageSizeScaleTransformer )
 		.register( 'image-attachment-id', imageAttachmentTransformer )
@@ -46,7 +51,10 @@ export function initStyleTransformers() {
 		)
 		.register(
 			'border-width',
-			createMultiPropsTransformer( [ 'top', 'right', 'bottom', 'left' ], ( { key } ) => `border-${ key }-width` )
+			createMultiPropsTransformer(
+				[ 'block-start', 'block-end', 'inline-start', 'inline-end' ],
+				( { key } ) => `border-${ key }-width`
+			)
 		)
 		.register(
 			'border-radius',

package/src/transformers/styles/background-gradient-overlay-transformer.ts

@@ -0,0 +1,16 @@
+import { createTransformer } from '../create-transformer';
+
+type BackgroundGradientOverlay = {
+	type?: 'linear' | 'radial';
+	angle?: string;
+	stops?: string;
+	positions?: string;
+};
+
+export const backgroundGradientOverlayTransformer = createTransformer( ( value: BackgroundGradientOverlay ) => {
+	if ( value.type === 'radial' ) {
+		return `radial-gradient(circle at ${ value.positions }, ${ value.stops })`;
+	}
+
+	return `linear-gradient(${ value.angle }deg, ${ value.stops })`;
+} );

package/src/transformers/styles/color-stop-transformer.ts

@@ -0,0 +1,10 @@
+import { createTransformer } from '../create-transformer';
+
+type ColorStop = {
+	color?: string;
+	offset?: number;
+};
+
+export const colorStopTransformer = createTransformer(
+	( value: ColorStop ) => `${ value?.color } ${ value?.offset ?? 0 }%`
+);