generated from kontent-ai/custom-element-starter-react
-
Notifications
You must be signed in to change notification settings - Fork 2
/
readmeSnippets.ts
32 lines (29 loc) · 1.5 KB
/
readmeSnippets.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
import { Config, Value } from "../useCustomElementContext";
export const exampleConfiguration: Required<Config> = {
previewBorder: { // if defined, show a border around the diagram preview
color: "#000000", // border color
weight: 1, // border width
},
previewImageFormat: {
format: "png", // one of "svg" or "png". Set this to png when you use custom font as diagrams.net includes the font in the generated preview data-url which makes it too large.
// customFont: { // this can only be used with format: "svg"
// customFontConfigType: "nameAndUrl", // alternatively this can also be "fontFaceDefinition"
// fontUrl: "<url to our custom font>", // this must only be used with customFontConfigType: "nameAndUrl"
// fontName: "<name of our custom font, this must be used inside the svg elements>", // this must only be used with customFontConfigType: "nameAndUrl"
// // fontFaceDefinition: "<font face definition>", // this must only be used with customFontConfigType: "fontFaceDefinition"
// }
},
configuration: { // diagrams.net configuration, see https://www.diagrams.net/doc/faq/configure-diagram-editor for available keys
colorNames: {
"000000": "Our color",
},
},
};
export const exampleValue: Value = {
xml: "...", // the diagram in xml format used by diagrams.net
dataUrl: "...", // data-url of svg preview of the diagram for preview
dimensions: { // dimensions of the diagram calculated by diagrams.net
width: 100,
height: 100,
},
};