Variable Configurations Editor API

API Reference vce-variable-configurations-editor

Required Child Components

vce-variable-configurations-editor must have the following child components:

• vce-variables-list This child component must have a `vce-variables-list` attribute
• vce-variable-editor-dialog This child component must have a `vce-variable-editor-dialog` attribute

HTML Attributes API

Events

{
    detail: []
}

API Reference vce-variables-list

HTML Attributes API

Translation strings

{
  columnName: 'Name',
  columnDefaultValue: 'Value',
  columnEditable: 'Editable',
  tooltipActionEdit: 'Edit',
  tooltipActionCopy: 'Copy',
  tooltipActionDelete: 'Delete',
  types: {
    string: 'String',
    color: 'Color',
    integer: 'Number - Integer',
    decimal: 'Number - Decimal',
    select: 'Selectable',
    image: 'Image',
  }

API Reference vce-variable-editor-dialog

HTML Attributes API

Translation strings

{
  dialogTitleCreate: 'Create Variable',
  dialogTitleCopy: 'Copy Variable',
  dialogTitleEdit: 'Edit Variable',
  name: {
    title: 'Variable name',
    helper:
      'You can refer to the variable in the code with the name set here, using the following format: ‘{ variables.myVariable }’.
Variable names can only contain Latin letters (A-Z, a-z).',
    placeholder: 'Enter the name to be used in the code.',
  },
  displayName: {
    title: 'Display name',
    helper: 'Variables will be listed with their display name on the Style Settings tab to the editor of the campaign.',
    placeholder: 'Enter a describing name.',
  },
  types: {
    title: 'Variable type',
    color: 'Color',
    decimal: 'Number - Decimal',
    integer: 'Number - Integer',
    string: 'String',
    select: 'Select',
    image: 'Image',
  },
  isOverridable: {
    title: 'Editable',
    helper: 'Editable variables will be visible and editable for the editor of the campaign on the Style Settings tab.',
    enabledState: 'Editable by the editor of the campaign',
    disabledState: "You cannot set a 'String' type variable to editable.",
  },
  defaultValue: {
    title: 'Default value',
    placeholder: 'Enter a value',
    select: {
      defaultColumn: 'Default',
      nameColumn: 'Item Name',
      valueColumn: 'Item Value',
    },
    image: {
      mediaDB: 'Media DB',
    },
  },
  create: 'Create',
  createCopy: 'Create Copy',
  apply: 'Apply',
  cancel: 'Cancel',
  validationErrors: {
    wrongIdFormat: 'This variable name is invalid. Please use only Latin letters (A-Z, a-z).',
    idAlreadyUsed: 'This variable name is already in use. Please try a new one.',
    wrongValue: 'This variable value is invalid. Please do not use curly brackets ({, }).',
    wrongImage: 'The image URL cannot be found.',
  },
}

Translation strings

{
  resetButtonTooltip: 'Reset button',
  emptyStateTitle: 'No Settings to Show',
  emptyStateLead:
    'Style settings can be defined in the template as variables to provide more flexible campaign formatting options.',
  emptyStateLinkButton: 'Learn more',
  emptyStateLinkUrl: 'https://help.emarsys.com/hc/en-us/articles/360003076334-Email-Style-Settings',
  defaultValue: {
    image: {
      mediaDB: 'Media DB',
    },
  },
  validationErrors: {
    wrongImage: 'The image URL cannot be found.',
    wrongIdFormat: 'This variable name is invalid. Please use only Latin letters (A-Z, a-z).',
    idAlreadyUsed: 'This variable name is already in use. Please try a new one.',
    wrongValue: 'This variable value is invalid. Please do not use curly brackets ({, }).',
  },
  applyButton: 'Apply',
  cancelButton: 'Cancel',
}