@uniformdev/canvas 19.2.0 → 19.5.1-alpha.22

package/dist/index.d.ts

@@ -6807,6 +6807,10 @@ type DismissPlaceholderMessage = {
     parentId: string;
     slotName: string;
 };
+type TriggerCompositionActionMessage = {
+    type: 'trigger-composition-action';
+    action: 'save' | 'publish';
+};
 type UpdatePreviewSettingsMessage = {
     type: 'update-preview-settings';
     settings: PreviewPanelSettings;
@@ -6816,7 +6820,7 @@ type ReportRenderedCompositionsMessage = {
     compositionIds: string[];
     url: string;
 };
-type ChannelMessage = SelectComponentMessage | ReadyMessage | UpdateCompositionMessage | UpdateCompositionInternalMessage | AddComponentMessage | MoveComponentMessage | DismissPlaceholderMessage | UpdatePreviewSettingsMessage | ReportRenderedCompositionsMessage | UpdateComponentParameterMessage | DismissPlaceholderMessage;
+type ChannelMessage = SelectComponentMessage | ReadyMessage | UpdateCompositionMessage | UpdateCompositionInternalMessage | AddComponentMessage | MoveComponentMessage | DismissPlaceholderMessage | TriggerCompositionActionMessage | UpdatePreviewSettingsMessage | ReportRenderedCompositionsMessage | UpdateComponentParameterMessage | DismissPlaceholderMessage;
 declare const isSelectComponentMessage: (message: ChannelMessage) => message is SelectComponentMessage;
 declare const isReadyMessage: (message: ChannelMessage) => message is ReadyMessage;
 declare const isUpdateCompositionMessage: (message: ChannelMessage) => message is UpdateCompositionMessage;
@@ -6825,6 +6829,7 @@ declare const isAddComponentMessage: (message: ChannelMessage) => message is Add
 declare const isMovingComponentMessage: (message: ChannelMessage) => message is MoveComponentMessage;
 declare const isUpdateComponentParameterMessage: (message: ChannelMessage) => message is UpdateComponentParameterMessage;
 declare const isDismissPlaceholderMessage: (message: ChannelMessage) => message is DismissPlaceholderMessage;
+declare const isTriggerCompositionActionMessage: (message: ChannelMessage) => message is TriggerCompositionActionMessage;
 declare const isUpdatePreviewSettingsMessage: (message: ChannelMessage) => message is UpdatePreviewSettingsMessage;
 declare const isReportRenderedCompositionsMessage: (message: ChannelMessage) => message is ReportRenderedCompositionsMessage;
 type MessageHandler = (message: ChannelMessage, originalEvent: MessageEvent) => void;
@@ -6839,6 +6844,7 @@ type Channel = {
     moveComponent: (options: Omit<MoveComponentMessage, 'type'>) => void;
     updateComponentParameter: (options: Omit<UpdateComponentParameterMessage, 'type'>) => void;
     dismissPlaceholder: (options: Omit<DismissPlaceholderMessage, 'type'>) => void;
+    triggerCompositionAction: (options: Omit<TriggerCompositionActionMessage, 'type'>) => void;
     updatePreviewSettings: (options: Omit<UpdatePreviewSettingsMessage, 'type'>) => void;
     reportRenderedCompositions: (options: Omit<ReportRenderedCompositionsMessage, 'type'>) => void;
 };
@@ -6904,6 +6910,51 @@ declare class unstable_RouteClient extends ApiClient<RouteClientOptions> {
     getRoute(options?: Omit<RouteGetParameters, 'projectId'>): Promise<ResolvedRouteGetResponse>;
 }
 
+type BindVariablesResult<TValue> = {
+    boundCount: number;
+    result: TValue;
+    errors?: string[];
+};
+type BindVariablesToObjectOptions<T> = {
+    /** The object to bind variables to. Only strings or objects are bound. */
+    value: T;
+    recursivePath?: string;
+} & Omit<BindVariablesOptions, 'value'>;
+/**
+ * Binds composition variables to an object whose string keys may have variable expressions in them.
+ * Binding is recursive.
+ */
+declare function bindVariablesToObject<T>(options: BindVariablesToObjectOptions<T>): BindVariablesResult<T>;
+
+type BindVariablesOptions = {
+    /** Current variable values table */
+    variables: DataResourceVariables;
+    /** String value to bind variables to */
+    value: string;
+    /**
+     * Text prefix for any variable binding errors that might be returned
+     * @default "Variable"
+     */
+    errorPrefix?: string;
+    /**
+     * Optionally provide overridden binding behaviour with a function.
+     * Default behaviour:
+     * - If variable is not defined, its expression is replaced by empty string and an error is returned
+     * - If variable is defined, its expression is replaced by its value
+     * @param variableName The variable name referred to in the `value` string. This is the name inside the ${} expression.
+     * @param variables The current variables table.
+     * @param errors Errors array. Push to it to add errors to the result.
+     * @returns New value for the variable reference expression, will replace the whole ${} in the result.
+     */
+    handleBinding?: (variableName: string, variables: DataResourceVariables, errors: string[]) => string;
+};
+/**
+ * Binds variables to a string that could have variable values in it.
+ * Variables are referenced in the string as ${variableName}.
+ * Literal variable values are escaped with a backslash, e.g. \${literal}
+ */
+declare function bindVariables({ variables, value, errorPrefix, handleBinding, }: BindVariablesOptions): BindVariablesResult<string>;
+
 /** Public ID of Canvas personalization component type */
 declare const CANVAS_PERSONALIZE_TYPE = "$personalization";
 /** Public ID of Canvas A/B test component type */
@@ -7118,4 +7169,4 @@ declare function mapSlotToTestVariations(slot: ComponentInstance[] | undefined):
 
 declare const CanvasClientError: typeof ApiClientError;
 
-export { AddComponentMessage, BatchEnhancer, BatchEntry, BatchInvalidationPayload, CANVAS_DRAFT_STATE, CANVAS_ENRICHMENT_TAG_PARAM, CANVAS_INTENT_TAG_PARAM, CANVAS_LOCALE_TAG_PARAM, CANVAS_LOCALIZATION_SLOT, CANVAS_LOCALIZATION_TYPE, CANVAS_PERSONALIZATION_PARAM, CANVAS_PERSONALIZE_SLOT, CANVAS_PERSONALIZE_TYPE, CANVAS_PUBLISHED_STATE, CANVAS_TEST_SLOT, CANVAS_TEST_TYPE, CANVAS_TEST_VARIANT_PARAM, CanvasClient, CanvasClientError, CanvasDefinitions, Channel, ChannelMessage, ChannelSubscription, ChildEnhancerBuilder, ComponentDefinition, ComponentDefinitionDeleteParameters, ComponentDefinitionGetParameters, ComponentDefinitionGetResponse, ComponentDefinitionParameter, ComponentDefinitionPermission, ComponentDefinitionPutParameters, ComponentDefinitionSlot, ComponentDefinitionSlugSettings, ComponentDefinitionVariant, ComponentEnhancer, ComponentEnhancerFunction, ComponentEnhancerOptions, ComponentInstance, ComponentLocationReference, ComponentOverridability, ComponentOverride, ComponentOverrides, ComponentParameter, ComponentParameterContextualEditing, ComponentParameterEnhancer, ComponentParameterEnhancerFunction, ComponentParameterEnhancerOptions, CompositionDataDiagnostic, CompositionDeleteParameters, CompositionDiagnostics, CompositionGetByIdParameters, CompositionGetByNodeIdParameters, CompositionGetByNodePathParameters, CompositionGetBySlugParameters, CompositionGetListResponse, CompositionGetOrderBy, CompositionGetParameters, CompositionGetResponse, CompositionGetValidResponses, CompositionIssue, CompositionPatternIssue, CompositionPutParameters, CompositionRelationshipsClientOptions, CompositionRelationshipsDDefinitionGetResponse, CompositionRelationshipsDefinitionApi, CompositionRelationshipsDefinitionGetParameters, CompositionResolvedGetResponse, CompositionUIStatus, DataElementBindingIssue, DataElementConnectionDefinition, DataResolutionConfigIssue, DataResolutionOption, DataResolutionOptionNegative, DataResolutionOptionPositive, DataResolutionParameters, DataResourceDefinition, DataResourceDefinitions, DataResourceInputIssue, DataResourceIssue, DataResourceVariables, DataSource, DataSourceClient, DataSourceDeleteParameters, DataSourceGetParameters, DataSourceGetResponse, DataSourcePutParameters, DataSourcesGetParameters, DataSourcesGetResponse, DataType, DataTypeClient, DataTypeDeleteParameters, DataTypeGetParameters, DataTypeGetResponse, DataTypePutParameters, DataVariableDefinition, DismissPlaceholderMessage, EDGE_CACHE_DISABLED, EDGE_DEFAULT_CACHE_TTL, EDGE_DEFAULT_L2_CACHE_TTL_IN_HOURS, EDGE_MAX_CACHE_TTL, EDGE_MAX_L2_CACHE_TTL_IN_HOURS, EDGE_MIN_CACHE_TTL, EDGE_MIN_L2_CACHE_TTL_IN_HOURS, EMPTY_COMPOSITION, EnhancerBuilder, EnhancerContext, EnhancerError, EventNames, IN_CONTEXT_EDITOR_COMPONENT_END_ROLE, IN_CONTEXT_EDITOR_COMPONENT_START_ROLE, IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID, IN_CONTEXT_EDITOR_QUERY_STRING_PARAM, IS_RENDERED_BY_UNIFORM_ATTRIBUTE, InvalidationPayload, InvalidationResult, LimitPolicy, MessageHandler, MoveComponentMessage, OverrideIssue, OverrideOptions, PLACEHOLDER_ID, PreviewEventBus, PreviewPanelSettings, ReadyMessage, ReportRenderedCompositionsMessage, ResolvedRouteGetResponse, RootComponentInstance, RouteDynamicInputs, RouteGetParameters, RouteGetResponse, RouteGetResponseComposition, RouteGetResponseEdgehancedComposition, RouteGetResponseNotFound, RouteGetResponseRedirect, SelectComponentMessage, SpecificProjectMap, SubscribeToCompositionOptions, UncachedCanvasClient, UniqueBatchEntries, UnsubscribeCallback, UpdateComponentParameterMessage, UpdateCompositionInternalMessage, UpdateCompositionMessage, UpdatePreviewSettingsMessage, UsageTrackingApi, UsageTrackingGetParameters, UsageTrackingGetResponse, UsageTrackingPostParameters, UsageTrackingPostResponse, WalkComponentTreeActions, compose, createBatchEnhancer, createCanvasChannel, createEventBus, createLimitPolicy, createUniformApiEnhancer, enhance, extractLocales, generateHash, getChannelName, getComponentJsonPointer, getComponentPath, isAddComponentMessage, isDismissPlaceholderMessage, isMovingComponentMessage, isReadyMessage, isReportRenderedCompositionsMessage, isSelectComponentMessage, isSystemComponentDefinition, isUpdateComponentParameterMessage, isUpdateCompositionInternalMessage, isUpdateCompositionMessage, isUpdatePreviewSettingsMessage, localize, mapSlotToPersonalizedVariations, mapSlotToTestVariations, nullLimitPolicy, subscribeToComposition, unstable_CompositionRelationshipClient, unstable_RouteClient, walkComponentTree };
+export { AddComponentMessage, BatchEnhancer, BatchEntry, BatchInvalidationPayload, BindVariablesOptions, BindVariablesResult, BindVariablesToObjectOptions, CANVAS_DRAFT_STATE, CANVAS_ENRICHMENT_TAG_PARAM, CANVAS_INTENT_TAG_PARAM, CANVAS_LOCALE_TAG_PARAM, CANVAS_LOCALIZATION_SLOT, CANVAS_LOCALIZATION_TYPE, CANVAS_PERSONALIZATION_PARAM, CANVAS_PERSONALIZE_SLOT, CANVAS_PERSONALIZE_TYPE, CANVAS_PUBLISHED_STATE, CANVAS_TEST_SLOT, CANVAS_TEST_TYPE, CANVAS_TEST_VARIANT_PARAM, CanvasClient, CanvasClientError, CanvasDefinitions, Channel, ChannelMessage, ChannelSubscription, ChildEnhancerBuilder, ComponentDefinition, ComponentDefinitionDeleteParameters, ComponentDefinitionGetParameters, ComponentDefinitionGetResponse, ComponentDefinitionParameter, ComponentDefinitionPermission, ComponentDefinitionPutParameters, ComponentDefinitionSlot, ComponentDefinitionSlugSettings, ComponentDefinitionVariant, ComponentEnhancer, ComponentEnhancerFunction, ComponentEnhancerOptions, ComponentInstance, ComponentLocationReference, ComponentOverridability, ComponentOverride, ComponentOverrides, ComponentParameter, ComponentParameterContextualEditing, ComponentParameterEnhancer, ComponentParameterEnhancerFunction, ComponentParameterEnhancerOptions, CompositionDataDiagnostic, CompositionDeleteParameters, CompositionDiagnostics, CompositionGetByIdParameters, CompositionGetByNodeIdParameters, CompositionGetByNodePathParameters, CompositionGetBySlugParameters, CompositionGetListResponse, CompositionGetOrderBy, CompositionGetParameters, CompositionGetResponse, CompositionGetValidResponses, CompositionIssue, CompositionPatternIssue, CompositionPutParameters, CompositionRelationshipsClientOptions, CompositionRelationshipsDDefinitionGetResponse, CompositionRelationshipsDefinitionApi, CompositionRelationshipsDefinitionGetParameters, CompositionResolvedGetResponse, CompositionUIStatus, DataElementBindingIssue, DataElementConnectionDefinition, DataResolutionConfigIssue, DataResolutionOption, DataResolutionOptionNegative, DataResolutionOptionPositive, DataResolutionParameters, DataResourceDefinition, DataResourceDefinitions, DataResourceInputIssue, DataResourceIssue, DataResourceVariables, DataSource, DataSourceClient, DataSourceDeleteParameters, DataSourceGetParameters, DataSourceGetResponse, DataSourcePutParameters, DataSourcesGetParameters, DataSourcesGetResponse, DataType, DataTypeClient, DataTypeDeleteParameters, DataTypeGetParameters, DataTypeGetResponse, DataTypePutParameters, DataVariableDefinition, DismissPlaceholderMessage, EDGE_CACHE_DISABLED, EDGE_DEFAULT_CACHE_TTL, EDGE_DEFAULT_L2_CACHE_TTL_IN_HOURS, EDGE_MAX_CACHE_TTL, EDGE_MAX_L2_CACHE_TTL_IN_HOURS, EDGE_MIN_CACHE_TTL, EDGE_MIN_L2_CACHE_TTL_IN_HOURS, EMPTY_COMPOSITION, EnhancerBuilder, EnhancerContext, EnhancerError, EventNames, IN_CONTEXT_EDITOR_COMPONENT_END_ROLE, IN_CONTEXT_EDITOR_COMPONENT_START_ROLE, IN_CONTEXT_EDITOR_EMBED_SCRIPT_ID, IN_CONTEXT_EDITOR_QUERY_STRING_PARAM, IS_RENDERED_BY_UNIFORM_ATTRIBUTE, InvalidationPayload, InvalidationResult, LimitPolicy, MessageHandler, MoveComponentMessage, OverrideIssue, OverrideOptions, PLACEHOLDER_ID, PreviewEventBus, PreviewPanelSettings, ReadyMessage, ReportRenderedCompositionsMessage, ResolvedRouteGetResponse, RootComponentInstance, RouteDynamicInputs, RouteGetParameters, RouteGetResponse, RouteGetResponseComposition, RouteGetResponseEdgehancedComposition, RouteGetResponseNotFound, RouteGetResponseRedirect, SelectComponentMessage, SpecificProjectMap, SubscribeToCompositionOptions, TriggerCompositionActionMessage, UncachedCanvasClient, UniqueBatchEntries, UnsubscribeCallback, UpdateComponentParameterMessage, UpdateCompositionInternalMessage, UpdateCompositionMessage, UpdatePreviewSettingsMessage, UsageTrackingApi, UsageTrackingGetParameters, UsageTrackingGetResponse, UsageTrackingPostParameters, UsageTrackingPostResponse, WalkComponentTreeActions, bindVariables, bindVariablesToObject, compose, createBatchEnhancer, createCanvasChannel, createEventBus, createLimitPolicy, createUniformApiEnhancer, enhance, extractLocales, generateHash, getChannelName, getComponentJsonPointer, getComponentPath, isAddComponentMessage, isDismissPlaceholderMessage, isMovingComponentMessage, isReadyMessage, isReportRenderedCompositionsMessage, isSelectComponentMessage, isSystemComponentDefinition, isTriggerCompositionActionMessage, isUpdateComponentParameterMessage, isUpdateCompositionInternalMessage, isUpdateCompositionMessage, isUpdatePreviewSettingsMessage, localize, mapSlotToPersonalizedVariations, mapSlotToTestVariations, nullLimitPolicy, subscribeToComposition, unstable_CompositionRelationshipClient, unstable_RouteClient, walkComponentTree };

package/dist/index.esm.js

@@ -1307,6 +1307,9 @@ var isUpdateComponentParameterMessage = (message) => {
 var isDismissPlaceholderMessage = (message) => {
   return message.type === "dismiss-placeholder";
 };
+var isTriggerCompositionActionMessage = (message) => {
+  return message.type === "trigger-composition-action";
+};
 var isUpdatePreviewSettingsMessage = (message) => {
   return message.type === "update-preview-settings";
 };
@@ -1401,6 +1404,13 @@ var createCanvasChannel = ({
     };
     postMessage(message);
   };
+  const triggerCompositionAction = (options) => {
+    const message = {
+      ...options,
+      type: "trigger-composition-action"
+    };
+    postMessage(message);
+  };
   const updatePreviewSettings = (options) => {
     const message = {
       ...options,
@@ -1452,6 +1462,7 @@ var createCanvasChannel = ({
     moveComponent,
     updateComponentParameter,
     dismissPlaceholder,
+    triggerCompositionAction,
     updatePreviewSettings,
     reportRenderedCompositions
   };
@@ -1555,6 +1566,80 @@ var unstable_RouteClient = class extends ApiClient5 {
   }
 };
 
+// src/utils/bindVariables.ts
+function bindVariables({
+  variables,
+  value,
+  errorPrefix = "Variable",
+  handleBinding
+}) {
+  let boundCount = 0;
+  const errors = [];
+  const defaultHandleBinding = (variableName, variables2, errors2) => {
+    const variableValue = variables2[variableName];
+    if (variableValue === void 0) {
+      errors2.push(`${errorPrefix} "${variableName}" is not defined`);
+      return "";
+    }
+    return variableValue;
+  };
+  const result = value.replace(/(?<!\\)\${([^}]+)}/g, (_match, variableName) => {
+    const variableValue = (handleBinding != null ? handleBinding : defaultHandleBinding)(variableName, variables, errors);
+    boundCount++;
+    return variableValue;
+  });
+  return { result, boundCount, errors: errors.length > 0 ? errors : void 0 };
+}
+
+// src/utils/bindVariablesToObject.ts
+import { produce } from "immer";
+function bindVariablesToObject(options) {
+  return bindVariablesToObjectRecursive(options);
+}
+function bindVariablesToObjectRecursive({
+  value,
+  recursivePath,
+  ...bindVariablesOptions
+}) {
+  let boundCount = 0;
+  const errors = [];
+  if (typeof value === "string") {
+    return bindVariables({ ...bindVariablesOptions, value });
+  }
+  if (typeof value !== "object" || value === null) {
+    return { boundCount: 0, result: value };
+  }
+  const result = produce(value, (draft) => {
+    Object.entries(draft).forEach(([property, oldValue]) => {
+      const currentObjectPath = recursivePath ? `${recursivePath}.${property}` : property;
+      if (typeof oldValue === "string") {
+        const bindResult = bindVariables({ ...bindVariablesOptions, value: oldValue });
+        if (oldValue !== bindResult.result || bindResult.errors) {
+          boundCount += bindResult.boundCount;
+          draft[property] = bindResult.result;
+          if (bindResult.errors) {
+            errors.push(...bindResult.errors.map((e) => `${currentObjectPath}: ${e}`));
+          }
+        }
+        return;
+      }
+      const childBind = bindVariablesToObject({
+        ...bindVariablesOptions,
+        value: oldValue,
+        recursivePath: currentObjectPath
+      });
+      if (childBind.boundCount || childBind.errors) {
+        boundCount += childBind.boundCount;
+        draft[property] = childBind.result;
+        if (childBind.errors) {
+          errors.push(...childBind.errors.map((e) => `${currentObjectPath}: ${e}`));
+        }
+      }
+    });
+  });
+  return { boundCount, result, errors: errors.length > 0 ? errors : void 0 };
+}
+
 // src/utils/createApiEnhancer.ts
 var createUniformApiEnhancer = ({ apiUrl }) => {
   return async (message) => {
@@ -1655,6 +1740,8 @@ export {
   PLACEHOLDER_ID,
   UncachedCanvasClient,
   UniqueBatchEntries,
+  bindVariables,
+  bindVariablesToObject,
   compose,
   createBatchEnhancer,
   createCanvasChannel,
@@ -1674,6 +1761,7 @@ export {
   isReportRenderedCompositionsMessage,
   isSelectComponentMessage,
   isSystemComponentDefinition,
+  isTriggerCompositionActionMessage,
   isUpdateComponentParameterMessage,
   isUpdateCompositionInternalMessage,
   isUpdateCompositionMessage,

package/dist/index.js

@@ -311,6 +311,8 @@ __export(src_exports, {
   PLACEHOLDER_ID: () => PLACEHOLDER_ID,
   UncachedCanvasClient: () => UncachedCanvasClient,
   UniqueBatchEntries: () => UniqueBatchEntries,
+  bindVariables: () => bindVariables,
+  bindVariablesToObject: () => bindVariablesToObject,
   compose: () => compose,
   createBatchEnhancer: () => createBatchEnhancer,
   createCanvasChannel: () => createCanvasChannel,
@@ -330,6 +332,7 @@ __export(src_exports, {
   isReportRenderedCompositionsMessage: () => isReportRenderedCompositionsMessage,
   isSelectComponentMessage: () => isSelectComponentMessage,
   isSystemComponentDefinition: () => isSystemComponentDefinition,
+  isTriggerCompositionActionMessage: () => isTriggerCompositionActionMessage,
   isUpdateComponentParameterMessage: () => isUpdateComponentParameterMessage,
   isUpdateCompositionInternalMessage: () => isUpdateCompositionInternalMessage,
   isUpdateCompositionMessage: () => isUpdateCompositionMessage,
@@ -1387,6 +1390,9 @@ var isUpdateComponentParameterMessage = (message) => {
 var isDismissPlaceholderMessage = (message) => {
   return message.type === "dismiss-placeholder";
 };
+var isTriggerCompositionActionMessage = (message) => {
+  return message.type === "trigger-composition-action";
+};
 var isUpdatePreviewSettingsMessage = (message) => {
   return message.type === "update-preview-settings";
 };
@@ -1481,6 +1487,13 @@ var createCanvasChannel = ({
     };
     postMessage(message);
   };
+  const triggerCompositionAction = (options) => {
+    const message = {
+      ...options,
+      type: "trigger-composition-action"
+    };
+    postMessage(message);
+  };
   const updatePreviewSettings = (options) => {
     const message = {
       ...options,
@@ -1532,6 +1545,7 @@ var createCanvasChannel = ({
     moveComponent,
     updateComponentParameter,
     dismissPlaceholder,
+    triggerCompositionAction,
     updatePreviewSettings,
     reportRenderedCompositions
   };
@@ -1635,6 +1649,80 @@ var unstable_RouteClient = class extends import_api5.ApiClient {
   }
 };
 
+// src/utils/bindVariables.ts
+function bindVariables({
+  variables,
+  value,
+  errorPrefix = "Variable",
+  handleBinding
+}) {
+  let boundCount = 0;
+  const errors = [];
+  const defaultHandleBinding = (variableName, variables2, errors2) => {
+    const variableValue = variables2[variableName];
+    if (variableValue === void 0) {
+      errors2.push(`${errorPrefix} "${variableName}" is not defined`);
+      return "";
+    }
+    return variableValue;
+  };
+  const result = value.replace(/(?<!\\)\${([^}]+)}/g, (_match, variableName) => {
+    const variableValue = (handleBinding != null ? handleBinding : defaultHandleBinding)(variableName, variables, errors);
+    boundCount++;
+    return variableValue;
+  });
+  return { result, boundCount, errors: errors.length > 0 ? errors : void 0 };
+}
+
+// src/utils/bindVariablesToObject.ts
+var import_immer = require("immer");
+function bindVariablesToObject(options) {
+  return bindVariablesToObjectRecursive(options);
+}
+function bindVariablesToObjectRecursive({
+  value,
+  recursivePath,
+  ...bindVariablesOptions
+}) {
+  let boundCount = 0;
+  const errors = [];
+  if (typeof value === "string") {
+    return bindVariables({ ...bindVariablesOptions, value });
+  }
+  if (typeof value !== "object" || value === null) {
+    return { boundCount: 0, result: value };
+  }
+  const result = (0, import_immer.produce)(value, (draft) => {
+    Object.entries(draft).forEach(([property, oldValue]) => {
+      const currentObjectPath = recursivePath ? `${recursivePath}.${property}` : property;
+      if (typeof oldValue === "string") {
+        const bindResult = bindVariables({ ...bindVariablesOptions, value: oldValue });
+        if (oldValue !== bindResult.result || bindResult.errors) {
+          boundCount += bindResult.boundCount;
+          draft[property] = bindResult.result;
+          if (bindResult.errors) {
+            errors.push(...bindResult.errors.map((e) => `${currentObjectPath}: ${e}`));
+          }
+        }
+        return;
+      }
+      const childBind = bindVariablesToObject({
+        ...bindVariablesOptions,
+        value: oldValue,
+        recursivePath: currentObjectPath
+      });
+      if (childBind.boundCount || childBind.errors) {
+        boundCount += childBind.boundCount;
+        draft[property] = childBind.result;
+        if (childBind.errors) {
+          errors.push(...childBind.errors.map((e) => `${currentObjectPath}: ${e}`));
+        }
+      }
+    });
+  });
+  return { boundCount, result, errors: errors.length > 0 ? errors : void 0 };
+}
+
 // src/utils/createApiEnhancer.ts
 var createUniformApiEnhancer = ({ apiUrl }) => {
   return async (message) => {
@@ -1736,6 +1824,8 @@ var CanvasClientError = import_api6.ApiClientError;
   PLACEHOLDER_ID,
   UncachedCanvasClient,
   UniqueBatchEntries,
+  bindVariables,
+  bindVariablesToObject,
   compose,
   createBatchEnhancer,
   createCanvasChannel,
@@ -1755,6 +1845,7 @@ var CanvasClientError = import_api6.ApiClientError;
   isReportRenderedCompositionsMessage,
   isSelectComponentMessage,
   isSystemComponentDefinition,
+  isTriggerCompositionActionMessage,
   isUpdateComponentParameterMessage,
   isUpdateCompositionInternalMessage,
   isUpdateCompositionMessage,

package/dist/index.mjs

@@ -1307,6 +1307,9 @@ var isUpdateComponentParameterMessage = (message) => {
 var isDismissPlaceholderMessage = (message) => {
   return message.type === "dismiss-placeholder";
 };
+var isTriggerCompositionActionMessage = (message) => {
+  return message.type === "trigger-composition-action";
+};
 var isUpdatePreviewSettingsMessage = (message) => {
   return message.type === "update-preview-settings";
 };
@@ -1401,6 +1404,13 @@ var createCanvasChannel = ({
     };
     postMessage(message);
   };
+  const triggerCompositionAction = (options) => {
+    const message = {
+      ...options,
+      type: "trigger-composition-action"
+    };
+    postMessage(message);
+  };
   const updatePreviewSettings = (options) => {
     const message = {
       ...options,
@@ -1452,6 +1462,7 @@ var createCanvasChannel = ({
     moveComponent,
     updateComponentParameter,
     dismissPlaceholder,
+    triggerCompositionAction,
     updatePreviewSettings,
     reportRenderedCompositions
   };
@@ -1555,6 +1566,80 @@ var unstable_RouteClient = class extends ApiClient5 {
   }
 };
 
+// src/utils/bindVariables.ts
+function bindVariables({
+  variables,
+  value,
+  errorPrefix = "Variable",
+  handleBinding
+}) {
+  let boundCount = 0;
+  const errors = [];
+  const defaultHandleBinding = (variableName, variables2, errors2) => {
+    const variableValue = variables2[variableName];
+    if (variableValue === void 0) {
+      errors2.push(`${errorPrefix} "${variableName}" is not defined`);
+      return "";
+    }
+    return variableValue;
+  };
+  const result = value.replace(/(?<!\\)\${([^}]+)}/g, (_match, variableName) => {
+    const variableValue = (handleBinding != null ? handleBinding : defaultHandleBinding)(variableName, variables, errors);
+    boundCount++;
+    return variableValue;
+  });
+  return { result, boundCount, errors: errors.length > 0 ? errors : void 0 };
+}
+
+// src/utils/bindVariablesToObject.ts
+import { produce } from "immer";
+function bindVariablesToObject(options) {
+  return bindVariablesToObjectRecursive(options);
+}
+function bindVariablesToObjectRecursive({
+  value,
+  recursivePath,
+  ...bindVariablesOptions
+}) {
+  let boundCount = 0;
+  const errors = [];
+  if (typeof value === "string") {
+    return bindVariables({ ...bindVariablesOptions, value });
+  }
+  if (typeof value !== "object" || value === null) {
+    return { boundCount: 0, result: value };
+  }
+  const result = produce(value, (draft) => {
+    Object.entries(draft).forEach(([property, oldValue]) => {
+      const currentObjectPath = recursivePath ? `${recursivePath}.${property}` : property;
+      if (typeof oldValue === "string") {
+        const bindResult = bindVariables({ ...bindVariablesOptions, value: oldValue });
+        if (oldValue !== bindResult.result || bindResult.errors) {
+          boundCount += bindResult.boundCount;
+          draft[property] = bindResult.result;
+          if (bindResult.errors) {
+            errors.push(...bindResult.errors.map((e) => `${currentObjectPath}: ${e}`));
+          }
+        }
+        return;
+      }
+      const childBind = bindVariablesToObject({
+        ...bindVariablesOptions,
+        value: oldValue,
+        recursivePath: currentObjectPath
+      });
+      if (childBind.boundCount || childBind.errors) {
+        boundCount += childBind.boundCount;
+        draft[property] = childBind.result;
+        if (childBind.errors) {
+          errors.push(...childBind.errors.map((e) => `${currentObjectPath}: ${e}`));
+        }
+      }
+    });
+  });
+  return { boundCount, result, errors: errors.length > 0 ? errors : void 0 };
+}
+
 // src/utils/createApiEnhancer.ts
 var createUniformApiEnhancer = ({ apiUrl }) => {
   return async (message) => {
@@ -1655,6 +1740,8 @@ export {
   PLACEHOLDER_ID,
   UncachedCanvasClient,
   UniqueBatchEntries,
+  bindVariables,
+  bindVariablesToObject,
   compose,
   createBatchEnhancer,
   createCanvasChannel,
@@ -1674,6 +1761,7 @@ export {
   isReportRenderedCompositionsMessage,
   isSelectComponentMessage,
   isSystemComponentDefinition,
+  isTriggerCompositionActionMessage,
   isUpdateComponentParameterMessage,
   isUpdateCompositionInternalMessage,
   isUpdateCompositionMessage,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/canvas",
-  "version": "19.2.0",
+  "version": "19.5.1-alpha.22+5b4a94102",
   "description": "Common functionality and types for Uniform Canvas",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -47,7 +47,8 @@
     "pusher-js": "8.0.1"
   },
   "dependencies": {
-    "@uniformdev/context": "19.2.0"
+    "@uniformdev/context": "19.5.1-alpha.22+5b4a94102",
+    "immer": "9.0.21"
   },
   "files": [
     "/dist"
@@ -55,5 +56,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "9eb2423cd12a5db527f9f3a9d46b47ac2a0e7eb3"
+  "gitHead": "5b4a94102c83a88c9fbf888a24d633e8abf96b76"
 }