You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: blazor/blockeditor/built-in-blocks/built-in-blocks.md
+5-5Lines changed: 5 additions & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,13 +9,13 @@ documentation: ug
9
9
10
10
# Blocks in Blazor BlockEditor component
11
11
12
-
The Syncfusion Block Editor uses **Blocks** as the fundamental units for creating and managing content. The entire editor content is structured as a collection of these blocks, which are configured and managed through the [Blocks] property.
12
+
The Syncfusion Block Editor uses **Blocks** as the fundamental units for creating and managing content. The entire editor content is structured as a collection of these blocks, which are configured and managed through the `Blocks` property.
13
13
14
14
## Blocks
15
15
16
16
Blocks are the core building elements of the editor, where each block represents a distinct content unit, such as a `Paragraph`, `Heading`, `List`, or specialized content like a `Code snippet` or `Image`. This block-based architecture makes it easy for users to rearrange, format, and manage discrete pieces of content independently.
17
17
18
-
You can configure blocks with various properties such as [ID], [BlockType], [Content]to create a rich, structured editor.
18
+
You can configure blocks with various properties such as `ID`, `BlockType`, `Content`to create a rich, structured editor.
19
19
20
20
## Block types
21
21
@@ -37,9 +37,9 @@ The Block Editor supports multiple block types, each offering different formatti
37
37
38
38
## Configure indent
39
39
40
-
You can specify the indentation level of a block using the [Indent] property. This property accepts a numeric value that determines how deeply a block is nested from the left margin.
40
+
You can specify the indentation level of a block using the `Indent` property. This property accepts a numeric value that determines how deeply a block is nested from the left margin.
41
41
42
-
By default, the [Indent] property is set to `0`.
42
+
By default, the `Indent` property is set to `0`.
43
43
44
44
```cshtml
45
45
@@ -84,7 +84,7 @@ By default, the [Indent] property is set to `0`.
84
84
85
85
## Configure CSS Class
86
86
87
-
You can apply custom styling to individual blocks using the [CssClass] property. This property accepts a string containing one or more CSS class names.
87
+
You can apply custom styling to individual blocks using the `CssClass` property. This property accepts a string containing one or more CSS class names.
88
88
89
89
Custom CSS classes allow you to define specialized styling for specific blocks in your editor.
Copy file name to clipboardExpand all lines: blazor/blockeditor/built-in-blocks/embed.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -17,7 +17,7 @@ You can use the `Image` block to showcase an image content within your editor.
17
17
18
18
### Configure Image Block
19
19
20
-
You can render an `Image` block by setting the [BlockType] property to `Image` in the block model. The `Properties` property allows you to configure the image source, allowed file types, display dimensions, and more.
20
+
You can render an `Image` block by setting the `BlockType` property to `Image` in the block model. The `Properties` property allows you to configure the image source, allowed file types, display dimensions, and more.
21
21
22
22
#### Global Image Settings
23
23
@@ -39,7 +39,7 @@ The `ImageBlockSettings` property supports the following options:
39
39
40
40
#### Configure Image Block Properties
41
41
42
-
The `Image` block [Properties] property supports the following options:
42
+
The `Image` block `Properties` property supports the following options:
Copy file name to clipboardExpand all lines: blazor/blockeditor/built-in-blocks/inline-content.md
+27-27Lines changed: 27 additions & 27 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,13 +9,13 @@ documentation: ug
9
9
10
10
# Inline Content in Blazor BlockEditor component
11
11
12
-
In the Syncfusion Block Editor, all content is organized within blocks. Each block contains a [Content] property, which is an array of inline elements that define the text and functionality within that block.
12
+
In the Syncfusion Block Editor, all content is organized within blocks. Each block contains a `Content` property, which is an array of inline elements that define the text and functionality within that block.
13
13
14
-
Each inline element in the [Content] array is an object with properties such as [ID], [ContentType], [Content], and [Styles], allowing for granular control over its appearance and behavior.
14
+
Each inline element in the `Content` array is an object with properties such as `ID`, `ContentType`, `Content`, and `Styles`, allowing for granular control over its appearance and behavior.
15
15
16
16
## Setting content type
17
17
18
-
The Block Editor supports several inline content types through the `ContentType` enum, which can be set using the [ContentType] property.
18
+
The Block Editor supports several inline content types through the `ContentType` enum, which can be set using the `ContentType` property.
|[GroupBy]| The category name for grouping similar labels. |
110
-
|[LabelColor]| The background color of the label. |
111
-
|[IconCss]| A CSS class for an icon to display with the label. |
107
+
|`ID`| A unique identifier for the label. |
108
+
|`Text`| The display text for the label. |
109
+
|`GroupBy`| The category name for grouping similar labels. |
110
+
|`LabelColor`| The background color of the label. |
111
+
|`IconCss`| A CSS class for an icon to display with the label. |
112
112
113
113
114
114
When users type the trigger character followed by text, a popup will appear showing matching label items from which they can select. The selected label will be inserted into the content as a Label content item.
115
115
116
116
### Using labels with group headers
117
117
118
-
Labels with the same [GroupBy] value will be grouped together in the label selection popup:
118
+
Labels with the same `GroupBy` value will be grouped together in the label selection popup:
119
119
120
120
The below sample demonstrates the customization of labels in the Block Editor.
121
121
122
122
## Configure mention
123
123
124
124
Mentions are references to users or entities that can be inserted into your content. You can configure mention content by setting the type property to `Mention`.
125
125
126
-
Mentions are typically triggered by the `@` character and are linked to the [Users] collection defined in the Block Editor.
126
+
Mentions are typically triggered by the `@` character and are linked to the `Users` collection defined in the Block Editor.
127
127
128
128
```cshtml
129
129
@@ -167,23 +167,23 @@ Mentions are typically triggered by the `@` character and are linked to the [Use
167
167
168
168
## Applying Inline Styles
169
169
170
-
The Block Editor allows you to apply rich formatting to `Text`, `Link`, and `Code` elements using the [Styles] property.
170
+
The Block Editor allows you to apply rich formatting to `Text`, `Link`, and `Code` elements using the `Styles` property.
171
171
172
172
The `styles` property supports the following options:
Copy file name to clipboardExpand all lines: blazor/blockeditor/built-in-blocks/list-types.md
+9-9Lines changed: 9 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,11 +9,11 @@ documentation: ug
9
9
10
10
# Lists in Blazor BlockEditor component
11
11
12
-
The Syncfusion Blazor Block Editor component uses list blocks to organize content into structured lists. To render a specific list type, set the [BlockType] property of the `BlockModel` to `BulletList`, `NumberedList`, or `Checklist`. Bullet lists are ideal for unordered items, numbered lists for ordered items, and checklists for interactive to-do lists.
12
+
The Syncfusion Blazor Block Editor component uses list blocks to organize content into structured lists. To render a specific list type, set the `BlockType` property of the `BlockModel` to `BulletList`, `NumberedList`, or `Checklist`. Bullet lists are ideal for unordered items, numbered lists for ordered items, and checklists for interactive to-do lists.
13
13
14
14
## Configure bullet list
15
15
16
-
You can render a Bullet List block by setting the [BlockType] property to `BulletList`. This block type is used to display unordered lists.
16
+
You can render a Bullet List block by setting the `BlockType` property to `BulletList`. This block type is used to display unordered lists.
17
17
18
18
### Type
19
19
@@ -28,7 +28,7 @@ You can render a Bullet List block by setting the [BlockType] property to `Bulle
28
28
29
29
### Configure placeholder
30
30
31
-
The [Placeholder] property sets the text that appears when the block is empty. The default placeholder for a bullet list is `Add item`.
31
+
The `Placeholder` property sets the text that appears when the block is empty. The default placeholder for a bullet list is `Add item`.
32
32
33
33
```cshtml
34
34
// Adding placeholder value
@@ -42,7 +42,7 @@ The [Placeholder] property sets the text that appears when the block is empty. T
42
42
43
43
## Configure numbered list
44
44
45
-
You can render a Numbered List block by setting the [BlockType] property to `NumberedList`. This block type is used to display ordered lists.
45
+
You can render a Numbered List block by setting the `BlockType` property to `NumberedList`. This block type is used to display ordered lists.
46
46
47
47
```cshtml
48
48
// Adding numberedlist block
@@ -55,7 +55,7 @@ You can render a Numbered List block by setting the [BlockType] property to `Num
55
55
56
56
### Configure placeholder
57
57
58
-
The [Placeholder] property sets the text that appears when the block is empty. The default placeholder for a numbered list is `Add item`.
58
+
The `Placeholder` property sets the text that appears when the block is empty. The default placeholder for a numbered list is `Add item`.
59
59
60
60
```cshtml
61
61
// Adding placeholder value
@@ -69,7 +69,7 @@ The [Placeholder] property sets the text that appears when the block is empty. T
69
69
70
70
## Configure checklist
71
71
72
-
You can render a Checklist block by setting the [BlockType] property to `Checklist`. This block type is used for creating interactive to-do lists.
72
+
You can render a Checklist block by setting the `BlockType` property to `Checklist`. This block type is used for creating interactive to-do lists.
73
73
74
74
```cshtml
75
75
// Adding checklist block
@@ -82,9 +82,9 @@ You can render a Checklist block by setting the [BlockType] property to `Checkli
82
82
83
83
### Configure checked state
84
84
85
-
For blocks that support selection states, such as a `Checklist`, you can configure the checked state using the `properties` property with [IsChecked].
85
+
For blocks that support selection states, such as a `Checklist`, you can configure the checked state using the `properties` property with `IsChecked`.
86
86
87
-
By default, the [IsChecked] property is set to `false`.
87
+
By default, the `IsChecked` property is set to `false`.
88
88
89
89
```cshtml
90
90
@using Syncfusion.Blazor.BlockEditor
@@ -134,7 +134,7 @@ By default, the [IsChecked] property is set to `false`.
134
134
135
135
### Configure placeholder
136
136
137
-
The [Placeholder] property sets the text that appears when the block is empty. The default placeholder for a checklist is `To Do`.
137
+
The `Placeholder` property sets the text that appears when the block is empty. The default placeholder for a checklist is `To Do`.
Copy file name to clipboardExpand all lines: blazor/blockeditor/built-in-blocks/table-block.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,11 +9,11 @@ documentation: ug
9
9
10
10
# Table Blocks in Blazor BlockEditor component
11
11
12
-
The Syncfusion Block Editor allows you to render structured data in rows and columns by setting the block's [BlockType] property to `Table`. You can customize the table layout, header, row numbers, and define columns and rows using the `Properties` property.
12
+
The Syncfusion Block Editor allows you to render structured data in rows and columns by setting the block's `BlockType` property to `Table`. You can customize the table layout, header, row numbers, and define columns and rows using the `Properties` property.
13
13
14
14
### Configure Table Block
15
15
16
-
For Table blocks, you can configure layout and structure using the [Properties] property. This property supports the following options:
16
+
For Table blocks, you can configure layout and structure using the `Properties` property. This property supports the following options:
0 commit comments