@elementor/editor-editing-panel 0.8.0 → 0.9.0

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.9.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-editing-panel@0.8.0...@elementor/editor-editing-panel@0.9.0) (2024-08-06)
+
+### Features
+
+- **editor-style:** style renderer package for atomic widgets [EDS-278] ([#213](https://github.com/elementor/elementor-packages/issues/213)) ([f80501b](https://github.com/elementor/elementor-packages/commit/f80501b17567fe3bb427655ee77013a61168f88f))
+
 # [0.8.0](https://github.com/elementor/elementor-packages/compare/@elementor/editor-editing-panel@0.7.0...@elementor/editor-editing-panel@0.8.0) (2024-08-06)
 
 ### Features

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/panel.ts","../src/components/editing-panel/editing-panel.tsx","../src/hooks/use-selected-elements.ts","../src/sync/get-selected-elements.ts","../src/hooks/use-element-type.ts","../src/sync/get-widgets-cache.ts","../src/contexts/element-context.tsx","../src/components/editing-panel/editing-panel-tabs.tsx","../src/components/editing-panel/settings-tab.tsx","../src/components/controls/settings-control.tsx","../src/contexts/control-context.tsx","../src/hooks/use-widget-settings.ts","../src/sync/get-container.ts","../src/sync/update-settings.ts","../src/components/controls/collapsible-section.tsx","../src/components/controls/control-types/select-control.tsx","../src/components/controls/control-types/text-area-control.tsx","../src/components/controls/control-types/text-control.tsx","../src/components/controls/get-control-by-type.ts","../src/components/editing-panel/style-tab/style-tab.tsx","../src/contexts/style-context.tsx","../src/hooks/use-element-styles.ts","../src/sync/get-element-styles.ts","../src/components/editing-panel/style-tab/sections/size.tsx","../src/components/controls/style-control.tsx","../src/sync/update-style.ts","../src/hooks/use-element-style-prop.ts","../src/components/controls/control-types/size-control.tsx","../src/init.ts","../src/sync/should-use-v2-panel.ts","../src/hooks/use-open-editor-panel.ts","../src/components/editing-panel/editing-panel-hooks.tsx","../src/index.ts"],"sourcesContent":["import { __createPanel as createPanel } from '@elementor/editor-panels';\nimport { EditingPanel } from './components/editing-panel/editing-panel';\n\nexport const { panel, usePanelActions, usePanelStatus } = createPanel( {\n\tid: 'editing-panel',\n\tcomponent: EditingPanel,\n} );\n","import * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport useSelectedElements from '../../hooks/use-selected-elements';\nimport useElementType from '../../hooks/use-element-type';\nimport { Panel, PanelBody, PanelHeader, PanelHeaderTitle } from '@elementor/editor-panels';\nimport { ElementContext } from '../../contexts/element-context';\nimport { EditingPanelTabs } from './editing-panel-tabs';\n\nexport const EditingPanel = () => {\n\tconst elements = useSelectedElements();\n\n\tconst [ selectedElement ] = elements;\n\n\tconst elementType = useElementType( selectedElement?.type );\n\n\tif ( elements.length !== 1 || ! elementType ) {\n\t\treturn null;\n\t}\n\n\t/* translators: %s: Element type title. */\n\tconst panelTitle = __( 'Edit %s', 'elementor' ).replace( '%s', elementType.title );\n\n\treturn (\n\t\t<Panel>\n\t\t\t<PanelHeader>\n\t\t\t\t<PanelHeaderTitle>{ panelTitle }</PanelHeaderTitle>\n\t\t\t</PanelHeader>\n\t\t\t<PanelBody>\n\t\t\t\t<ElementContext element={ selectedElement }>\n\t\t\t\t\t<EditingPanelTabs />\n\t\t\t\t</ElementContext>\n\t\t\t</PanelBody>\n\t\t</Panel>\n\t);\n};\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getSelectedElements from '../sync/get-selected-elements';\n\nexport default function useSelectedElements() {\n\treturn useListenTo(\n\t\t[ commandEndEvent( 'document/elements/select' ), commandEndEvent( 'document/elements/deselect' ) ],\n\t\t() => getSelectedElements()\n\t);\n}\n","import { ExtendedWindow } from './types';\nimport { Element } from '../types';\n\nexport default function getSelectedElements(): Element[] {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\tconst selectedElements = extendedWindow.elementor?.selection?.getElements?.() ?? [];\n\n\treturn selectedElements.reduce< Element[] >( ( acc, el ) => {\n\t\tconst type = el.model.get( 'widgetType' ) || el.model.get( 'elType' );\n\n\t\tif ( type ) {\n\t\t\tacc.push( {\n\t\t\t\tid: el.model.get( 'id' ),\n\t\t\t\ttype,\n\t\t\t} );\n\t\t}\n\n\t\treturn acc;\n\t}, [] );\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getWidgetsCache from '../sync/get-widgets-cache';\nimport { ElementType } from '../types';\n\nexport default function useElementType( type?: string ) {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'editor/documents/load' ),\n\t\t(): ElementType | null => {\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst widgetsCache = getWidgetsCache();\n\t\t\tconst elementType = widgetsCache?.[ type ];\n\n\t\t\tif ( ! elementType?.atomic_controls ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tkey: type,\n\t\t\t\tcontrols: elementType.atomic_controls,\n\t\t\t\ttitle: elementType.title,\n\t\t\t};\n\t\t},\n\t\t[ type ]\n\t);\n}\n","import { ExtendedWindow } from './types';\n\nexport default function getWidgetsCache() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow?.elementor?.widgetsCache || null;\n}\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { Element } from '../types';\n\ntype ContextValue = {\n\telement: Element;\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\telement: Element;\n\tchildren?: ReactNode;\n};\n\nexport function ElementContext( { children, element }: Props ) {\n\treturn <Context.Provider value={ { element } }>{ children }</Context.Provider>;\n}\n\nexport function useElementContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'useElementContext must be used within a ElementContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { Stack, Tabs, Tab, TabPanel, useTabs } from '@elementor/ui';\nimport * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport { SettingsTab } from './settings-tab';\nimport { StyleTab } from './style-tab/style-tab';\n\ntype TabValue = 'settings' | 'style';\n\nexport const EditingPanelTabs = () => {\n\tconst { getTabProps, getTabPanelProps, getTabsProps } = useTabs< TabValue >( 'settings' );\n\n\treturn (\n\t\t<Stack direction=\"column\" sx={ { width: '100%' } }>\n\t\t\t<Tabs variant=\"fullWidth\" indicatorColor=\"secondary\" textColor=\"inherit\" { ...getTabsProps() }>\n\t\t\t\t<Tab label={ __( 'General', 'elementor' ) } { ...getTabProps( 'settings' ) } />\n\t\t\t\t<Tab label={ __( 'Style', 'elementor' ) } { ...getTabProps( 'style' ) } />\n\t\t\t</Tabs>\n\t\t\t<TabPanel { ...getTabPanelProps( 'settings' ) } disablePadding>\n\t\t\t\t<SettingsTab />\n\t\t\t</TabPanel>\n\t\t\t<TabPanel { ...getTabPanelProps( 'style' ) } disablePadding>\n\t\t\t\t<StyleTab />\n\t\t\t</TabPanel>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { Stack } from '@elementor/ui';\nimport { SettingsControl } from '../controls/settings-control';\nimport { useElementContext } from '../../contexts/element-context';\nimport useElementType from '../../hooks/use-element-type';\nimport type { Control } from '../../types';\nimport { CollapsibleSection } from '../controls/collapsible-section';\nimport { getControlByType } from '../controls/get-control-by-type';\n\nexport const SettingsTab = () => {\n\tconst { element } = useElementContext();\n\n\tconst elementType = useElementType( element?.type );\n\n\tif ( ! elementType ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Stack>\n\t\t\t{ elementType.controls.map( ( { type, value }, index ) => {\n\t\t\t\tif ( type === 'control' ) {\n\t\t\t\t\treturn <Control key={ value.bind } control={ value } />;\n\t\t\t\t}\n\n\t\t\t\tif ( type === 'section' ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CollapsibleSection key={ type + '.' + index } title={ value.label }>\n\t\t\t\t\t\t\t{ value.items?.map( ( item ) => {\n\t\t\t\t\t\t\t\tif ( item.type === 'control' ) {\n\t\t\t\t\t\t\t\t\treturn <Control key={ item.value.bind } control={ item.value } />;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t// TODO: Handle 2nd level sections\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</CollapsibleSection>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn null;\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n};\n\n// TODO: Create control wrapper by type for different layouts.\nconst Control = ( { control }: { control: Control[ 'value' ] } ) => {\n\tconst ControlComponent = getControlByType( control.type );\n\n\tif ( ! ControlComponent ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SettingsControl bind={ control.bind }>\n\t\t\t<SettingsControl.Label>{ control.label }</SettingsControl.Label>\n\t\t\t<ControlComponent\n\t\t\t\t/* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n\t\t\t\t{ ...( control.props as any ) }\n\t\t\t/>\n\t\t</SettingsControl>\n\t);\n};\n","import * as React from 'react';\nimport { ControlContext } from '../../contexts/control-context';\nimport { Stack, styled, Typography } from '@elementor/ui';\nimport { PropKey, PropValue } from '../../types';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useWidgetSettings } from '../../hooks/use-widget-settings';\nimport { updateSettings } from '../../sync/update-settings';\n\ntype Props = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nexport const SettingsControlProvider = ( { bind, children }: Props ) => {\n\tconst { element } = useElementContext();\n\tconst value = useWidgetSettings( { id: element.id, bind } );\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateSettings( {\n\t\t\tid: element.id,\n\t\t\tprops: {\n\t\t\t\t[ bind ]: newValue,\n\t\t\t},\n\t\t} );\n\t};\n\n\treturn <ControlContext.Provider value={ { setValue, value, bind } }>{ children }</ControlContext.Provider>;\n};\n\nconst SettingsControl = ( { children, bind }: Props ) => (\n\t<SettingsControlProvider bind={ bind }>\n\t\t<StyledStack gap={ 1 } direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" flexWrap=\"wrap\">\n\t\t\t{ children }\n\t\t</StyledStack>\n\t</SettingsControlProvider>\n);\n\nconst StyledStack = styled( Stack )`\n\t& > * {\n\t\tflex-grow: 1;\n\t}\n\n\t& > label {\n\t\tmin-width: 50%;\n\t}\n`;\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nSettingsControl.Label = Label;\n\nexport { SettingsControl };\n","import { createContext, useContext } from 'react';\nimport { PropKey, PropValue } from '../types';\n\nexport type ControlContext< T extends PropValue > = {\n\tbind: PropKey;\n\tsetValue: ( value: T ) => void;\n\tvalue: T;\n};\n\nexport const ControlContext = createContext< ControlContext< PropValue > | null >( null );\n\nexport function useControl< T extends PropValue >(): ControlContext< T | undefined >;\nexport function useControl< T extends PropValue >( defaultValue: T ): ControlContext< T >;\nexport function useControl< T extends PropValue >( defaultValue?: T ) {\n\tconst controlContext = useContext< ControlContext< T > >( ControlContext as never );\n\n\tif ( ! controlContext ) {\n\t\tthrow new Error( 'useControl must be used within a ControlContext' );\n\t}\n\n\treturn { ...controlContext, value: controlContext.value ?? defaultValue };\n}\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { PropValue } from '../types';\nimport getContainer from '../sync/get-container';\n\nexport const useWidgetSettings = ( { id, bind }: { id: string; bind: string } ): PropValue => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t() => {\n\t\t\tconst container = getContainer( id );\n\t\t\tconst value = container?.settings?.get( bind ) ?? null;\n\n\t\t\treturn value;\n\t\t},\n\t\t[ id, bind ]\n\t);\n};\n","import { ExtendedWindow } from './types';\n\nexport default function getContainer( id: string ) {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\tconst container = extendedWindow.elementor?.getContainer?.( id );\n\n\treturn container ?? null;\n}\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { Props } from '../types';\nimport getContainer from './get-container';\n\nexport const updateSettings = ( { id, props }: { id: string; props: Props } ) => {\n\tconst container = getContainer( id );\n\n\trunCommand( 'document/elements/settings', {\n\t\tcontainer,\n\t\tsettings: {\n\t\t\t...props,\n\t\t},\n\t} );\n};\n","import * as React from 'react';\nimport { useId } from 'react';\nimport { Accordion, AccordionSummary, AccordionDetails, AccordionSummaryText, Stack } from '@elementor/ui';\n\nexport type CollapsibleSectionProps = React.PropsWithChildren< {\n\ttitle: React.ReactNode;\n} >;\n\nexport const CollapsibleSection = ( { title, children }: CollapsibleSectionProps ) => {\n\tconst uid = useId();\n\tconst labelId = `label-${ uid }`;\n\tconst contentId = `content-${ uid }`;\n\n\t// TODO: Change to collapsible list item\n\treturn (\n\t\t<Accordion disableGutters defaultExpanded>\n\t\t\t<AccordionSummary aria-controls={ contentId } id={ labelId }>\n\t\t\t\t<AccordionSummaryText primaryTypographyProps={ { variant: 'caption' } }>{ title }</AccordionSummaryText>\n\t\t\t</AccordionSummary>\n\t\t\t<AccordionDetails id={ contentId } aria-labelledby={ labelId }>\n\t\t\t\t<Stack gap={ 2.5 }>{ children }</Stack>\n\t\t\t</AccordionDetails>\n\t\t</Accordion>\n\t);\n};\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { PropValue } from '../../../types';\n\ntype Props< T > = {\n\toptions: Array< { label: string; value: T; disabled?: boolean } >;\n};\n\nexport const SelectControl = < T extends PropValue >( { options }: Props< T > ) => {\n\tconst { value, setValue } = useControl< T >();\n\n\tconst handleChange = ( event: SelectChangeEvent< T > ) => {\n\t\tsetValue( event.target.value as T );\n\t};\n\n\treturn (\n\t\t<Select size=\"tiny\" value={ value ?? '' } onChange={ handleChange }>\n\t\t\t{ options.map( ( { label, ...props } ) => (\n\t\t\t\t<MenuItem key={ props.value } { ...props }>\n\t\t\t\t\t{ label }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</Select>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\ntype Props = {\n\tplaceholder?: string;\n};\n\nexport const TextAreaControl = ( { placeholder }: Props ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tsetValue( event.target.value );\n\t};\n\n\treturn (\n\t\t<TextField\n\t\t\tsize=\"tiny\"\n\t\t\tmultiline\n\t\t\tfullWidth\n\t\t\trows={ 5 }\n\t\t\tvalue={ value }\n\t\t\tonChange={ handleChange }\n\t\t\tplaceholder={ placeholder }\n\t\t/>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\nexport const TextControl = ( { placeholder }: { placeholder?: string } ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => setValue( event.target.value );\n\n\treturn <TextField type=\"text\" size=\"tiny\" value={ value } onChange={ handleChange } placeholder={ placeholder } />;\n};\n","import { SelectControl } from './control-types/select-control';\nimport { TextAreaControl } from './control-types/text-area-control';\nimport { TextControl } from './control-types/text-control';\n\nconst controlTypes = {\n\tselect: SelectControl,\n\ttext: TextControl,\n\ttextarea: TextAreaControl,\n};\n\nexport const getControlByType = ( type: string ) => {\n\treturn controlTypes[ type as keyof typeof controlTypes ] ?? null;\n};\n","import * as React from 'react';\nimport { StyleContext } from '../../../contexts/style-context';\nimport { useElementContext } from '../../../contexts/element-context';\nimport { useElementStyles } from '../../../hooks/use-element-styles';\nimport { Stack } from '@elementor/ui';\nimport { SizeSection } from './sections/size';\n\nexport const StyleTab = () => {\n\tconst { element } = useElementContext();\n\tconst elementStyles = useElementStyles( element.id );\n\t// TODO: Handle selected style state.\n\tconst [ selectedStyleDef = null ] = Object.values( elementStyles || {} );\n\n\treturn (\n\t\t<StyleContext selectedStyleDef={ selectedStyleDef }>\n\t\t\t<Stack>\n\t\t\t\t<SizeSection />\n\t\t\t</Stack>\n\t\t</StyleContext>\n\t);\n};\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { StyleDefinition, StyleDefMeta } from '../types';\nimport { useActiveBreakpoint } from '@elementor/editor-responsive';\n\ntype ContextValue = {\n\tselectedStyleDef: StyleDefinition | null;\n\tselectedMeta: StyleDefMeta;\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\tchildren: ReactNode;\n\tselectedStyleDef: StyleDefinition | null;\n};\n\nexport function StyleContext( { children, selectedStyleDef }: Props ) {\n\tconst breakpoint = useActiveBreakpoint();\n\t// TODO: Handle state when we support it.\n\tconst selectedMeta = { breakpoint, state: null } as const;\n\n\treturn <Context.Provider value={ { selectedStyleDef, selectedMeta } }>{ children }</Context.Provider>;\n}\n\nexport function useStyleContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'UseStyleContext must be used within a StyleContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport { getElementStyles } from '../sync/get-element-styles';\nimport { ElementID } from '../types';\n\nexport const useElementStyles = ( elementID: ElementID ) => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\treturn getElementStyles( elementID );\n\t\t},\n\t\t[ elementID ]\n\t);\n};\n","import getContainer from './get-container';\nimport { ElementID, StyleDefinition } from '../types';\n\nexport const getElementStyles = ( elementID: ElementID ): Record< string, StyleDefinition > | null => {\n\tconst container = getContainer( elementID );\n\n\treturn container?.model.get( 'styles' ) || null;\n};\n","import * as React from 'react';\nimport { CollapsibleSection } from '../../../controls/collapsible-section';\nimport { StyleControl, StyleControlProps } from '../../../controls/style-control';\nimport { SizeControl, Unit } from '../../../controls/control-types/size-control';\nimport { Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nexport const SizeSection = () => {\n\treturn (\n\t\t<CollapsibleSection title={ __( 'Size', 'elementor' ) }>\n\t\t\t<Stack gap={ 1.5 }>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"width\" label={ __( 'Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"height\" label={ __( 'Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"min-width\" label={ __( 'Min. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"min-height\" label={ __( 'Min. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"max-width\" label={ __( 'Max. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"max-height\" label={ __( 'Max. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t</CollapsibleSection>\n\t);\n};\n\nconst units: Unit[] = [ 'px', '%', 'em', 'rem', 'vw' ];\n\ntype ControlProps = {\n\tbind: StyleControlProps[ 'bind' ];\n\tlabel: string;\n};\n\nconst Control = ( { label, bind }: ControlProps ) => {\n\treturn (\n\t\t<StyleControl bind={ bind }>\n\t\t\t<Stack gap={ 1 } sx={ { flex: '0 1 50%' } }>\n\t\t\t\t<StyleControl.Label>{ label }</StyleControl.Label>\n\t\t\t\t<SizeControl units={ units } />\n\t\t\t</Stack>\n\t\t</StyleControl>\n\t);\n};\n","import * as React from 'react';\nimport { PropKey, PropValue } from '../../types';\nimport { ControlContext } from '../../contexts/control-context';\nimport { updateStyle } from '../../sync/update-style';\nimport { useElementStyleProp } from '../../hooks/use-element-style-prop';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useStyleContext } from '../../contexts/style-context';\nimport { Typography } from '@elementor/ui';\n\nexport type StyleControlProps = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nconst StyleControl = ( { bind, children }: StyleControlProps ) => {\n\tconst { element } = useElementContext();\n\tconst { selectedStyleDef, selectedMeta } = useStyleContext();\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateStyle( {\n\t\t\telementID: element.id,\n\t\t\tstyleDefID: selectedStyleDef?.id,\n\t\t\tprops: { [ bind ]: newValue },\n\t\t\tmeta: selectedMeta,\n\t\t} );\n\t};\n\n\tconst value = useElementStyleProp( {\n\t\telementID: element.id,\n\t\tstyleDefID: selectedStyleDef?.id,\n\t\tmeta: selectedMeta,\n\t\tpropName: bind,\n\t} );\n\n\treturn <ControlContext.Provider value={ { bind, value, setValue } }>{ children }</ControlContext.Provider>;\n};\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nStyleControl.Label = Label;\n\nexport { StyleControl };\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, Props, StyleDefID, StyleDefMeta } from '../types';\nimport getContainer from './get-container';\n\nexport type UpdateStyleProps = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefID;\n\tmeta: StyleDefMeta;\n\tprops: Props;\n\tbind?: PropKey;\n};\n\nexport const updateStyle = ( { elementID, styleDefID, meta, props, bind = 'classes' }: UpdateStyleProps ) => {\n\tconst container = getContainer( elementID );\n\n\trunCommand( 'document/atomic-widgets/styles', {\n\t\tcontainer,\n\t\tstyleDefID,\n\t\tbind,\n\t\tmeta,\n\t\tprops,\n\t} );\n};\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, PropValue, StyleDefID, StyleDefinition, StyleDefMeta } from '../types';\nimport { getElementStyles } from '../sync/get-element-styles';\n\nexport type UseElementStylePropArgs = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefID;\n\tmeta: StyleDefMeta;\n\tpropName: PropKey;\n};\n\nexport const useElementStyleProp = < T extends PropValue >( {\n\telementID,\n\tstyleDefID,\n\tmeta,\n\tpropName,\n}: UseElementStylePropArgs ): T | null => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\t// TODO: return default value for style prop\n\t\t\tif ( ! styleDefID ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst styleDef = getElementStyles( elementID )?.[ styleDefID ];\n\n\t\t\tif ( ! styleDef ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( styleDef, meta );\n\n\t\t\treturn variant?.props[ propName ] ?? null;\n\t\t},\n\t\t[ elementID, styleDefID, propName, meta ]\n\t) as T;\n};\n\nfunction getVariantByMeta( styleDef: StyleDefinition, meta: StyleDefMeta ) {\n\treturn styleDef.variants.find( ( variant ) => {\n\t\treturn variant.meta.breakpoint === meta.breakpoint && variant.meta.state === meta.state;\n\t} );\n}\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent, Stack, TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { TransformablePropValue } from '../../../types';\n\nexport type SizeControlProps = {\n\tunits: Unit[];\n\tplaceholder?: string;\n};\n\nexport type Unit = 'px' | '%' | 'em' | 'rem' | 'vw';\n\nexport type SizeControlValue = TransformablePropValue< { unit: Unit; size: number } >;\n\nexport const SizeControl = ( { units, placeholder }: SizeControlProps ) => {\n\tconst { value, setValue } = useControl< SizeControlValue >( defaultState );\n\tconst propValue = value.value;\n\n\tconst handleUnitChange = ( event: SelectChangeEvent< Unit > ) => {\n\t\tconst unit = event.target.value as Unit;\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, unit } } );\n\t};\n\n\tconst handleSizeChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tconst { valueAsNumber: size } = event.target;\n\n\t\tif ( Number.isNaN( size ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, size } } );\n\t};\n\n\treturn (\n\t\t<Stack direction=\"row\">\n\t\t\t<TextField\n\t\t\t\tsize=\"tiny\"\n\t\t\t\ttype=\"number\"\n\t\t\t\tvalue={ propValue.size }\n\t\t\t\tonChange={ handleSizeChange }\n\t\t\t\tplaceholder={ placeholder }\n\t\t\t/>\n\t\t\t<Select\n\t\t\t\tsize=\"tiny\"\n\t\t\t\tvalue={ propValue.unit }\n\t\t\t\tonChange={ handleUnitChange }\n\t\t\t\tMenuProps={ {\n\t\t\t\t\tanchorOrigin: { vertical: 'bottom', horizontal: 'right' },\n\t\t\t\t\ttransformOrigin: { vertical: 'top', horizontal: 'right' },\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ units.map( ( unit ) => (\n\t\t\t\t\t<MenuItem key={ unit } value={ unit }>\n\t\t\t\t\t\t{ unit.toUpperCase() }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) ) }\n\t\t\t</Select>\n\t\t</Stack>\n\t);\n};\n\nconst defaultState: SizeControlValue = {\n\t$$type: 'size',\n\tvalue: { unit: 'px', size: 0 },\n};\n","import { panel } from './panel';\nimport { injectIntoLogic } from '@elementor/editor';\nimport { shouldUseV2Panel } from './sync/should-use-v2-panel';\nimport { EditingPanelHooks } from './components/editing-panel/editing-panel-hooks';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { __privateBlockDataCommand as blockDataCommand } from '@elementor/editor-v1-adapters';\n\nexport default function init() {\n\tregisterPanel( panel );\n\tblockV1Panel();\n\n\tinjectIntoLogic( {\n\t\tid: 'editing-panel-hooks',\n\t\tcomponent: EditingPanelHooks,\n\t} );\n}\n\nconst blockV1Panel = () => {\n\tblockDataCommand( {\n\t\tcommand: 'panel/editor/open',\n\t\tcondition: shouldUseV2Panel,\n\t} );\n};\n","import getSelectedElements from './get-selected-elements';\nimport getWidgetsCache from './get-widgets-cache';\n\nexport const shouldUseV2Panel = () => {\n\tconst selectedElements = getSelectedElements();\n\tconst widgetCache = getWidgetsCache();\n\n\tif ( selectedElements.length !== 1 ) {\n\t\treturn false;\n\t}\n\n\t// Check if the selected element has atomic controls, meaning it's a V2 element.\n\treturn !! widgetCache?.[ selectedElements[ 0 ].type ]?.atomic_controls;\n};\n","import { useEffect } from 'react';\nimport { commandStartEvent, __privateListenTo as listenTo } from '@elementor/editor-v1-adapters';\nimport { usePanelActions } from '../panel';\nimport { shouldUseV2Panel } from '../sync/should-use-v2-panel';\n\nexport const useOpenEditorPanel = () => {\n\tconst { open } = usePanelActions();\n\n\tuseEffect( () => {\n\t\treturn listenTo( commandStartEvent( 'panel/editor/open' ), () => {\n\t\t\tif ( shouldUseV2Panel() ) {\n\t\t\t\topen();\n\t\t\t}\n\t\t} );\n\t}, [] ); // eslint-disable-line react-hooks/exhaustive-deps\n};\n","import { useOpenEditorPanel } from '../../hooks/use-open-editor-panel';\n\nexport const EditingPanelHooks = () => {\n\tuseOpenEditorPanel();\n\n\treturn null;\n};\n","import init from './init';\n\ninit();\n"],"mappings":"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","names":["import_editor_panels","React","import_i18n","useListenTo","import_editor_v1_adapters","useListenTo","import_ui","React","import_i18n","React","import_ui","React","import_react","import_editor_v1_adapters","useListenTo","import_editor_v1_adapters","runCommand","React","import_react","import_ui","React","import_ui","React","import_ui","React","import_ui","React","React","import_react","Context","import_editor_v1_adapters","useListenTo","import_ui","React","React","import_editor_v1_adapters","runCommand","import_editor_v1_adapters","useListenTo","import_ui","Label","React","import_ui","units","import_ui","Control","createPanel","import_react","import_editor_v1_adapters","listenTo","import_editor_panels","import_editor_v1_adapters","registerPanel","blockDataCommand"]}
+{"version":3,"sources":["../src/panel.ts","../src/components/editing-panel/editing-panel.tsx","../src/hooks/use-selected-elements.ts","../src/sync/get-selected-elements.ts","../src/hooks/use-element-type.ts","../src/sync/get-widgets-cache.ts","../src/contexts/element-context.tsx","../src/components/editing-panel/editing-panel-tabs.tsx","../src/components/editing-panel/settings-tab.tsx","../src/components/controls/settings-control.tsx","../src/contexts/control-context.tsx","../src/hooks/use-widget-settings.ts","../src/sync/get-container.ts","../src/sync/update-settings.ts","../src/components/controls/collapsible-section.tsx","../src/components/controls/control-types/select-control.tsx","../src/components/controls/control-types/text-area-control.tsx","../src/components/controls/control-types/text-control.tsx","../src/components/controls/get-control-by-type.ts","../src/components/editing-panel/style-tab/style-tab.tsx","../src/contexts/style-context.tsx","../src/hooks/use-element-styles.ts","../src/sync/get-element-styles.ts","../src/components/editing-panel/style-tab/sections/size.tsx","../src/components/controls/style-control.tsx","../src/sync/update-style.ts","../src/hooks/use-element-style-prop.ts","../src/components/controls/control-types/size-control.tsx","../src/init.ts","../src/sync/should-use-v2-panel.ts","../src/hooks/use-open-editor-panel.ts","../src/components/editing-panel/editing-panel-hooks.tsx","../src/index.ts"],"sourcesContent":["import { __createPanel as createPanel } from '@elementor/editor-panels';\nimport { EditingPanel } from './components/editing-panel/editing-panel';\n\nexport const { panel, usePanelActions, usePanelStatus } = createPanel( {\n\tid: 'editing-panel',\n\tcomponent: EditingPanel,\n} );\n","import * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport useSelectedElements from '../../hooks/use-selected-elements';\nimport useElementType from '../../hooks/use-element-type';\nimport { Panel, PanelBody, PanelHeader, PanelHeaderTitle } from '@elementor/editor-panels';\nimport { ElementContext } from '../../contexts/element-context';\nimport { EditingPanelTabs } from './editing-panel-tabs';\n\nexport const EditingPanel = () => {\n\tconst elements = useSelectedElements();\n\n\tconst [ selectedElement ] = elements;\n\n\tconst elementType = useElementType( selectedElement?.type );\n\n\tif ( elements.length !== 1 || ! elementType ) {\n\t\treturn null;\n\t}\n\n\t/* translators: %s: Element type title. */\n\tconst panelTitle = __( 'Edit %s', 'elementor' ).replace( '%s', elementType.title );\n\n\treturn (\n\t\t<Panel>\n\t\t\t<PanelHeader>\n\t\t\t\t<PanelHeaderTitle>{ panelTitle }</PanelHeaderTitle>\n\t\t\t</PanelHeader>\n\t\t\t<PanelBody>\n\t\t\t\t<ElementContext element={ selectedElement }>\n\t\t\t\t\t<EditingPanelTabs />\n\t\t\t\t</ElementContext>\n\t\t\t</PanelBody>\n\t\t</Panel>\n\t);\n};\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getSelectedElements from '../sync/get-selected-elements';\n\nexport default function useSelectedElements() {\n\treturn useListenTo(\n\t\t[ commandEndEvent( 'document/elements/select' ), commandEndEvent( 'document/elements/deselect' ) ],\n\t\t() => getSelectedElements()\n\t);\n}\n","import { ExtendedWindow } from './types';\nimport { Element } from '../types';\n\nexport default function getSelectedElements(): Element[] {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\tconst selectedElements = extendedWindow.elementor?.selection?.getElements?.() ?? [];\n\n\treturn selectedElements.reduce< Element[] >( ( acc, el ) => {\n\t\tconst type = el.model.get( 'widgetType' ) || el.model.get( 'elType' );\n\n\t\tif ( type ) {\n\t\t\tacc.push( {\n\t\t\t\tid: el.model.get( 'id' ),\n\t\t\t\ttype,\n\t\t\t} );\n\t\t}\n\n\t\treturn acc;\n\t}, [] );\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getWidgetsCache from '../sync/get-widgets-cache';\nimport { ElementType } from '../types';\n\nexport default function useElementType( type?: string ) {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'editor/documents/load' ),\n\t\t(): ElementType | null => {\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst widgetsCache = getWidgetsCache();\n\t\t\tconst elementType = widgetsCache?.[ type ];\n\n\t\t\tif ( ! elementType?.atomic_controls ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tkey: type,\n\t\t\t\tcontrols: elementType.atomic_controls,\n\t\t\t\ttitle: elementType.title,\n\t\t\t};\n\t\t},\n\t\t[ type ]\n\t);\n}\n","import { ExtendedWindow } from './types';\n\nexport default function getWidgetsCache() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow?.elementor?.widgetsCache || null;\n}\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { Element } from '../types';\n\ntype ContextValue = {\n\telement: Element;\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\telement: Element;\n\tchildren?: ReactNode;\n};\n\nexport function ElementContext( { children, element }: Props ) {\n\treturn <Context.Provider value={ { element } }>{ children }</Context.Provider>;\n}\n\nexport function useElementContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'useElementContext must be used within a ElementContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { Stack, Tabs, Tab, TabPanel, useTabs } from '@elementor/ui';\nimport * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport { SettingsTab } from './settings-tab';\nimport { StyleTab } from './style-tab/style-tab';\n\ntype TabValue = 'settings' | 'style';\n\nexport const EditingPanelTabs = () => {\n\tconst { getTabProps, getTabPanelProps, getTabsProps } = useTabs< TabValue >( 'settings' );\n\n\treturn (\n\t\t<Stack direction=\"column\" sx={ { width: '100%' } }>\n\t\t\t<Tabs variant=\"fullWidth\" indicatorColor=\"secondary\" textColor=\"inherit\" { ...getTabsProps() }>\n\t\t\t\t<Tab label={ __( 'General', 'elementor' ) } { ...getTabProps( 'settings' ) } />\n\t\t\t\t<Tab label={ __( 'Style', 'elementor' ) } { ...getTabProps( 'style' ) } />\n\t\t\t</Tabs>\n\t\t\t<TabPanel { ...getTabPanelProps( 'settings' ) } disablePadding>\n\t\t\t\t<SettingsTab />\n\t\t\t</TabPanel>\n\t\t\t<TabPanel { ...getTabPanelProps( 'style' ) } disablePadding>\n\t\t\t\t<StyleTab />\n\t\t\t</TabPanel>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { Stack } from '@elementor/ui';\nimport { SettingsControl } from '../controls/settings-control';\nimport { useElementContext } from '../../contexts/element-context';\nimport useElementType from '../../hooks/use-element-type';\nimport type { Control } from '../../types';\nimport { CollapsibleSection } from '../controls/collapsible-section';\nimport { getControlByType } from '../controls/get-control-by-type';\n\nexport const SettingsTab = () => {\n\tconst { element } = useElementContext();\n\n\tconst elementType = useElementType( element?.type );\n\n\tif ( ! elementType ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Stack>\n\t\t\t{ elementType.controls.map( ( { type, value }, index ) => {\n\t\t\t\tif ( type === 'control' ) {\n\t\t\t\t\treturn <Control key={ value.bind } control={ value } />;\n\t\t\t\t}\n\n\t\t\t\tif ( type === 'section' ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CollapsibleSection key={ type + '.' + index } title={ value.label }>\n\t\t\t\t\t\t\t{ value.items?.map( ( item ) => {\n\t\t\t\t\t\t\t\tif ( item.type === 'control' ) {\n\t\t\t\t\t\t\t\t\treturn <Control key={ item.value.bind } control={ item.value } />;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t// TODO: Handle 2nd level sections\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</CollapsibleSection>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn null;\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n};\n\n// TODO: Create control wrapper by type for different layouts.\nconst Control = ( { control }: { control: Control[ 'value' ] } ) => {\n\tconst ControlComponent = getControlByType( control.type );\n\n\tif ( ! ControlComponent ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SettingsControl bind={ control.bind }>\n\t\t\t<SettingsControl.Label>{ control.label }</SettingsControl.Label>\n\t\t\t<ControlComponent\n\t\t\t\t/* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n\t\t\t\t{ ...( control.props as any ) }\n\t\t\t/>\n\t\t</SettingsControl>\n\t);\n};\n","import * as React from 'react';\nimport { ControlContext } from '../../contexts/control-context';\nimport { Stack, styled, Typography } from '@elementor/ui';\nimport { PropKey, PropValue } from '../../types';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useWidgetSettings } from '../../hooks/use-widget-settings';\nimport { updateSettings } from '../../sync/update-settings';\n\ntype Props = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nexport const SettingsControlProvider = ( { bind, children }: Props ) => {\n\tconst { element } = useElementContext();\n\tconst value = useWidgetSettings( { id: element.id, bind } );\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateSettings( {\n\t\t\tid: element.id,\n\t\t\tprops: {\n\t\t\t\t[ bind ]: newValue,\n\t\t\t},\n\t\t} );\n\t};\n\n\treturn <ControlContext.Provider value={ { setValue, value, bind } }>{ children }</ControlContext.Provider>;\n};\n\nconst SettingsControl = ( { children, bind }: Props ) => (\n\t<SettingsControlProvider bind={ bind }>\n\t\t<StyledStack gap={ 1 } direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" flexWrap=\"wrap\">\n\t\t\t{ children }\n\t\t</StyledStack>\n\t</SettingsControlProvider>\n);\n\nconst StyledStack = styled( Stack )`\n\t& > * {\n\t\tflex-grow: 1;\n\t}\n\n\t& > label {\n\t\tmin-width: 50%;\n\t}\n`;\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nSettingsControl.Label = Label;\n\nexport { SettingsControl };\n","import { createContext, useContext } from 'react';\nimport { PropKey, PropValue } from '../types';\n\nexport type ControlContext< T extends PropValue > = {\n\tbind: PropKey;\n\tsetValue: ( value: T ) => void;\n\tvalue: T;\n};\n\nexport const ControlContext = createContext< ControlContext< PropValue > | null >( null );\n\nexport function useControl< T extends PropValue >(): ControlContext< T | undefined >;\nexport function useControl< T extends PropValue >( defaultValue: T ): ControlContext< T >;\nexport function useControl< T extends PropValue >( defaultValue?: T ) {\n\tconst controlContext = useContext< ControlContext< T > >( ControlContext as never );\n\n\tif ( ! controlContext ) {\n\t\tthrow new Error( 'useControl must be used within a ControlContext' );\n\t}\n\n\treturn { ...controlContext, value: controlContext.value ?? defaultValue };\n}\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { PropValue } from '../types';\nimport getContainer from '../sync/get-container';\n\nexport const useWidgetSettings = ( { id, bind }: { id: string; bind: string } ): PropValue => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t() => {\n\t\t\tconst container = getContainer( id );\n\t\t\tconst value = container?.settings?.get( bind ) ?? null;\n\n\t\t\treturn value;\n\t\t},\n\t\t[ id, bind ]\n\t);\n};\n","import { ExtendedWindow } from './types';\n\nexport default function getContainer( id: string ) {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\tconst container = extendedWindow.elementor?.getContainer?.( id );\n\n\treturn container ?? null;\n}\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { Props } from '../types';\nimport getContainer from './get-container';\n\nexport const updateSettings = ( { id, props }: { id: string; props: Props } ) => {\n\tconst container = getContainer( id );\n\n\trunCommand( 'document/elements/settings', {\n\t\tcontainer,\n\t\tsettings: {\n\t\t\t...props,\n\t\t},\n\t} );\n};\n","import * as React from 'react';\nimport { useId } from 'react';\nimport { Accordion, AccordionSummary, AccordionDetails, AccordionSummaryText, Stack } from '@elementor/ui';\n\nexport type CollapsibleSectionProps = React.PropsWithChildren< {\n\ttitle: React.ReactNode;\n} >;\n\nexport const CollapsibleSection = ( { title, children }: CollapsibleSectionProps ) => {\n\tconst uid = useId();\n\tconst labelId = `label-${ uid }`;\n\tconst contentId = `content-${ uid }`;\n\n\t// TODO: Change to collapsible list item\n\treturn (\n\t\t<Accordion disableGutters defaultExpanded>\n\t\t\t<AccordionSummary aria-controls={ contentId } id={ labelId }>\n\t\t\t\t<AccordionSummaryText primaryTypographyProps={ { variant: 'caption' } }>{ title }</AccordionSummaryText>\n\t\t\t</AccordionSummary>\n\t\t\t<AccordionDetails id={ contentId } aria-labelledby={ labelId }>\n\t\t\t\t<Stack gap={ 2.5 }>{ children }</Stack>\n\t\t\t</AccordionDetails>\n\t\t</Accordion>\n\t);\n};\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { PropValue } from '../../../types';\n\ntype Props< T > = {\n\toptions: Array< { label: string; value: T; disabled?: boolean } >;\n};\n\nexport const SelectControl = < T extends PropValue >( { options }: Props< T > ) => {\n\tconst { value, setValue } = useControl< T >();\n\n\tconst handleChange = ( event: SelectChangeEvent< T > ) => {\n\t\tsetValue( event.target.value as T );\n\t};\n\n\treturn (\n\t\t<Select size=\"tiny\" value={ value ?? '' } onChange={ handleChange }>\n\t\t\t{ options.map( ( { label, ...props } ) => (\n\t\t\t\t<MenuItem key={ props.value } { ...props }>\n\t\t\t\t\t{ label }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</Select>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\ntype Props = {\n\tplaceholder?: string;\n};\n\nexport const TextAreaControl = ( { placeholder }: Props ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tsetValue( event.target.value );\n\t};\n\n\treturn (\n\t\t<TextField\n\t\t\tsize=\"tiny\"\n\t\t\tmultiline\n\t\t\tfullWidth\n\t\t\trows={ 5 }\n\t\t\tvalue={ value }\n\t\t\tonChange={ handleChange }\n\t\t\tplaceholder={ placeholder }\n\t\t/>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\nexport const TextControl = ( { placeholder }: { placeholder?: string } ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => setValue( event.target.value );\n\n\treturn <TextField type=\"text\" size=\"tiny\" value={ value } onChange={ handleChange } placeholder={ placeholder } />;\n};\n","import { SelectControl } from './control-types/select-control';\nimport { TextAreaControl } from './control-types/text-area-control';\nimport { TextControl } from './control-types/text-control';\n\nconst controlTypes = {\n\tselect: SelectControl,\n\ttext: TextControl,\n\ttextarea: TextAreaControl,\n};\n\nexport const getControlByType = ( type: string ) => {\n\treturn controlTypes[ type as keyof typeof controlTypes ] ?? null;\n};\n","import * as React from 'react';\nimport { StyleContext } from '../../../contexts/style-context';\nimport { useElementContext } from '../../../contexts/element-context';\nimport { useElementStyles } from '../../../hooks/use-element-styles';\nimport { Stack } from '@elementor/ui';\nimport { SizeSection } from './sections/size';\n\nexport const StyleTab = () => {\n\tconst { element } = useElementContext();\n\tconst elementStyles = useElementStyles( element.id );\n\t// TODO: Handle selected style state.\n\tconst [ selectedStyleDef = null ] = Object.values( elementStyles || {} );\n\n\treturn (\n\t\t<StyleContext selectedStyleDef={ selectedStyleDef }>\n\t\t\t<Stack>\n\t\t\t\t<SizeSection />\n\t\t\t</Stack>\n\t\t</StyleContext>\n\t);\n};\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { useActiveBreakpoint } from '@elementor/editor-responsive';\nimport { StyleDefinition, StyleVariant } from '@elementor/editor-style';\n\ntype ContextValue = {\n\tselectedStyleDef: StyleDefinition | null;\n\tselectedMeta: StyleVariant[ 'meta' ];\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\tchildren: ReactNode;\n\tselectedStyleDef: StyleDefinition | null;\n};\n\nexport function StyleContext( { children, selectedStyleDef }: Props ) {\n\tconst breakpoint = useActiveBreakpoint();\n\t// TODO: Handle state when we support it.\n\tconst selectedMeta = { breakpoint, state: null } as const;\n\n\treturn <Context.Provider value={ { selectedStyleDef, selectedMeta } }>{ children }</Context.Provider>;\n}\n\nexport function useStyleContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'UseStyleContext must be used within a StyleContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport { getElementStyles } from '../sync/get-element-styles';\nimport { ElementID } from '../types';\n\nexport const useElementStyles = ( elementID: ElementID ) => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\treturn getElementStyles( elementID );\n\t\t},\n\t\t[ elementID ]\n\t);\n};\n","import getContainer from './get-container';\nimport { ElementID } from '../types';\nimport { StyleDefinition } from '@elementor/editor-style';\n\nexport const getElementStyles = ( elementID: ElementID ): Record< string, StyleDefinition > | null => {\n\tconst container = getContainer( elementID );\n\n\treturn container?.model.get( 'styles' ) || null;\n};\n","import * as React from 'react';\nimport { CollapsibleSection } from '../../../controls/collapsible-section';\nimport { StyleControl, StyleControlProps } from '../../../controls/style-control';\nimport { SizeControl, Unit } from '../../../controls/control-types/size-control';\nimport { Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nexport const SizeSection = () => {\n\treturn (\n\t\t<CollapsibleSection title={ __( 'Size', 'elementor' ) }>\n\t\t\t<Stack gap={ 1.5 }>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"width\" label={ __( 'Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"height\" label={ __( 'Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"min-width\" label={ __( 'Min. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"min-height\" label={ __( 'Min. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"max-width\" label={ __( 'Max. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"max-height\" label={ __( 'Max. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t</CollapsibleSection>\n\t);\n};\n\nconst units: Unit[] = [ 'px', '%', 'em', 'rem', 'vw' ];\n\ntype ControlProps = {\n\tbind: StyleControlProps[ 'bind' ];\n\tlabel: string;\n};\n\nconst Control = ( { label, bind }: ControlProps ) => {\n\treturn (\n\t\t<StyleControl bind={ bind }>\n\t\t\t<Stack gap={ 1 } sx={ { flex: '0 1 50%' } }>\n\t\t\t\t<StyleControl.Label>{ label }</StyleControl.Label>\n\t\t\t\t<SizeControl units={ units } />\n\t\t\t</Stack>\n\t\t</StyleControl>\n\t);\n};\n","import * as React from 'react';\nimport { PropKey, PropValue } from '../../types';\nimport { ControlContext } from '../../contexts/control-context';\nimport { updateStyle } from '../../sync/update-style';\nimport { useElementStyleProp } from '../../hooks/use-element-style-prop';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useStyleContext } from '../../contexts/style-context';\nimport { Typography } from '@elementor/ui';\n\nexport type StyleControlProps = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nconst StyleControl = ( { bind, children }: StyleControlProps ) => {\n\tconst { element } = useElementContext();\n\tconst { selectedStyleDef, selectedMeta } = useStyleContext();\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateStyle( {\n\t\t\telementID: element.id,\n\t\t\tstyleDefID: selectedStyleDef?.id,\n\t\t\tprops: { [ bind ]: newValue },\n\t\t\tmeta: selectedMeta,\n\t\t} );\n\t};\n\n\tconst value = useElementStyleProp( {\n\t\telementID: element.id,\n\t\tstyleDefID: selectedStyleDef?.id,\n\t\tmeta: selectedMeta,\n\t\tpropName: bind,\n\t} );\n\n\treturn <ControlContext.Provider value={ { bind, value, setValue } }>{ children }</ControlContext.Provider>;\n};\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nStyleControl.Label = Label;\n\nexport { StyleControl };\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, Props } from '../types';\nimport getContainer from './get-container';\nimport { StyleDefinitionID, StyleVariant } from '@elementor/editor-style';\n\nexport type UpdateStyleProps = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefinitionID;\n\tmeta: StyleVariant[ 'meta' ];\n\tprops: Props;\n\tbind?: PropKey;\n};\n\nexport const updateStyle = ( { elementID, styleDefID, meta, props, bind = 'classes' }: UpdateStyleProps ) => {\n\tconst container = getContainer( elementID );\n\n\trunCommand( 'document/atomic-widgets/styles', {\n\t\tcontainer,\n\t\tstyleDefID,\n\t\tbind,\n\t\tmeta,\n\t\tprops,\n\t} );\n};\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, PropValue } from '../types';\nimport { getElementStyles } from '../sync/get-element-styles';\nimport { StyleDefinition, StyleDefinitionID, StyleVariant } from '@elementor/editor-style';\n\nexport type UseElementStylePropArgs = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefinitionID;\n\tmeta: StyleVariant[ 'meta' ];\n\tpropName: PropKey;\n};\n\nexport const useElementStyleProp = < T extends PropValue >( {\n\telementID,\n\tstyleDefID,\n\tmeta,\n\tpropName,\n}: UseElementStylePropArgs ): T | null => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\t// TODO: return default value for style prop\n\t\t\tif ( ! styleDefID ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst styleDef = getElementStyles( elementID )?.[ styleDefID ];\n\n\t\t\tif ( ! styleDef ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( styleDef, meta );\n\n\t\t\treturn variant?.props[ propName ] ?? null;\n\t\t},\n\t\t[ elementID, styleDefID, propName, meta ]\n\t) as T;\n};\n\nfunction getVariantByMeta( styleDef: StyleDefinition, meta: StyleVariant[ 'meta' ] ) {\n\treturn styleDef.variants.find( ( variant ) => {\n\t\treturn variant.meta.breakpoint === meta.breakpoint && variant.meta.state === meta.state;\n\t} );\n}\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent, Stack, TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { TransformablePropValue } from '../../../types';\n\nexport type SizeControlProps = {\n\tunits: Unit[];\n\tplaceholder?: string;\n};\n\nexport type Unit = 'px' | '%' | 'em' | 'rem' | 'vw';\n\nexport type SizeControlValue = TransformablePropValue< { unit: Unit; size: number } >;\n\nexport const SizeControl = ( { units, placeholder }: SizeControlProps ) => {\n\tconst { value, setValue } = useControl< SizeControlValue >( defaultState );\n\tconst propValue = value.value;\n\n\tconst handleUnitChange = ( event: SelectChangeEvent< Unit > ) => {\n\t\tconst unit = event.target.value as Unit;\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, unit } } );\n\t};\n\n\tconst handleSizeChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tconst { valueAsNumber: size } = event.target;\n\n\t\tif ( Number.isNaN( size ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, size } } );\n\t};\n\n\treturn (\n\t\t<Stack direction=\"row\">\n\t\t\t<TextField\n\t\t\t\tsize=\"tiny\"\n\t\t\t\ttype=\"number\"\n\t\t\t\tvalue={ propValue.size }\n\t\t\t\tonChange={ handleSizeChange }\n\t\t\t\tplaceholder={ placeholder }\n\t\t\t/>\n\t\t\t<Select\n\t\t\t\tsize=\"tiny\"\n\t\t\t\tvalue={ propValue.unit }\n\t\t\t\tonChange={ handleUnitChange }\n\t\t\t\tMenuProps={ {\n\t\t\t\t\tanchorOrigin: { vertical: 'bottom', horizontal: 'right' },\n\t\t\t\t\ttransformOrigin: { vertical: 'top', horizontal: 'right' },\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ units.map( ( unit ) => (\n\t\t\t\t\t<MenuItem key={ unit } value={ unit }>\n\t\t\t\t\t\t{ unit.toUpperCase() }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) ) }\n\t\t\t</Select>\n\t\t</Stack>\n\t);\n};\n\nconst defaultState: SizeControlValue = {\n\t$$type: 'size',\n\tvalue: { unit: 'px', size: 0 },\n};\n","import { panel } from './panel';\nimport { injectIntoLogic } from '@elementor/editor';\nimport { shouldUseV2Panel } from './sync/should-use-v2-panel';\nimport { EditingPanelHooks } from './components/editing-panel/editing-panel-hooks';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { __privateBlockDataCommand as blockDataCommand } from '@elementor/editor-v1-adapters';\n\nexport default function init() {\n\tregisterPanel( panel );\n\tblockV1Panel();\n\n\tinjectIntoLogic( {\n\t\tid: 'editing-panel-hooks',\n\t\tcomponent: EditingPanelHooks,\n\t} );\n}\n\nconst blockV1Panel = () => {\n\tblockDataCommand( {\n\t\tcommand: 'panel/editor/open',\n\t\tcondition: shouldUseV2Panel,\n\t} );\n};\n","import getSelectedElements from './get-selected-elements';\nimport getWidgetsCache from './get-widgets-cache';\n\nexport const shouldUseV2Panel = () => {\n\tconst selectedElements = getSelectedElements();\n\tconst widgetCache = getWidgetsCache();\n\n\tif ( selectedElements.length !== 1 ) {\n\t\treturn false;\n\t}\n\n\t// Check if the selected element has atomic controls, meaning it's a V2 element.\n\treturn !! widgetCache?.[ selectedElements[ 0 ].type ]?.atomic_controls;\n};\n","import { useEffect } from 'react';\nimport { commandStartEvent, __privateListenTo as listenTo } from '@elementor/editor-v1-adapters';\nimport { usePanelActions } from '../panel';\nimport { shouldUseV2Panel } from '../sync/should-use-v2-panel';\n\nexport const useOpenEditorPanel = () => {\n\tconst { open } = usePanelActions();\n\n\tuseEffect( () => {\n\t\treturn listenTo( commandStartEvent( 'panel/editor/open' ), () => {\n\t\t\tif ( shouldUseV2Panel() ) {\n\t\t\t\topen();\n\t\t\t}\n\t\t} );\n\t}, [] ); // eslint-disable-line react-hooks/exhaustive-deps\n};\n","import { useOpenEditorPanel } from '../../hooks/use-open-editor-panel';\n\nexport const EditingPanelHooks = () => {\n\tuseOpenEditorPanel();\n\n\treturn null;\n};\n","import init from './init';\n\ninit();\n"],"mappings":"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","names":["import_editor_panels","React","import_i18n","useListenTo","import_editor_v1_adapters","useListenTo","import_ui","React","import_i18n","React","import_ui","React","import_react","import_editor_v1_adapters","useListenTo","import_editor_v1_adapters","runCommand","React","import_react","import_ui","React","import_ui","React","import_ui","React","import_ui","React","React","import_react","Context","import_editor_v1_adapters","useListenTo","import_ui","React","React","import_editor_v1_adapters","runCommand","import_editor_v1_adapters","useListenTo","import_ui","Label","React","import_ui","units","import_ui","Control","createPanel","import_react","import_editor_v1_adapters","listenTo","import_editor_panels","import_editor_v1_adapters","registerPanel","blockDataCommand"]}

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/panel.ts","../src/components/editing-panel/editing-panel.tsx","../src/hooks/use-selected-elements.ts","../src/sync/get-selected-elements.ts","../src/hooks/use-element-type.ts","../src/sync/get-widgets-cache.ts","../src/contexts/element-context.tsx","../src/components/editing-panel/editing-panel-tabs.tsx","../src/components/editing-panel/settings-tab.tsx","../src/components/controls/settings-control.tsx","../src/contexts/control-context.tsx","../src/hooks/use-widget-settings.ts","../src/sync/get-container.ts","../src/sync/update-settings.ts","../src/components/controls/collapsible-section.tsx","../src/components/controls/control-types/select-control.tsx","../src/components/controls/control-types/text-area-control.tsx","../src/components/controls/control-types/text-control.tsx","../src/components/controls/get-control-by-type.ts","../src/components/editing-panel/style-tab/style-tab.tsx","../src/contexts/style-context.tsx","../src/hooks/use-element-styles.ts","../src/sync/get-element-styles.ts","../src/components/editing-panel/style-tab/sections/size.tsx","../src/components/controls/style-control.tsx","../src/sync/update-style.ts","../src/hooks/use-element-style-prop.ts","../src/components/controls/control-types/size-control.tsx","../src/init.ts","../src/sync/should-use-v2-panel.ts","../src/hooks/use-open-editor-panel.ts","../src/components/editing-panel/editing-panel-hooks.tsx","../src/index.ts"],"sourcesContent":["import { __createPanel as createPanel } from '@elementor/editor-panels';\nimport { EditingPanel } from './components/editing-panel/editing-panel';\n\nexport const { panel, usePanelActions, usePanelStatus } = createPanel( {\n\tid: 'editing-panel',\n\tcomponent: EditingPanel,\n} );\n","import * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport useSelectedElements from '../../hooks/use-selected-elements';\nimport useElementType from '../../hooks/use-element-type';\nimport { Panel, PanelBody, PanelHeader, PanelHeaderTitle } from '@elementor/editor-panels';\nimport { ElementContext } from '../../contexts/element-context';\nimport { EditingPanelTabs } from './editing-panel-tabs';\n\nexport const EditingPanel = () => {\n\tconst elements = useSelectedElements();\n\n\tconst [ selectedElement ] = elements;\n\n\tconst elementType = useElementType( selectedElement?.type );\n\n\tif ( elements.length !== 1 || ! elementType ) {\n\t\treturn null;\n\t}\n\n\t/* translators: %s: Element type title. */\n\tconst panelTitle = __( 'Edit %s', 'elementor' ).replace( '%s', elementType.title );\n\n\treturn (\n\t\t<Panel>\n\t\t\t<PanelHeader>\n\t\t\t\t<PanelHeaderTitle>{ panelTitle }</PanelHeaderTitle>\n\t\t\t</PanelHeader>\n\t\t\t<PanelBody>\n\t\t\t\t<ElementContext element={ selectedElement }>\n\t\t\t\t\t<EditingPanelTabs />\n\t\t\t\t</ElementContext>\n\t\t\t</PanelBody>\n\t\t</Panel>\n\t);\n};\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getSelectedElements from '../sync/get-selected-elements';\n\nexport default function useSelectedElements() {\n\treturn useListenTo(\n\t\t[ commandEndEvent( 'document/elements/select' ), commandEndEvent( 'document/elements/deselect' ) ],\n\t\t() => getSelectedElements()\n\t);\n}\n","import { ExtendedWindow } from './types';\nimport { Element } from '../types';\n\nexport default function getSelectedElements(): Element[] {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\tconst selectedElements = extendedWindow.elementor?.selection?.getElements?.() ?? [];\n\n\treturn selectedElements.reduce< Element[] >( ( acc, el ) => {\n\t\tconst type = el.model.get( 'widgetType' ) || el.model.get( 'elType' );\n\n\t\tif ( type ) {\n\t\t\tacc.push( {\n\t\t\t\tid: el.model.get( 'id' ),\n\t\t\t\ttype,\n\t\t\t} );\n\t\t}\n\n\t\treturn acc;\n\t}, [] );\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getWidgetsCache from '../sync/get-widgets-cache';\nimport { ElementType } from '../types';\n\nexport default function useElementType( type?: string ) {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'editor/documents/load' ),\n\t\t(): ElementType | null => {\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst widgetsCache = getWidgetsCache();\n\t\t\tconst elementType = widgetsCache?.[ type ];\n\n\t\t\tif ( ! elementType?.atomic_controls ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tkey: type,\n\t\t\t\tcontrols: elementType.atomic_controls,\n\t\t\t\ttitle: elementType.title,\n\t\t\t};\n\t\t},\n\t\t[ type ]\n\t);\n}\n","import { ExtendedWindow } from './types';\n\nexport default function getWidgetsCache() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow?.elementor?.widgetsCache || null;\n}\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { Element } from '../types';\n\ntype ContextValue = {\n\telement: Element;\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\telement: Element;\n\tchildren?: ReactNode;\n};\n\nexport function ElementContext( { children, element }: Props ) {\n\treturn <Context.Provider value={ { element } }>{ children }</Context.Provider>;\n}\n\nexport function useElementContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'useElementContext must be used within a ElementContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { Stack, Tabs, Tab, TabPanel, useTabs } from '@elementor/ui';\nimport * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport { SettingsTab } from './settings-tab';\nimport { StyleTab } from './style-tab/style-tab';\n\ntype TabValue = 'settings' | 'style';\n\nexport const EditingPanelTabs = () => {\n\tconst { getTabProps, getTabPanelProps, getTabsProps } = useTabs< TabValue >( 'settings' );\n\n\treturn (\n\t\t<Stack direction=\"column\" sx={ { width: '100%' } }>\n\t\t\t<Tabs variant=\"fullWidth\" indicatorColor=\"secondary\" textColor=\"inherit\" { ...getTabsProps() }>\n\t\t\t\t<Tab label={ __( 'General', 'elementor' ) } { ...getTabProps( 'settings' ) } />\n\t\t\t\t<Tab label={ __( 'Style', 'elementor' ) } { ...getTabProps( 'style' ) } />\n\t\t\t</Tabs>\n\t\t\t<TabPanel { ...getTabPanelProps( 'settings' ) } disablePadding>\n\t\t\t\t<SettingsTab />\n\t\t\t</TabPanel>\n\t\t\t<TabPanel { ...getTabPanelProps( 'style' ) } disablePadding>\n\t\t\t\t<StyleTab />\n\t\t\t</TabPanel>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { Stack } from '@elementor/ui';\nimport { SettingsControl } from '../controls/settings-control';\nimport { useElementContext } from '../../contexts/element-context';\nimport useElementType from '../../hooks/use-element-type';\nimport type { Control } from '../../types';\nimport { CollapsibleSection } from '../controls/collapsible-section';\nimport { getControlByType } from '../controls/get-control-by-type';\n\nexport const SettingsTab = () => {\n\tconst { element } = useElementContext();\n\n\tconst elementType = useElementType( element?.type );\n\n\tif ( ! elementType ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Stack>\n\t\t\t{ elementType.controls.map( ( { type, value }, index ) => {\n\t\t\t\tif ( type === 'control' ) {\n\t\t\t\t\treturn <Control key={ value.bind } control={ value } />;\n\t\t\t\t}\n\n\t\t\t\tif ( type === 'section' ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CollapsibleSection key={ type + '.' + index } title={ value.label }>\n\t\t\t\t\t\t\t{ value.items?.map( ( item ) => {\n\t\t\t\t\t\t\t\tif ( item.type === 'control' ) {\n\t\t\t\t\t\t\t\t\treturn <Control key={ item.value.bind } control={ item.value } />;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t// TODO: Handle 2nd level sections\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</CollapsibleSection>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn null;\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n};\n\n// TODO: Create control wrapper by type for different layouts.\nconst Control = ( { control }: { control: Control[ 'value' ] } ) => {\n\tconst ControlComponent = getControlByType( control.type );\n\n\tif ( ! ControlComponent ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SettingsControl bind={ control.bind }>\n\t\t\t<SettingsControl.Label>{ control.label }</SettingsControl.Label>\n\t\t\t<ControlComponent\n\t\t\t\t/* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n\t\t\t\t{ ...( control.props as any ) }\n\t\t\t/>\n\t\t</SettingsControl>\n\t);\n};\n","import * as React from 'react';\nimport { ControlContext } from '../../contexts/control-context';\nimport { Stack, styled, Typography } from '@elementor/ui';\nimport { PropKey, PropValue } from '../../types';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useWidgetSettings } from '../../hooks/use-widget-settings';\nimport { updateSettings } from '../../sync/update-settings';\n\ntype Props = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nexport const SettingsControlProvider = ( { bind, children }: Props ) => {\n\tconst { element } = useElementContext();\n\tconst value = useWidgetSettings( { id: element.id, bind } );\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateSettings( {\n\t\t\tid: element.id,\n\t\t\tprops: {\n\t\t\t\t[ bind ]: newValue,\n\t\t\t},\n\t\t} );\n\t};\n\n\treturn <ControlContext.Provider value={ { setValue, value, bind } }>{ children }</ControlContext.Provider>;\n};\n\nconst SettingsControl = ( { children, bind }: Props ) => (\n\t<SettingsControlProvider bind={ bind }>\n\t\t<StyledStack gap={ 1 } direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" flexWrap=\"wrap\">\n\t\t\t{ children }\n\t\t</StyledStack>\n\t</SettingsControlProvider>\n);\n\nconst StyledStack = styled( Stack )`\n\t& > * {\n\t\tflex-grow: 1;\n\t}\n\n\t& > label {\n\t\tmin-width: 50%;\n\t}\n`;\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nSettingsControl.Label = Label;\n\nexport { SettingsControl };\n","import { createContext, useContext } from 'react';\nimport { PropKey, PropValue } from '../types';\n\nexport type ControlContext< T extends PropValue > = {\n\tbind: PropKey;\n\tsetValue: ( value: T ) => void;\n\tvalue: T;\n};\n\nexport const ControlContext = createContext< ControlContext< PropValue > | null >( null );\n\nexport function useControl< T extends PropValue >(): ControlContext< T | undefined >;\nexport function useControl< T extends PropValue >( defaultValue: T ): ControlContext< T >;\nexport function useControl< T extends PropValue >( defaultValue?: T ) {\n\tconst controlContext = useContext< ControlContext< T > >( ControlContext as never );\n\n\tif ( ! controlContext ) {\n\t\tthrow new Error( 'useControl must be used within a ControlContext' );\n\t}\n\n\treturn { ...controlContext, value: controlContext.value ?? defaultValue };\n}\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { PropValue } from '../types';\nimport getContainer from '../sync/get-container';\n\nexport const useWidgetSettings = ( { id, bind }: { id: string; bind: string } ): PropValue => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t() => {\n\t\t\tconst container = getContainer( id );\n\t\t\tconst value = container?.settings?.get( bind ) ?? null;\n\n\t\t\treturn value;\n\t\t},\n\t\t[ id, bind ]\n\t);\n};\n","import { ExtendedWindow } from './types';\n\nexport default function getContainer( id: string ) {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\tconst container = extendedWindow.elementor?.getContainer?.( id );\n\n\treturn container ?? null;\n}\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { Props } from '../types';\nimport getContainer from './get-container';\n\nexport const updateSettings = ( { id, props }: { id: string; props: Props } ) => {\n\tconst container = getContainer( id );\n\n\trunCommand( 'document/elements/settings', {\n\t\tcontainer,\n\t\tsettings: {\n\t\t\t...props,\n\t\t},\n\t} );\n};\n","import * as React from 'react';\nimport { useId } from 'react';\nimport { Accordion, AccordionSummary, AccordionDetails, AccordionSummaryText, Stack } from '@elementor/ui';\n\nexport type CollapsibleSectionProps = React.PropsWithChildren< {\n\ttitle: React.ReactNode;\n} >;\n\nexport const CollapsibleSection = ( { title, children }: CollapsibleSectionProps ) => {\n\tconst uid = useId();\n\tconst labelId = `label-${ uid }`;\n\tconst contentId = `content-${ uid }`;\n\n\t// TODO: Change to collapsible list item\n\treturn (\n\t\t<Accordion disableGutters defaultExpanded>\n\t\t\t<AccordionSummary aria-controls={ contentId } id={ labelId }>\n\t\t\t\t<AccordionSummaryText primaryTypographyProps={ { variant: 'caption' } }>{ title }</AccordionSummaryText>\n\t\t\t</AccordionSummary>\n\t\t\t<AccordionDetails id={ contentId } aria-labelledby={ labelId }>\n\t\t\t\t<Stack gap={ 2.5 }>{ children }</Stack>\n\t\t\t</AccordionDetails>\n\t\t</Accordion>\n\t);\n};\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { PropValue } from '../../../types';\n\ntype Props< T > = {\n\toptions: Array< { label: string; value: T; disabled?: boolean } >;\n};\n\nexport const SelectControl = < T extends PropValue >( { options }: Props< T > ) => {\n\tconst { value, setValue } = useControl< T >();\n\n\tconst handleChange = ( event: SelectChangeEvent< T > ) => {\n\t\tsetValue( event.target.value as T );\n\t};\n\n\treturn (\n\t\t<Select size=\"tiny\" value={ value ?? '' } onChange={ handleChange }>\n\t\t\t{ options.map( ( { label, ...props } ) => (\n\t\t\t\t<MenuItem key={ props.value } { ...props }>\n\t\t\t\t\t{ label }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</Select>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\ntype Props = {\n\tplaceholder?: string;\n};\n\nexport const TextAreaControl = ( { placeholder }: Props ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tsetValue( event.target.value );\n\t};\n\n\treturn (\n\t\t<TextField\n\t\t\tsize=\"tiny\"\n\t\t\tmultiline\n\t\t\tfullWidth\n\t\t\trows={ 5 }\n\t\t\tvalue={ value }\n\t\t\tonChange={ handleChange }\n\t\t\tplaceholder={ placeholder }\n\t\t/>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\nexport const TextControl = ( { placeholder }: { placeholder?: string } ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => setValue( event.target.value );\n\n\treturn <TextField type=\"text\" size=\"tiny\" value={ value } onChange={ handleChange } placeholder={ placeholder } />;\n};\n","import { SelectControl } from './control-types/select-control';\nimport { TextAreaControl } from './control-types/text-area-control';\nimport { TextControl } from './control-types/text-control';\n\nconst controlTypes = {\n\tselect: SelectControl,\n\ttext: TextControl,\n\ttextarea: TextAreaControl,\n};\n\nexport const getControlByType = ( type: string ) => {\n\treturn controlTypes[ type as keyof typeof controlTypes ] ?? null;\n};\n","import * as React from 'react';\nimport { StyleContext } from '../../../contexts/style-context';\nimport { useElementContext } from '../../../contexts/element-context';\nimport { useElementStyles } from '../../../hooks/use-element-styles';\nimport { Stack } from '@elementor/ui';\nimport { SizeSection } from './sections/size';\n\nexport const StyleTab = () => {\n\tconst { element } = useElementContext();\n\tconst elementStyles = useElementStyles( element.id );\n\t// TODO: Handle selected style state.\n\tconst [ selectedStyleDef = null ] = Object.values( elementStyles || {} );\n\n\treturn (\n\t\t<StyleContext selectedStyleDef={ selectedStyleDef }>\n\t\t\t<Stack>\n\t\t\t\t<SizeSection />\n\t\t\t</Stack>\n\t\t</StyleContext>\n\t);\n};\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { StyleDefinition, StyleDefMeta } from '../types';\nimport { useActiveBreakpoint } from '@elementor/editor-responsive';\n\ntype ContextValue = {\n\tselectedStyleDef: StyleDefinition | null;\n\tselectedMeta: StyleDefMeta;\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\tchildren: ReactNode;\n\tselectedStyleDef: StyleDefinition | null;\n};\n\nexport function StyleContext( { children, selectedStyleDef }: Props ) {\n\tconst breakpoint = useActiveBreakpoint();\n\t// TODO: Handle state when we support it.\n\tconst selectedMeta = { breakpoint, state: null } as const;\n\n\treturn <Context.Provider value={ { selectedStyleDef, selectedMeta } }>{ children }</Context.Provider>;\n}\n\nexport function useStyleContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'UseStyleContext must be used within a StyleContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport { getElementStyles } from '../sync/get-element-styles';\nimport { ElementID } from '../types';\n\nexport const useElementStyles = ( elementID: ElementID ) => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\treturn getElementStyles( elementID );\n\t\t},\n\t\t[ elementID ]\n\t);\n};\n","import getContainer from './get-container';\nimport { ElementID, StyleDefinition } from '../types';\n\nexport const getElementStyles = ( elementID: ElementID ): Record< string, StyleDefinition > | null => {\n\tconst container = getContainer( elementID );\n\n\treturn container?.model.get( 'styles' ) || null;\n};\n","import * as React from 'react';\nimport { CollapsibleSection } from '../../../controls/collapsible-section';\nimport { StyleControl, StyleControlProps } from '../../../controls/style-control';\nimport { SizeControl, Unit } from '../../../controls/control-types/size-control';\nimport { Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nexport const SizeSection = () => {\n\treturn (\n\t\t<CollapsibleSection title={ __( 'Size', 'elementor' ) }>\n\t\t\t<Stack gap={ 1.5 }>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"width\" label={ __( 'Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"height\" label={ __( 'Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"min-width\" label={ __( 'Min. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"min-height\" label={ __( 'Min. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"max-width\" label={ __( 'Max. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"max-height\" label={ __( 'Max. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t</CollapsibleSection>\n\t);\n};\n\nconst units: Unit[] = [ 'px', '%', 'em', 'rem', 'vw' ];\n\ntype ControlProps = {\n\tbind: StyleControlProps[ 'bind' ];\n\tlabel: string;\n};\n\nconst Control = ( { label, bind }: ControlProps ) => {\n\treturn (\n\t\t<StyleControl bind={ bind }>\n\t\t\t<Stack gap={ 1 } sx={ { flex: '0 1 50%' } }>\n\t\t\t\t<StyleControl.Label>{ label }</StyleControl.Label>\n\t\t\t\t<SizeControl units={ units } />\n\t\t\t</Stack>\n\t\t</StyleControl>\n\t);\n};\n","import * as React from 'react';\nimport { PropKey, PropValue } from '../../types';\nimport { ControlContext } from '../../contexts/control-context';\nimport { updateStyle } from '../../sync/update-style';\nimport { useElementStyleProp } from '../../hooks/use-element-style-prop';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useStyleContext } from '../../contexts/style-context';\nimport { Typography } from '@elementor/ui';\n\nexport type StyleControlProps = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nconst StyleControl = ( { bind, children }: StyleControlProps ) => {\n\tconst { element } = useElementContext();\n\tconst { selectedStyleDef, selectedMeta } = useStyleContext();\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateStyle( {\n\t\t\telementID: element.id,\n\t\t\tstyleDefID: selectedStyleDef?.id,\n\t\t\tprops: { [ bind ]: newValue },\n\t\t\tmeta: selectedMeta,\n\t\t} );\n\t};\n\n\tconst value = useElementStyleProp( {\n\t\telementID: element.id,\n\t\tstyleDefID: selectedStyleDef?.id,\n\t\tmeta: selectedMeta,\n\t\tpropName: bind,\n\t} );\n\n\treturn <ControlContext.Provider value={ { bind, value, setValue } }>{ children }</ControlContext.Provider>;\n};\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nStyleControl.Label = Label;\n\nexport { StyleControl };\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, Props, StyleDefID, StyleDefMeta } from '../types';\nimport getContainer from './get-container';\n\nexport type UpdateStyleProps = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefID;\n\tmeta: StyleDefMeta;\n\tprops: Props;\n\tbind?: PropKey;\n};\n\nexport const updateStyle = ( { elementID, styleDefID, meta, props, bind = 'classes' }: UpdateStyleProps ) => {\n\tconst container = getContainer( elementID );\n\n\trunCommand( 'document/atomic-widgets/styles', {\n\t\tcontainer,\n\t\tstyleDefID,\n\t\tbind,\n\t\tmeta,\n\t\tprops,\n\t} );\n};\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, PropValue, StyleDefID, StyleDefinition, StyleDefMeta } from '../types';\nimport { getElementStyles } from '../sync/get-element-styles';\n\nexport type UseElementStylePropArgs = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefID;\n\tmeta: StyleDefMeta;\n\tpropName: PropKey;\n};\n\nexport const useElementStyleProp = < T extends PropValue >( {\n\telementID,\n\tstyleDefID,\n\tmeta,\n\tpropName,\n}: UseElementStylePropArgs ): T | null => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\t// TODO: return default value for style prop\n\t\t\tif ( ! styleDefID ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst styleDef = getElementStyles( elementID )?.[ styleDefID ];\n\n\t\t\tif ( ! styleDef ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( styleDef, meta );\n\n\t\t\treturn variant?.props[ propName ] ?? null;\n\t\t},\n\t\t[ elementID, styleDefID, propName, meta ]\n\t) as T;\n};\n\nfunction getVariantByMeta( styleDef: StyleDefinition, meta: StyleDefMeta ) {\n\treturn styleDef.variants.find( ( variant ) => {\n\t\treturn variant.meta.breakpoint === meta.breakpoint && variant.meta.state === meta.state;\n\t} );\n}\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent, Stack, TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { TransformablePropValue } from '../../../types';\n\nexport type SizeControlProps = {\n\tunits: Unit[];\n\tplaceholder?: string;\n};\n\nexport type Unit = 'px' | '%' | 'em' | 'rem' | 'vw';\n\nexport type SizeControlValue = TransformablePropValue< { unit: Unit; size: number } >;\n\nexport const SizeControl = ( { units, placeholder }: SizeControlProps ) => {\n\tconst { value, setValue } = useControl< SizeControlValue >( defaultState );\n\tconst propValue = value.value;\n\n\tconst handleUnitChange = ( event: SelectChangeEvent< Unit > ) => {\n\t\tconst unit = event.target.value as Unit;\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, unit } } );\n\t};\n\n\tconst handleSizeChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tconst { valueAsNumber: size } = event.target;\n\n\t\tif ( Number.isNaN( size ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, size } } );\n\t};\n\n\treturn (\n\t\t<Stack direction=\"row\">\n\t\t\t<TextField\n\t\t\t\tsize=\"tiny\"\n\t\t\t\ttype=\"number\"\n\t\t\t\tvalue={ propValue.size }\n\t\t\t\tonChange={ handleSizeChange }\n\t\t\t\tplaceholder={ placeholder }\n\t\t\t/>\n\t\t\t<Select\n\t\t\t\tsize=\"tiny\"\n\t\t\t\tvalue={ propValue.unit }\n\t\t\t\tonChange={ handleUnitChange }\n\t\t\t\tMenuProps={ {\n\t\t\t\t\tanchorOrigin: { vertical: 'bottom', horizontal: 'right' },\n\t\t\t\t\ttransformOrigin: { vertical: 'top', horizontal: 'right' },\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ units.map( ( unit ) => (\n\t\t\t\t\t<MenuItem key={ unit } value={ unit }>\n\t\t\t\t\t\t{ unit.toUpperCase() }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) ) }\n\t\t\t</Select>\n\t\t</Stack>\n\t);\n};\n\nconst defaultState: SizeControlValue = {\n\t$$type: 'size',\n\tvalue: { unit: 'px', size: 0 },\n};\n","import { panel } from './panel';\nimport { injectIntoLogic } from '@elementor/editor';\nimport { shouldUseV2Panel } from './sync/should-use-v2-panel';\nimport { EditingPanelHooks } from './components/editing-panel/editing-panel-hooks';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { __privateBlockDataCommand as blockDataCommand } from '@elementor/editor-v1-adapters';\n\nexport default function init() {\n\tregisterPanel( panel );\n\tblockV1Panel();\n\n\tinjectIntoLogic( {\n\t\tid: 'editing-panel-hooks',\n\t\tcomponent: EditingPanelHooks,\n\t} );\n}\n\nconst blockV1Panel = () => {\n\tblockDataCommand( {\n\t\tcommand: 'panel/editor/open',\n\t\tcondition: shouldUseV2Panel,\n\t} );\n};\n","import getSelectedElements from './get-selected-elements';\nimport getWidgetsCache from './get-widgets-cache';\n\nexport const shouldUseV2Panel = () => {\n\tconst selectedElements = getSelectedElements();\n\tconst widgetCache = getWidgetsCache();\n\n\tif ( selectedElements.length !== 1 ) {\n\t\treturn false;\n\t}\n\n\t// Check if the selected element has atomic controls, meaning it's a V2 element.\n\treturn !! widgetCache?.[ selectedElements[ 0 ].type ]?.atomic_controls;\n};\n","import { useEffect } from 'react';\nimport { commandStartEvent, __privateListenTo as listenTo } from '@elementor/editor-v1-adapters';\nimport { usePanelActions } from '../panel';\nimport { shouldUseV2Panel } from '../sync/should-use-v2-panel';\n\nexport const useOpenEditorPanel = () => {\n\tconst { open } = usePanelActions();\n\n\tuseEffect( () => {\n\t\treturn listenTo( commandStartEvent( 'panel/editor/open' ), () => {\n\t\t\tif ( shouldUseV2Panel() ) {\n\t\t\t\topen();\n\t\t\t}\n\t\t} );\n\t}, [] ); // eslint-disable-line react-hooks/exhaustive-deps\n};\n","import { useOpenEditorPanel } from '../../hooks/use-open-editor-panel';\n\nexport const EditingPanelHooks = () => {\n\tuseOpenEditorPanel();\n\n\treturn null;\n};\n","import init from './init';\n\ninit();\n"],"mappings":"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","names":["React","__","useListenTo","commandEndEvent","useListenTo","commandEndEvent","Stack","React","__","React","Stack","React","createContext","useContext","commandEndEvent","useListenTo","useListenTo","commandEndEvent","React","Stack","React","React","React","TextField","TextField","Stack","React","React","createContext","useContext","Context","useListenTo","commandEndEvent","useListenTo","commandEndEvent","Stack","React","React","runCommand","runCommand","commandEndEvent","useListenTo","useListenTo","commandEndEvent","Typography","Label","React","MenuItem","Select","Stack","TextField","units","Stack","TextField","Select","MenuItem","Stack","Control","Stack","Stack","__","__"]}
+{"version":3,"sources":["../src/panel.ts","../src/components/editing-panel/editing-panel.tsx","../src/hooks/use-selected-elements.ts","../src/sync/get-selected-elements.ts","../src/hooks/use-element-type.ts","../src/sync/get-widgets-cache.ts","../src/contexts/element-context.tsx","../src/components/editing-panel/editing-panel-tabs.tsx","../src/components/editing-panel/settings-tab.tsx","../src/components/controls/settings-control.tsx","../src/contexts/control-context.tsx","../src/hooks/use-widget-settings.ts","../src/sync/get-container.ts","../src/sync/update-settings.ts","../src/components/controls/collapsible-section.tsx","../src/components/controls/control-types/select-control.tsx","../src/components/controls/control-types/text-area-control.tsx","../src/components/controls/control-types/text-control.tsx","../src/components/controls/get-control-by-type.ts","../src/components/editing-panel/style-tab/style-tab.tsx","../src/contexts/style-context.tsx","../src/hooks/use-element-styles.ts","../src/sync/get-element-styles.ts","../src/components/editing-panel/style-tab/sections/size.tsx","../src/components/controls/style-control.tsx","../src/sync/update-style.ts","../src/hooks/use-element-style-prop.ts","../src/components/controls/control-types/size-control.tsx","../src/init.ts","../src/sync/should-use-v2-panel.ts","../src/hooks/use-open-editor-panel.ts","../src/components/editing-panel/editing-panel-hooks.tsx","../src/index.ts"],"sourcesContent":["import { __createPanel as createPanel } from '@elementor/editor-panels';\nimport { EditingPanel } from './components/editing-panel/editing-panel';\n\nexport const { panel, usePanelActions, usePanelStatus } = createPanel( {\n\tid: 'editing-panel',\n\tcomponent: EditingPanel,\n} );\n","import * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport useSelectedElements from '../../hooks/use-selected-elements';\nimport useElementType from '../../hooks/use-element-type';\nimport { Panel, PanelBody, PanelHeader, PanelHeaderTitle } from '@elementor/editor-panels';\nimport { ElementContext } from '../../contexts/element-context';\nimport { EditingPanelTabs } from './editing-panel-tabs';\n\nexport const EditingPanel = () => {\n\tconst elements = useSelectedElements();\n\n\tconst [ selectedElement ] = elements;\n\n\tconst elementType = useElementType( selectedElement?.type );\n\n\tif ( elements.length !== 1 || ! elementType ) {\n\t\treturn null;\n\t}\n\n\t/* translators: %s: Element type title. */\n\tconst panelTitle = __( 'Edit %s', 'elementor' ).replace( '%s', elementType.title );\n\n\treturn (\n\t\t<Panel>\n\t\t\t<PanelHeader>\n\t\t\t\t<PanelHeaderTitle>{ panelTitle }</PanelHeaderTitle>\n\t\t\t</PanelHeader>\n\t\t\t<PanelBody>\n\t\t\t\t<ElementContext element={ selectedElement }>\n\t\t\t\t\t<EditingPanelTabs />\n\t\t\t\t</ElementContext>\n\t\t\t</PanelBody>\n\t\t</Panel>\n\t);\n};\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getSelectedElements from '../sync/get-selected-elements';\n\nexport default function useSelectedElements() {\n\treturn useListenTo(\n\t\t[ commandEndEvent( 'document/elements/select' ), commandEndEvent( 'document/elements/deselect' ) ],\n\t\t() => getSelectedElements()\n\t);\n}\n","import { ExtendedWindow } from './types';\nimport { Element } from '../types';\n\nexport default function getSelectedElements(): Element[] {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\tconst selectedElements = extendedWindow.elementor?.selection?.getElements?.() ?? [];\n\n\treturn selectedElements.reduce< Element[] >( ( acc, el ) => {\n\t\tconst type = el.model.get( 'widgetType' ) || el.model.get( 'elType' );\n\n\t\tif ( type ) {\n\t\t\tacc.push( {\n\t\t\t\tid: el.model.get( 'id' ),\n\t\t\t\ttype,\n\t\t\t} );\n\t\t}\n\n\t\treturn acc;\n\t}, [] );\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport getWidgetsCache from '../sync/get-widgets-cache';\nimport { ElementType } from '../types';\n\nexport default function useElementType( type?: string ) {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'editor/documents/load' ),\n\t\t(): ElementType | null => {\n\t\t\tif ( ! type ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst widgetsCache = getWidgetsCache();\n\t\t\tconst elementType = widgetsCache?.[ type ];\n\n\t\t\tif ( ! elementType?.atomic_controls ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\tkey: type,\n\t\t\t\tcontrols: elementType.atomic_controls,\n\t\t\t\ttitle: elementType.title,\n\t\t\t};\n\t\t},\n\t\t[ type ]\n\t);\n}\n","import { ExtendedWindow } from './types';\n\nexport default function getWidgetsCache() {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\n\treturn extendedWindow?.elementor?.widgetsCache || null;\n}\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { Element } from '../types';\n\ntype ContextValue = {\n\telement: Element;\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\telement: Element;\n\tchildren?: ReactNode;\n};\n\nexport function ElementContext( { children, element }: Props ) {\n\treturn <Context.Provider value={ { element } }>{ children }</Context.Provider>;\n}\n\nexport function useElementContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'useElementContext must be used within a ElementContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { Stack, Tabs, Tab, TabPanel, useTabs } from '@elementor/ui';\nimport * as React from 'react';\nimport { __ } from '@wordpress/i18n';\nimport { SettingsTab } from './settings-tab';\nimport { StyleTab } from './style-tab/style-tab';\n\ntype TabValue = 'settings' | 'style';\n\nexport const EditingPanelTabs = () => {\n\tconst { getTabProps, getTabPanelProps, getTabsProps } = useTabs< TabValue >( 'settings' );\n\n\treturn (\n\t\t<Stack direction=\"column\" sx={ { width: '100%' } }>\n\t\t\t<Tabs variant=\"fullWidth\" indicatorColor=\"secondary\" textColor=\"inherit\" { ...getTabsProps() }>\n\t\t\t\t<Tab label={ __( 'General', 'elementor' ) } { ...getTabProps( 'settings' ) } />\n\t\t\t\t<Tab label={ __( 'Style', 'elementor' ) } { ...getTabProps( 'style' ) } />\n\t\t\t</Tabs>\n\t\t\t<TabPanel { ...getTabPanelProps( 'settings' ) } disablePadding>\n\t\t\t\t<SettingsTab />\n\t\t\t</TabPanel>\n\t\t\t<TabPanel { ...getTabPanelProps( 'style' ) } disablePadding>\n\t\t\t\t<StyleTab />\n\t\t\t</TabPanel>\n\t\t</Stack>\n\t);\n};\n","import * as React from 'react';\nimport { Stack } from '@elementor/ui';\nimport { SettingsControl } from '../controls/settings-control';\nimport { useElementContext } from '../../contexts/element-context';\nimport useElementType from '../../hooks/use-element-type';\nimport type { Control } from '../../types';\nimport { CollapsibleSection } from '../controls/collapsible-section';\nimport { getControlByType } from '../controls/get-control-by-type';\n\nexport const SettingsTab = () => {\n\tconst { element } = useElementContext();\n\n\tconst elementType = useElementType( element?.type );\n\n\tif ( ! elementType ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Stack>\n\t\t\t{ elementType.controls.map( ( { type, value }, index ) => {\n\t\t\t\tif ( type === 'control' ) {\n\t\t\t\t\treturn <Control key={ value.bind } control={ value } />;\n\t\t\t\t}\n\n\t\t\t\tif ( type === 'section' ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CollapsibleSection key={ type + '.' + index } title={ value.label }>\n\t\t\t\t\t\t\t{ value.items?.map( ( item ) => {\n\t\t\t\t\t\t\t\tif ( item.type === 'control' ) {\n\t\t\t\t\t\t\t\t\treturn <Control key={ item.value.bind } control={ item.value } />;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t// TODO: Handle 2nd level sections\n\t\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t</CollapsibleSection>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn null;\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n};\n\n// TODO: Create control wrapper by type for different layouts.\nconst Control = ( { control }: { control: Control[ 'value' ] } ) => {\n\tconst ControlComponent = getControlByType( control.type );\n\n\tif ( ! ControlComponent ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SettingsControl bind={ control.bind }>\n\t\t\t<SettingsControl.Label>{ control.label }</SettingsControl.Label>\n\t\t\t<ControlComponent\n\t\t\t\t/* eslint-disable-next-line @typescript-eslint/no-explicit-any */\n\t\t\t\t{ ...( control.props as any ) }\n\t\t\t/>\n\t\t</SettingsControl>\n\t);\n};\n","import * as React from 'react';\nimport { ControlContext } from '../../contexts/control-context';\nimport { Stack, styled, Typography } from '@elementor/ui';\nimport { PropKey, PropValue } from '../../types';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useWidgetSettings } from '../../hooks/use-widget-settings';\nimport { updateSettings } from '../../sync/update-settings';\n\ntype Props = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nexport const SettingsControlProvider = ( { bind, children }: Props ) => {\n\tconst { element } = useElementContext();\n\tconst value = useWidgetSettings( { id: element.id, bind } );\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateSettings( {\n\t\t\tid: element.id,\n\t\t\tprops: {\n\t\t\t\t[ bind ]: newValue,\n\t\t\t},\n\t\t} );\n\t};\n\n\treturn <ControlContext.Provider value={ { setValue, value, bind } }>{ children }</ControlContext.Provider>;\n};\n\nconst SettingsControl = ( { children, bind }: Props ) => (\n\t<SettingsControlProvider bind={ bind }>\n\t\t<StyledStack gap={ 1 } direction=\"row\" alignItems=\"center\" justifyContent=\"space-between\" flexWrap=\"wrap\">\n\t\t\t{ children }\n\t\t</StyledStack>\n\t</SettingsControlProvider>\n);\n\nconst StyledStack = styled( Stack )`\n\t& > * {\n\t\tflex-grow: 1;\n\t}\n\n\t& > label {\n\t\tmin-width: 50%;\n\t}\n`;\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nSettingsControl.Label = Label;\n\nexport { SettingsControl };\n","import { createContext, useContext } from 'react';\nimport { PropKey, PropValue } from '../types';\n\nexport type ControlContext< T extends PropValue > = {\n\tbind: PropKey;\n\tsetValue: ( value: T ) => void;\n\tvalue: T;\n};\n\nexport const ControlContext = createContext< ControlContext< PropValue > | null >( null );\n\nexport function useControl< T extends PropValue >(): ControlContext< T | undefined >;\nexport function useControl< T extends PropValue >( defaultValue: T ): ControlContext< T >;\nexport function useControl< T extends PropValue >( defaultValue?: T ) {\n\tconst controlContext = useContext< ControlContext< T > >( ControlContext as never );\n\n\tif ( ! controlContext ) {\n\t\tthrow new Error( 'useControl must be used within a ControlContext' );\n\t}\n\n\treturn { ...controlContext, value: controlContext.value ?? defaultValue };\n}\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { PropValue } from '../types';\nimport getContainer from '../sync/get-container';\n\nexport const useWidgetSettings = ( { id, bind }: { id: string; bind: string } ): PropValue => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/elements/settings' ),\n\t\t() => {\n\t\t\tconst container = getContainer( id );\n\t\t\tconst value = container?.settings?.get( bind ) ?? null;\n\n\t\t\treturn value;\n\t\t},\n\t\t[ id, bind ]\n\t);\n};\n","import { ExtendedWindow } from './types';\n\nexport default function getContainer( id: string ) {\n\tconst extendedWindow = window as unknown as ExtendedWindow;\n\tconst container = extendedWindow.elementor?.getContainer?.( id );\n\n\treturn container ?? null;\n}\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { Props } from '../types';\nimport getContainer from './get-container';\n\nexport const updateSettings = ( { id, props }: { id: string; props: Props } ) => {\n\tconst container = getContainer( id );\n\n\trunCommand( 'document/elements/settings', {\n\t\tcontainer,\n\t\tsettings: {\n\t\t\t...props,\n\t\t},\n\t} );\n};\n","import * as React from 'react';\nimport { useId } from 'react';\nimport { Accordion, AccordionSummary, AccordionDetails, AccordionSummaryText, Stack } from '@elementor/ui';\n\nexport type CollapsibleSectionProps = React.PropsWithChildren< {\n\ttitle: React.ReactNode;\n} >;\n\nexport const CollapsibleSection = ( { title, children }: CollapsibleSectionProps ) => {\n\tconst uid = useId();\n\tconst labelId = `label-${ uid }`;\n\tconst contentId = `content-${ uid }`;\n\n\t// TODO: Change to collapsible list item\n\treturn (\n\t\t<Accordion disableGutters defaultExpanded>\n\t\t\t<AccordionSummary aria-controls={ contentId } id={ labelId }>\n\t\t\t\t<AccordionSummaryText primaryTypographyProps={ { variant: 'caption' } }>{ title }</AccordionSummaryText>\n\t\t\t</AccordionSummary>\n\t\t\t<AccordionDetails id={ contentId } aria-labelledby={ labelId }>\n\t\t\t\t<Stack gap={ 2.5 }>{ children }</Stack>\n\t\t\t</AccordionDetails>\n\t\t</Accordion>\n\t);\n};\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { PropValue } from '../../../types';\n\ntype Props< T > = {\n\toptions: Array< { label: string; value: T; disabled?: boolean } >;\n};\n\nexport const SelectControl = < T extends PropValue >( { options }: Props< T > ) => {\n\tconst { value, setValue } = useControl< T >();\n\n\tconst handleChange = ( event: SelectChangeEvent< T > ) => {\n\t\tsetValue( event.target.value as T );\n\t};\n\n\treturn (\n\t\t<Select size=\"tiny\" value={ value ?? '' } onChange={ handleChange }>\n\t\t\t{ options.map( ( { label, ...props } ) => (\n\t\t\t\t<MenuItem key={ props.value } { ...props }>\n\t\t\t\t\t{ label }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</Select>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\ntype Props = {\n\tplaceholder?: string;\n};\n\nexport const TextAreaControl = ( { placeholder }: Props ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tsetValue( event.target.value );\n\t};\n\n\treturn (\n\t\t<TextField\n\t\t\tsize=\"tiny\"\n\t\t\tmultiline\n\t\t\tfullWidth\n\t\t\trows={ 5 }\n\t\t\tvalue={ value }\n\t\t\tonChange={ handleChange }\n\t\t\tplaceholder={ placeholder }\n\t\t/>\n\t);\n};\n","import * as React from 'react';\nimport { TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\n\nexport const TextControl = ( { placeholder }: { placeholder?: string } ) => {\n\tconst { value, setValue } = useControl< string >( '' );\n\n\tconst handleChange = ( event: React.ChangeEvent< HTMLInputElement > ) => setValue( event.target.value );\n\n\treturn <TextField type=\"text\" size=\"tiny\" value={ value } onChange={ handleChange } placeholder={ placeholder } />;\n};\n","import { SelectControl } from './control-types/select-control';\nimport { TextAreaControl } from './control-types/text-area-control';\nimport { TextControl } from './control-types/text-control';\n\nconst controlTypes = {\n\tselect: SelectControl,\n\ttext: TextControl,\n\ttextarea: TextAreaControl,\n};\n\nexport const getControlByType = ( type: string ) => {\n\treturn controlTypes[ type as keyof typeof controlTypes ] ?? null;\n};\n","import * as React from 'react';\nimport { StyleContext } from '../../../contexts/style-context';\nimport { useElementContext } from '../../../contexts/element-context';\nimport { useElementStyles } from '../../../hooks/use-element-styles';\nimport { Stack } from '@elementor/ui';\nimport { SizeSection } from './sections/size';\n\nexport const StyleTab = () => {\n\tconst { element } = useElementContext();\n\tconst elementStyles = useElementStyles( element.id );\n\t// TODO: Handle selected style state.\n\tconst [ selectedStyleDef = null ] = Object.values( elementStyles || {} );\n\n\treturn (\n\t\t<StyleContext selectedStyleDef={ selectedStyleDef }>\n\t\t\t<Stack>\n\t\t\t\t<SizeSection />\n\t\t\t</Stack>\n\t\t</StyleContext>\n\t);\n};\n","import * as React from 'react';\nimport { createContext, ReactNode, useContext } from 'react';\nimport { useActiveBreakpoint } from '@elementor/editor-responsive';\nimport { StyleDefinition, StyleVariant } from '@elementor/editor-style';\n\ntype ContextValue = {\n\tselectedStyleDef: StyleDefinition | null;\n\tselectedMeta: StyleVariant[ 'meta' ];\n};\n\nconst Context = createContext< ContextValue | null >( null );\n\ntype Props = {\n\tchildren: ReactNode;\n\tselectedStyleDef: StyleDefinition | null;\n};\n\nexport function StyleContext( { children, selectedStyleDef }: Props ) {\n\tconst breakpoint = useActiveBreakpoint();\n\t// TODO: Handle state when we support it.\n\tconst selectedMeta = { breakpoint, state: null } as const;\n\n\treturn <Context.Provider value={ { selectedStyleDef, selectedMeta } }>{ children }</Context.Provider>;\n}\n\nexport function useStyleContext() {\n\tconst context = useContext( Context );\n\n\tif ( ! context ) {\n\t\tthrow new Error( 'UseStyleContext must be used within a StyleContextProvider' );\n\t}\n\n\treturn context;\n}\n","import { __privateUseListenTo as useListenTo, commandEndEvent } from '@elementor/editor-v1-adapters';\nimport { getElementStyles } from '../sync/get-element-styles';\nimport { ElementID } from '../types';\n\nexport const useElementStyles = ( elementID: ElementID ) => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\treturn getElementStyles( elementID );\n\t\t},\n\t\t[ elementID ]\n\t);\n};\n","import getContainer from './get-container';\nimport { ElementID } from '../types';\nimport { StyleDefinition } from '@elementor/editor-style';\n\nexport const getElementStyles = ( elementID: ElementID ): Record< string, StyleDefinition > | null => {\n\tconst container = getContainer( elementID );\n\n\treturn container?.model.get( 'styles' ) || null;\n};\n","import * as React from 'react';\nimport { CollapsibleSection } from '../../../controls/collapsible-section';\nimport { StyleControl, StyleControlProps } from '../../../controls/style-control';\nimport { SizeControl, Unit } from '../../../controls/control-types/size-control';\nimport { Stack } from '@elementor/ui';\nimport { __ } from '@wordpress/i18n';\n\nexport const SizeSection = () => {\n\treturn (\n\t\t<CollapsibleSection title={ __( 'Size', 'elementor' ) }>\n\t\t\t<Stack gap={ 1.5 }>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"width\" label={ __( 'Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"height\" label={ __( 'Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"min-width\" label={ __( 'Min. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"min-height\" label={ __( 'Min. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap={ 2 }>\n\t\t\t\t\t<Control bind=\"max-width\" label={ __( 'Max. Width', 'elementor' ) } />\n\t\t\t\t\t<Control bind=\"max-height\" label={ __( 'Max. Height', 'elementor' ) } />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t</CollapsibleSection>\n\t);\n};\n\nconst units: Unit[] = [ 'px', '%', 'em', 'rem', 'vw' ];\n\ntype ControlProps = {\n\tbind: StyleControlProps[ 'bind' ];\n\tlabel: string;\n};\n\nconst Control = ( { label, bind }: ControlProps ) => {\n\treturn (\n\t\t<StyleControl bind={ bind }>\n\t\t\t<Stack gap={ 1 } sx={ { flex: '0 1 50%' } }>\n\t\t\t\t<StyleControl.Label>{ label }</StyleControl.Label>\n\t\t\t\t<SizeControl units={ units } />\n\t\t\t</Stack>\n\t\t</StyleControl>\n\t);\n};\n","import * as React from 'react';\nimport { PropKey, PropValue } from '../../types';\nimport { ControlContext } from '../../contexts/control-context';\nimport { updateStyle } from '../../sync/update-style';\nimport { useElementStyleProp } from '../../hooks/use-element-style-prop';\nimport { useElementContext } from '../../contexts/element-context';\nimport { useStyleContext } from '../../contexts/style-context';\nimport { Typography } from '@elementor/ui';\n\nexport type StyleControlProps = {\n\tbind: PropKey;\n\tchildren: React.ReactNode;\n};\n\nconst StyleControl = ( { bind, children }: StyleControlProps ) => {\n\tconst { element } = useElementContext();\n\tconst { selectedStyleDef, selectedMeta } = useStyleContext();\n\n\tconst setValue = ( newValue: PropValue ) => {\n\t\tupdateStyle( {\n\t\t\telementID: element.id,\n\t\t\tstyleDefID: selectedStyleDef?.id,\n\t\t\tprops: { [ bind ]: newValue },\n\t\t\tmeta: selectedMeta,\n\t\t} );\n\t};\n\n\tconst value = useElementStyleProp( {\n\t\telementID: element.id,\n\t\tstyleDefID: selectedStyleDef?.id,\n\t\tmeta: selectedMeta,\n\t\tpropName: bind,\n\t} );\n\n\treturn <ControlContext.Provider value={ { bind, value, setValue } }>{ children }</ControlContext.Provider>;\n};\n\nconst Label = ( { children }: { children: React.ReactNode } ) => {\n\treturn (\n\t\t<Typography component=\"label\" variant=\"caption\" color=\"text.secondary\">\n\t\t\t{ children }\n\t\t</Typography>\n\t);\n};\n\nStyleControl.Label = Label;\n\nexport { StyleControl };\n","import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, Props } from '../types';\nimport getContainer from './get-container';\nimport { StyleDefinitionID, StyleVariant } from '@elementor/editor-style';\n\nexport type UpdateStyleProps = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefinitionID;\n\tmeta: StyleVariant[ 'meta' ];\n\tprops: Props;\n\tbind?: PropKey;\n};\n\nexport const updateStyle = ( { elementID, styleDefID, meta, props, bind = 'classes' }: UpdateStyleProps ) => {\n\tconst container = getContainer( elementID );\n\n\trunCommand( 'document/atomic-widgets/styles', {\n\t\tcontainer,\n\t\tstyleDefID,\n\t\tbind,\n\t\tmeta,\n\t\tprops,\n\t} );\n};\n","import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';\nimport { ElementID, PropKey, PropValue } from '../types';\nimport { getElementStyles } from '../sync/get-element-styles';\nimport { StyleDefinition, StyleDefinitionID, StyleVariant } from '@elementor/editor-style';\n\nexport type UseElementStylePropArgs = {\n\telementID: ElementID;\n\tstyleDefID?: StyleDefinitionID;\n\tmeta: StyleVariant[ 'meta' ];\n\tpropName: PropKey;\n};\n\nexport const useElementStyleProp = < T extends PropValue >( {\n\telementID,\n\tstyleDefID,\n\tmeta,\n\tpropName,\n}: UseElementStylePropArgs ): T | null => {\n\treturn useListenTo(\n\t\tcommandEndEvent( 'document/atomic-widgets/styles' ),\n\t\t() => {\n\t\t\t// TODO: return default value for style prop\n\t\t\tif ( ! styleDefID ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst styleDef = getElementStyles( elementID )?.[ styleDefID ];\n\n\t\t\tif ( ! styleDef ) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst variant = getVariantByMeta( styleDef, meta );\n\n\t\t\treturn variant?.props[ propName ] ?? null;\n\t\t},\n\t\t[ elementID, styleDefID, propName, meta ]\n\t) as T;\n};\n\nfunction getVariantByMeta( styleDef: StyleDefinition, meta: StyleVariant[ 'meta' ] ) {\n\treturn styleDef.variants.find( ( variant ) => {\n\t\treturn variant.meta.breakpoint === meta.breakpoint && variant.meta.state === meta.state;\n\t} );\n}\n","import * as React from 'react';\nimport { MenuItem, Select, SelectChangeEvent, Stack, TextField } from '@elementor/ui';\nimport { useControl } from '../../../contexts/control-context';\nimport { TransformablePropValue } from '../../../types';\n\nexport type SizeControlProps = {\n\tunits: Unit[];\n\tplaceholder?: string;\n};\n\nexport type Unit = 'px' | '%' | 'em' | 'rem' | 'vw';\n\nexport type SizeControlValue = TransformablePropValue< { unit: Unit; size: number } >;\n\nexport const SizeControl = ( { units, placeholder }: SizeControlProps ) => {\n\tconst { value, setValue } = useControl< SizeControlValue >( defaultState );\n\tconst propValue = value.value;\n\n\tconst handleUnitChange = ( event: SelectChangeEvent< Unit > ) => {\n\t\tconst unit = event.target.value as Unit;\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, unit } } );\n\t};\n\n\tconst handleSizeChange = ( event: React.ChangeEvent< HTMLInputElement > ) => {\n\t\tconst { valueAsNumber: size } = event.target;\n\n\t\tif ( Number.isNaN( size ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetValue( { $$type: 'size', value: { ...propValue, size } } );\n\t};\n\n\treturn (\n\t\t<Stack direction=\"row\">\n\t\t\t<TextField\n\t\t\t\tsize=\"tiny\"\n\t\t\t\ttype=\"number\"\n\t\t\t\tvalue={ propValue.size }\n\t\t\t\tonChange={ handleSizeChange }\n\t\t\t\tplaceholder={ placeholder }\n\t\t\t/>\n\t\t\t<Select\n\t\t\t\tsize=\"tiny\"\n\t\t\t\tvalue={ propValue.unit }\n\t\t\t\tonChange={ handleUnitChange }\n\t\t\t\tMenuProps={ {\n\t\t\t\t\tanchorOrigin: { vertical: 'bottom', horizontal: 'right' },\n\t\t\t\t\ttransformOrigin: { vertical: 'top', horizontal: 'right' },\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ units.map( ( unit ) => (\n\t\t\t\t\t<MenuItem key={ unit } value={ unit }>\n\t\t\t\t\t\t{ unit.toUpperCase() }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t) ) }\n\t\t\t</Select>\n\t\t</Stack>\n\t);\n};\n\nconst defaultState: SizeControlValue = {\n\t$$type: 'size',\n\tvalue: { unit: 'px', size: 0 },\n};\n","import { panel } from './panel';\nimport { injectIntoLogic } from '@elementor/editor';\nimport { shouldUseV2Panel } from './sync/should-use-v2-panel';\nimport { EditingPanelHooks } from './components/editing-panel/editing-panel-hooks';\nimport { __registerPanel as registerPanel } from '@elementor/editor-panels';\nimport { __privateBlockDataCommand as blockDataCommand } from '@elementor/editor-v1-adapters';\n\nexport default function init() {\n\tregisterPanel( panel );\n\tblockV1Panel();\n\n\tinjectIntoLogic( {\n\t\tid: 'editing-panel-hooks',\n\t\tcomponent: EditingPanelHooks,\n\t} );\n}\n\nconst blockV1Panel = () => {\n\tblockDataCommand( {\n\t\tcommand: 'panel/editor/open',\n\t\tcondition: shouldUseV2Panel,\n\t} );\n};\n","import getSelectedElements from './get-selected-elements';\nimport getWidgetsCache from './get-widgets-cache';\n\nexport const shouldUseV2Panel = () => {\n\tconst selectedElements = getSelectedElements();\n\tconst widgetCache = getWidgetsCache();\n\n\tif ( selectedElements.length !== 1 ) {\n\t\treturn false;\n\t}\n\n\t// Check if the selected element has atomic controls, meaning it's a V2 element.\n\treturn !! widgetCache?.[ selectedElements[ 0 ].type ]?.atomic_controls;\n};\n","import { useEffect } from 'react';\nimport { commandStartEvent, __privateListenTo as listenTo } from '@elementor/editor-v1-adapters';\nimport { usePanelActions } from '../panel';\nimport { shouldUseV2Panel } from '../sync/should-use-v2-panel';\n\nexport const useOpenEditorPanel = () => {\n\tconst { open } = usePanelActions();\n\n\tuseEffect( () => {\n\t\treturn listenTo( commandStartEvent( 'panel/editor/open' ), () => {\n\t\t\tif ( shouldUseV2Panel() ) {\n\t\t\t\topen();\n\t\t\t}\n\t\t} );\n\t}, [] ); // eslint-disable-line react-hooks/exhaustive-deps\n};\n","import { useOpenEditorPanel } from '../../hooks/use-open-editor-panel';\n\nexport const EditingPanelHooks = () => {\n\tuseOpenEditorPanel();\n\n\treturn null;\n};\n","import init from './init';\n\ninit();\n"],"mappings":"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","names":["React","__","useListenTo","commandEndEvent","useListenTo","commandEndEvent","Stack","React","__","React","Stack","React","createContext","useContext","commandEndEvent","useListenTo","useListenTo","commandEndEvent","React","Stack","React","React","React","TextField","TextField","Stack","React","React","createContext","useContext","Context","useListenTo","commandEndEvent","useListenTo","commandEndEvent","Stack","React","React","runCommand","runCommand","commandEndEvent","useListenTo","useListenTo","commandEndEvent","Typography","Label","React","MenuItem","Select","Stack","TextField","units","Stack","TextField","Select","MenuItem","Stack","Control","Stack","Stack","__","__"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elementor/editor-editing-panel",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "private": false,
   "author": "Elementor Team",
   "homepage": "https://elementor.com/",
@@ -41,7 +41,8 @@
   "dependencies": {
     "@elementor/editor": "^0.12.0",
     "@elementor/editor-panels": "^0.5.0",
-    "@elementor/editor-responsive": "^0.11.1",
+    "@elementor/editor-responsive": "^0.12.0",
+    "@elementor/editor-style": "^0.1.0",
     "@elementor/editor-v1-adapters": "^0.8.1",
     "@elementor/ui": "^1.14.2",
     "@wordpress/i18n": "^4.45.0"
@@ -49,5 +50,5 @@
   "peerDependencies": {
     "react": "^18.3.1"
   },
-  "gitHead": "78f7255384f126ecbd3ffe187f592388ad43bf5f"
+  "gitHead": "9bb2a2ab74c81e97ba6a060ab2867efb15b9e5c4"
 }

package/src/contexts/style-context.tsx

@@ -1,11 +1,11 @@
 import * as React from 'react';
 import { createContext, ReactNode, useContext } from 'react';
-import { StyleDefinition, StyleDefMeta } from '../types';
 import { useActiveBreakpoint } from '@elementor/editor-responsive';
+import { StyleDefinition, StyleVariant } from '@elementor/editor-style';
 
 type ContextValue = {
 	selectedStyleDef: StyleDefinition | null;
-	selectedMeta: StyleDefMeta;
+	selectedMeta: StyleVariant[ 'meta' ];
 };
 
 const Context = createContext< ContextValue | null >( null );

package/src/hooks/use-element-style-prop.ts

@@ -1,11 +1,12 @@
 import { commandEndEvent, __privateUseListenTo as useListenTo } from '@elementor/editor-v1-adapters';
-import { ElementID, PropKey, PropValue, StyleDefID, StyleDefinition, StyleDefMeta } from '../types';
+import { ElementID, PropKey, PropValue } from '../types';
 import { getElementStyles } from '../sync/get-element-styles';
+import { StyleDefinition, StyleDefinitionID, StyleVariant } from '@elementor/editor-style';
 
 export type UseElementStylePropArgs = {
 	elementID: ElementID;
-	styleDefID?: StyleDefID;
-	meta: StyleDefMeta;
+	styleDefID?: StyleDefinitionID;
+	meta: StyleVariant[ 'meta' ];
 	propName: PropKey;
 };
 
@@ -37,7 +38,7 @@ export const useElementStyleProp = < T extends PropValue >( {
 	) as T;
 };
 
-function getVariantByMeta( styleDef: StyleDefinition, meta: StyleDefMeta ) {
+function getVariantByMeta( styleDef: StyleDefinition, meta: StyleVariant[ 'meta' ] ) {
 	return styleDef.variants.find( ( variant ) => {
 		return variant.meta.breakpoint === meta.breakpoint && variant.meta.state === meta.state;
 	} );

package/src/sync/get-element-styles.ts

@@ -1,5 +1,6 @@
 import getContainer from './get-container';
-import { ElementID, StyleDefinition } from '../types';
+import { ElementID } from '../types';
+import { StyleDefinition } from '@elementor/editor-style';
 
 export const getElementStyles = ( elementID: ElementID ): Record< string, StyleDefinition > | null => {
 	const container = getContainer( elementID );

package/src/sync/types.ts

@@ -1,4 +1,5 @@
-import { ControlItem, PropValue, StyleDefID, StyleDefinition } from '../types';
+import { ControlItem, PropValue } from '../types';
+import { StyleDefinition, StyleDefinitionID } from '@elementor/editor-style';
 
 export type ExtendedWindow = Window & {
 	elementor?: {
@@ -26,7 +27,7 @@ export type V1ElementModelProps = {
 	widgetType?: string;
 	elType: string;
 	id: string;
-	styles?: Record< StyleDefID, StyleDefinition >;
+	styles?: Record< StyleDefinitionID, StyleDefinition >;
 };
 
 export type V1ElementSettingsProps = Record< string, PropValue >;

package/src/sync/update-style.ts

@@ -1,11 +1,12 @@
 import { __privateRunCommand as runCommand } from '@elementor/editor-v1-adapters';
-import { ElementID, PropKey, Props, StyleDefID, StyleDefMeta } from '../types';
+import { ElementID, PropKey, Props } from '../types';
 import getContainer from './get-container';
+import { StyleDefinitionID, StyleVariant } from '@elementor/editor-style';
 
 export type UpdateStyleProps = {
 	elementID: ElementID;
-	styleDefID?: StyleDefID;
-	meta: StyleDefMeta;
+	styleDefID?: StyleDefinitionID;
+	meta: StyleVariant[ 'meta' ];
 	props: Props;
 	bind?: PropKey;
 };

package/src/types.ts

@@ -5,39 +5,6 @@ export type Element = {
 	type: string;
 };
 
-export type Breakpoint = null | string;
-
-export type StyleDefState =
-	| null
-	| 'hover'
-	| 'focus'
-	| 'active'
-	| 'visited'
-	| 'disabled'
-	| 'checked'
-	| 'selected'
-	| 'hidden'
-	| 'visible';
-
-export type StyleDefMeta = {
-	breakpoint: Breakpoint;
-	state: StyleDefState;
-};
-
-export type StyleDefVariant = {
-	meta: StyleDefMeta;
-	props: Props;
-};
-
-export type StyleDefID = string;
-
-export type StyleDefinition = {
-	id: StyleDefID;
-	variants: StyleDefVariant[];
-	label?: string;
-	type: 'class';
-};
-
 export type ElementType = {
 	key: string;
 	controls: ControlItem[];