Skip to main content
⚠️ Archived Version

You are viewing documentation for Design Editor version 7.2, which is no longer actively maintained. For the latest features and updates, please refer to the current version (7.3).

Interface: IRichTextDialogConfig

The dialog providing text formatting options.

Remarks​

For details, see the Rich text editor topic.

Example​

configuration = {
  widgets: {
    RichTextDialog: {
      bgColor: "lightgray",
      ckeditorConfig: {
        specialChars: [""", "’", ["@", "Custom label"]],
      },
      fitTextRectangle: {
        onAdd: "shrinkOrStretchToContentHeight",
        onUpdate: "stretchToContentHeight",
      },
      richComboValues: {
        padding: { max: 50, min: 5, step: 5 },
      },
      textOutline: {
        enabled: true,
      },
      toolbarConfig: [
        {
          name: "clipboard",
          items: ["Cut", "Copy", "Paste", "-", "Undo", "Redo"],
        },
        "/",
        {
          name: "basicstyles",
          items: ["Bold", "Italic", "Underline", "-", "RemoveFormat"],
        },
      ],
      wysiwygMode: true,
    },
  },
};

Properties​

forcePasteAsPlainText?​

optional forcePasteAsPlainText?: boolean

internal

bgColor?​

optional bgColor?: string

The text background color in the Rich text dialog. The default value is "white".

createMultiColumnText?​

optional createMultiColumnText?: boolean

Allows for creating multicolumn text. If true, the Columns drop-down list appears in the Top toolbar for formatted text elements. The default value is false.

applyToAllTextMode?​

optional applyToAllTextMode?: boolean

Allows you to apply formatting to a whole text field despite a text selection. This text mode is turned off by default.

wysiwygMode?​

optional wysiwygMode?: boolean

If true, the editor adjusts the text in the Rich text dialog to the appearance on the canvas as close as possible. The default value is false.

showHint​

showHint: IShowHintSettings

Enables hints in the drop-down lists. By default, the hints are enabled.

showInput?​

optional showInput?: IShowInputSettings

Enables user input in the drop-down lists. By default, the user input is enabled.

textOutline?​

optional textOutline?: ITextOutline

Enables the text outline for low-contrast texts in the Rich text dialog. The feature is turned off by default.

toolbarConfig?​

optional toolbarConfig?: (string | { name: string; items: string[]; })[]

An array defining configuration of the toolbar. The default configuration is:

[
  {
    name: "clipboard",
    items: [
      "Cut",
      "Copy",
      "Paste",
      "PasteText",
      "PasteFromWord",
      "-",
      "Undo",
      "Redo",
    ],
  },
  { name: "editing", items: ["Find", "Replace", "-", "SelectAll"] },
  { name: "insert", items: ["SpecialChar"] },
  "/",
  {
    name: "basicstyles",
    items: ["Bold", "Italic", "Underline", "-", "RemoveFormat"],
  },
  { name: "styles", items: ["Font", "FontStyle", "FontSize"] },
  { name: "colors", items: ["cc_textcolor_button"] },
  { name: "tracking", items: ["cctracking"] },
  "/",
  {
    name: "paragraph",
    items: ["JustifyLeft", "JustifyCenter", "JustifyRight"],
  },
  { name: "lists", items: ["NumberedList", "BulletedList"] },
  { name: "customerscanvas", items: ["ccleading", "cctextindent"] },
  "/",
  {
    name: "customerscanvas",
    items: [
      "ccpaddingtop",
      "ccpaddingbottom",
      "ccpaddingleft",
      "ccpaddingright",
    ],
  },
];

ckeditorConfig?​

optional ckeditorConfig?: any

An array defining the Special character list. The default list is:

[
  "!",
  """,
  "#",
  "$",
  "%",
  "&",
  "'",
  "(",
  ")",
  "*",
  "+",
  "-",
  ".",
  "/",
  "0",
  "1",
  "2",
  "3",
  "4",
  "5",
  "6",
  "7",
  "8",
  "9",
  ":",
  ";",
  "<",
  "=",
  ">",
  "?",
  "@",
  "A",
  "B",
  "C",
  "D",
  "E",
  "F",
  "G",
  "H",
  "I",
  "J",
  "K",
  "L",
  "M",
  "N",
  "O",
  "P",
  "Q",
  "R",
  "S",
  "T",
  "U",
  "V",
  "W",
  "X",
  "Y",
  "Z",
  "[",
  "]",
  "^",
  "_",
  "`",
  "a",
  "b",
  "c",
  "d",
  "e",
  "f",
  "g",
  "h",
  "i",
  "j",
  "k",
  "l",
  "m",
  "n",
  "o",
  "p",
  "q",
  "r",
  "s",
  "t",
  "u",
  "v",
  "w",
  "x",
  "y",
  "z",
  "{",
  "|",
  "}",
  "~",
  "€",
  "‘",
  "’",
  "“",
  "”",
  "–",
  "—",
  "¡",
  "¢",
  "£",
  "¤",
  "¥",
  "¦",
  "§",
  "¨",
  "©",
  "ª",
  "«",
  "¬",
  "®",
  "¯",
  "°",
  "²",
  "³",
  "´",
  "µ",
  "¶",
  "·",
  "¸",
  "¹",
  "º",
  "»",
  "¼",
  "½",
  "¾",
  "¿",
  "À",
  "Á",
  "Â",
  "Ã",
  "Ä",
  "Å",
  "Æ",
  "Ç",
  "È",
  "É",
  "Ê",
  "Ë",
  "Ì",
  "Í",
  "Î",
  "Ï",
  "Ð",
  "Ñ",
  "Ò",
  "Ó",
  "Ô",
  "Õ",
  "Ö",
  "×",
  "Ø",
  "Ù",
  "Ú",
  "Û",
  "Ü",
  "Ý",
  "Þ",
  "ß",
  "à",
  "á",
  "â",
  "ã",
  "ä",
  "å",
  "æ",
  "ç",
  "è",
  "é",
  "ê",
  "ë",
  "ì",
  "í",
  "î",
  "ï",
  "ð",
  "ñ",
  "ò",
  "ó",
  "ô",
  "õ",
  "ö",
  "÷",
  "ø",
  "ù",
  "ú",
  "û",
  "ü",
  "ý",
  "þ",
  "ÿ",
  "Œ",
  "œ",
  "Ŵ",
  "&#374",
  "&#373",
  "ŷ",
  "‚",
  "‛",
  "„",
  "…",
  "™",
  "►",
  "•",
  "→",
  "⇒",
  "⇔",
  "♦",
  "≈",
];

zoom?​

optional zoom?: IZoomConfig

A structure containing text zoom configuration.

richComboValues?​

optional richComboValues?: IRichComboValuesConfig

An object defining the indent and padding values for the Rich text dialog.

fitTextRectangle?​

optional fitTextRectangle?: IFitTextRectangleSettings

Allows for fitting the bounding rectangle to the text size.

Was this page helpful?