diff --git a/packages/builder/src/builderStore/dataBinding.js b/packages/builder/src/builderStore/dataBinding.js index 8445bf9e6d..246590a22e 100644 --- a/packages/builder/src/builderStore/dataBinding.js +++ b/packages/builder/src/builderStore/dataBinding.js @@ -228,7 +228,12 @@ export const getContextProviderComponents = ( /** * Gets all data provider components above a component. */ -export const getActionProviderComponents = (asset, componentId, actionType) => { +export const getActionProviders = ( + asset, + componentId, + actionType, + options = { includeSelf: false } +) => { if (!asset || !componentId) { return [] } @@ -236,13 +241,30 @@ export const getActionProviderComponents = (asset, componentId, actionType) => { // Get the component tree leading up to this component, ignoring the component // itself const path = findComponentPath(asset.props, componentId) - path.pop() + if (!options?.includeSelf) { + path.pop() + } - // Filter by only data provider components - return path.filter(component => { + // Find matching contexts and generate bindings + let providers = [] + path.forEach(component => { const def = store.actions.components.getDefinition(component._component) - return def?.actions?.includes(actionType) + const actions = (def?.actions || []).map(action => { + return typeof action === "string" ? { type: action } : action + }) + const action = actions.find(x => x.type === actionType) + if (action) { + let runtimeBinding = component._id + if (action.suffix) { + runtimeBinding += `-${action.suffix}` + } + providers.push({ + readableBinding: component._instanceName, + runtimeBinding, + }) + } }) + return providers } /** diff --git a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ChangeFormStep.svelte b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ChangeFormStep.svelte index 81a2119474..5905d240dc 100644 --- a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ChangeFormStep.svelte +++ b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ChangeFormStep.svelte @@ -1,17 +1,19 @@ @@ -17,8 +19,8 @@ x._instanceName} - getOptionValue={x => x._id} + getOptionLabel={x => x.readableBinding} + getOptionValue={x => x.runtimeBinding} /> diff --git a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ScrollTo.svelte b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ScrollTo.svelte index 49a93d71dd..e73884495d 100644 --- a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ScrollTo.svelte +++ b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ScrollTo.svelte @@ -1,22 +1,36 @@
@@ -24,8 +38,8 @@ x._instanceName} - getOptionValue={x => x._id} + getOptionLabel={x => x.readableBinding} + getOptionValue={x => x.runtimeBinding} /> x._instanceName} - getOptionValue={x => x._id} + getOptionLabel={x => x.readableBinding} + getOptionValue={x => x.runtimeBinding} />