diff --git a/Documentation/Blazorise.Docs/Pages/Docs/Extensions/DataGrid/DataGridApi.razor b/Documentation/Blazorise.Docs/Pages/Docs/Extensions/DataGrid/DataGridApi.razor
index 662f8ce5f4..0e9f35b579 100644
--- a/Documentation/Blazorise.Docs/Pages/Docs/Extensions/DataGrid/DataGridApi.razor
+++ b/Documentation/Blazorise.Docs/Pages/Docs/Extensions/DataGrid/DataGridApi.razor
@@ -480,17 +480,77 @@
Whether the sort direction will be reversed.
-
- Defines the alignment for display cell.
+
+ Defines the alignment for the table cell.
+
+
+ Gets or sets the text transformation for the table cell.
+
+
+ Gets or sets the text decoration for the table cell.
+
+
+ Gets or sets the text weight for the table cell.
+
+
+ Determines how the text will behave when it is larger than a parent container for the table cell.
+
+
+ Determines the font size of an element for the table cell.
- Defines the alignment for column header cell.
+ Defines the alignment for column header cell. If undefined, the TextAlignment will be used.
+
+
+ Gets or sets the text transformation for column header cell. If undefined, the TextTransform will be used.
+
+
+ Gets or sets the text decoration for column header cell. If undefined, the TextDecoration will be used.
+
+
+ Gets or sets the text weight for column header cell. If undefined, the TextWeight will be used.
+
+
+ Determines how the text will behave when it is larger than a parent container for column header cell. If undefined, the TextOverflow will be used.
+
+
+ Determines the font size of an element for column header cell. If undefined, the TextSize will be used.
- Defines the alignment for column filter cell.
+ Defines the alignment for column filter cell. If undefined, the TextAlignment will be used.
+
+
+ Gets or sets the text transformation for column filter cell. If undefined, the TextTransform will be used.
+
+
+ Gets or sets the text decoration for column filter cell. If undefined, the TextDecoration will be used.
+
+
+ Gets or sets the text weight for column filter cell. If undefined, the TextWeight will be used.
+
+
+ Determines how the text will behave when it is larger than a parent container for column filter cell. If undefined, the TextOverflow will be used.
+
+
+ Determines the font size of an element for column filter cell. If undefined, the TextSize will be used.
- Defines the alignment for column the aggregate cell.
+ Defines the alignment for column the aggregate cell. If undefined, the TextAlignment will be used.
+
+
+ Gets or sets the text transformation for column aggregate cell. If undefined, the TextTransform will be used.
+
+
+ Gets or sets the text decoration for column aggregate cell. If undefined, the TextDecoration will be used.
+
+
+ Gets or sets the text weight for column aggregate cell. If undefined, the TextWeight will be used.
+
+
+ Determines how the text will behave when it is larger than a parent container for column aggregate cell. If undefined, the TextOverflow will be used.
+
+
+ Determines the font size of an element for column aggregate cell. If undefined, the TextSize will be used.
Whether users can edit cell values under this column.
diff --git a/Documentation/Blazorise.Docs/Pages/News/2024-10-15-release-notes-170.razor b/Documentation/Blazorise.Docs/Pages/News/2024-10-15-release-notes-170.razor
index ad21f77ef5..9ad99dcf69 100644
--- a/Documentation/Blazorise.Docs/Pages/News/2024-10-15-release-notes-170.razor
+++ b/Documentation/Blazorise.Docs/Pages/News/2024-10-15-release-notes-170.razor
@@ -154,7 +154,7 @@
DataGrid
-
+
SelectedCell API
@@ -162,6 +162,18 @@
Added SelectedCell and SelectedCellChanged parameters, you can now listen to the cell selection changes when the Datagrid.NavigationMode is set to NavigationMode.Cell
+
+ Column Text Styling
+
+
+
+ Added TextTransform, TextDecoration, TextWeight, TextOverflow, and TextSize parameters to the DataGridColumn component. This will allow you to easily style the text in the DataGrid.
+
+
+
+ All the new text styling parameters are also available for headers, filter, and aggregate cells of the DataGrid.
+
+
Optimizations
diff --git a/Source/Extensions/Blazorise.DataGrid/DataGrid.razor b/Source/Extensions/Blazorise.DataGrid/DataGrid.razor
index e0b49a3133..da6b9a6d75 100644
--- a/Source/Extensions/Blazorise.DataGrid/DataGrid.razor
+++ b/Source/Extensions/Blazorise.DataGrid/DataGrid.razor
@@ -39,7 +39,7 @@
}
else
{
-
+
@if ( HeaderGroupCaptionTemplate is null )
{
@column.HeaderGroupCaption
@@ -65,7 +65,7 @@
{
@if ( IsCommandVisible || ( EditMode == DataGridEditMode.Inline || EditMode == DataGridEditMode.Cell ) )
{
-
+
@if ( CanInsertNewItem && editState != DataGridEditState.New )
{
<_DataGridNewCommand TItem="TItem" New="@New" />
@@ -82,14 +82,14 @@
{
@if ( MultiSelect )
{
-
+
<_DataGridMultiSelectAll TItem="TItem" IsIndeterminate="@IsMultiSelectAllIndeterminate" IsChecked="@IsMultiSelectAllChecked">
}
}
else
{
-
+
@if ( IsGroupableByColumn && column.Groupable )
{
@@ -148,7 +148,7 @@
{
@if ( MultiSelect )
{
-
+
@if ( column.FilterTemplate != null && column.Filterable )
{
@(column.FilterTemplate( column.Filter ))
@@ -158,7 +158,7 @@
}
else if ( !column.Filterable )
{
-
+
continue;
}
else if ( column.ColumnType == DataGridColumnType.Command )
@@ -166,7 +166,7 @@
@if ( IsCommandVisible )
{
// since Clear Filter is located in the command column it can be visible only when Edit is enabled
-
+
<_DataGridClearFilterCommand TItem="TItem" />
}
@@ -174,7 +174,7 @@
else if ( ( column.FilterMode.HasValue && column.FilterMode == DataGridFilterMode.Default ) || ( !column.FilterMode.HasValue && FilterMode == DataGridFilterMode.Default ) )
{
-
+
@if ( column.FilterTemplate != null )
{
@(column.FilterTemplate( column.Filter ))
@@ -187,7 +187,7 @@
}
else
{
-
+
}
}
diff --git a/Source/Extensions/Blazorise.DataGrid/DataGridColumn.cs b/Source/Extensions/Blazorise.DataGrid/DataGridColumn.cs
index f7634741cf..86f941cb6b 100644
--- a/Source/Extensions/Blazorise.DataGrid/DataGridColumn.cs
+++ b/Source/Extensions/Blazorise.DataGrid/DataGridColumn.cs
@@ -407,6 +407,36 @@ internal DataGridColumnFilterMethod GetDataGridFilterMethodAsColumn()
internal TextAlignment FilterCellTextAlignment
=> FilterTextAlignment ?? TextAlignment;
+ ///
+ /// Gets the text transformation for the filter cell.
+ ///
+ internal TextTransform FilterCellTextTransform
+ => FilterTextTransform ?? TextTransform;
+
+ ///
+ /// Gets the text decoration for the filter cell.
+ ///
+ internal TextDecoration FilterCellTextDecoration
+ => FilterTextDecoration ?? TextDecoration;
+
+ ///
+ /// Gets the text weight for the filter cell.
+ ///
+ internal TextWeight FilterCellTextWeight
+ => FilterTextWeight ?? TextWeight;
+
+ ///
+ /// Determines how the text will behave when it is larger than a parent container for the filter cell.
+ ///
+ internal TextOverflow FilterCellTextOverflow
+ => FilterTextOverflow ?? TextOverflow;
+
+ ///
+ /// Determines the font size of an element for the filter cell.
+ ///
+ internal IFluentTextSize FilterCellTextSize
+ => FilterTextSize ?? TextSize;
+
///
/// Determines the vertical alignment for the filter cell.
///
@@ -450,6 +480,36 @@ internal Background FilterCellBackground
internal TextAlignment HeaderCellTextAlignment
=> HeaderTextAlignment ?? TextAlignment;
+ ///
+ /// Gets the text transformation for the header cell.
+ ///
+ internal TextTransform HeaderCellTextTransform
+ => HeaderTextTransform ?? TextTransform;
+
+ ///
+ /// Gets the text decoration for the header cell.
+ ///
+ internal TextDecoration HeaderCellTextDecoration
+ => HeaderTextDecoration ?? TextDecoration;
+
+ ///
+ /// Gets the text weight for the header cell.
+ ///
+ internal TextWeight HeaderCellTextWeight
+ => HeaderTextWeight ?? TextWeight;
+
+ ///
+ /// Determines how the text will behave when it is larger than a parent container for the header cell.
+ ///
+ internal TextOverflow HeaderCellTextOverflow
+ => HeaderTextOverflow ?? TextOverflow;
+
+ ///
+ /// Determines the font size of an element for the header cell.
+ ///
+ internal IFluentTextSize HeaderCellTextSize
+ => HeaderTextSize ?? TextSize;
+
///
/// Determines the vertical alignment for the header cell.
///
@@ -495,6 +555,36 @@ internal Background HeaderCellBackground
internal TextAlignment AggregateCellTextAlignment
=> AggregateTextAlignment ?? TextAlignment;
+ ///
+ /// Gets the text transformation for the aggregate cell.
+ ///
+ internal TextTransform AggregateCellTextTransform
+ => AggregateTextTransform ?? TextTransform;
+
+ ///
+ /// Gets the text transformation for the aggregate cell.
+ ///
+ internal TextDecoration AggregateCellTextDecoration
+ => AggregateTextDecoration ?? TextDecoration;
+
+ ///
+ /// Gets the text decoration for the aggregate cell.
+ ///
+ internal TextWeight AggregateCellTextWeight
+ => AggregateTextWeight ?? TextWeight;
+
+ ///
+ /// Determines how the text will behave when it is larger than a parent container for the aggregate cell.
+ ///
+ internal TextOverflow AggregateCellTextOverflow
+ => AggregateTextOverflow ?? TextOverflow;
+
+ ///
+ /// Determines the font size of an element for the aggregate cell.
+ ///
+ internal IFluentTextSize AggregateCellTextSize
+ => AggregateTextSize ?? TextSize;
+
///
/// Determines the vertical alignment for the aggregate cell.
///
@@ -603,10 +693,35 @@ public SortDirection CurrentSortDirection
[Parameter] public DataGridColumnCustomFilter CustomFilter { get; set; }
///
- /// Defines the alignment for column filter cell.
+ /// Defines the alignment for column filter cell. If not set, it will fallback to the TextAlignment.
///
[Parameter] public TextAlignment? FilterTextAlignment { get; set; }
+ ///
+ /// Gets or sets the text transformation for column filter cell. If not set, it will fallback to the TextTransform.
+ ///
+ [Parameter] public TextTransform? FilterTextTransform { get; set; }
+
+ ///
+ /// Gets or sets the text decoration for column filter cell. If not set, it will fallback to the TextDecoration.
+ ///
+ [Parameter] public TextDecoration? FilterTextDecoration { get; set; }
+
+ ///
+ /// Gets or sets the text weight for column filter cell. If not set, it will fallback to the TextWeight.
+ ///
+ [Parameter] public TextWeight? FilterTextWeight { get; set; }
+
+ ///
+ /// Determines how the text will behave when it is larger than a parent container for column filter cell. If not set, it will fallback to the TextOverflow.
+ ///
+ [Parameter] public TextOverflow? FilterTextOverflow { get; set; }
+
+ ///
+ /// Determines the font size of an element for column filter cell. If not set, it will fallback to the TextSize.
+ ///
+ [Parameter] public IFluentTextSize FilterTextSize { get; set; }
+
///
/// Defines the vertical alignment for column filter cell.
///
@@ -643,12 +758,37 @@ public SortDirection CurrentSortDirection
[Parameter] public RenderFragment SortDirectionTemplate { get; set; }
///
- /// Defines the alignment for display cell.
+ /// Defines the alignment for the table cell.
///
[Parameter] public TextAlignment TextAlignment { get; set; }
///
- /// Defines the vertical alignment for display cell.
+ /// Gets or sets the text transformation for the table cell.
+ ///
+ [Parameter] public TextTransform TextTransform { get; set; }
+
+ ///
+ /// Gets or sets the text decoration for the table cell.
+ ///
+ [Parameter] public TextDecoration TextDecoration { get; set; }
+
+ ///
+ /// Gets or sets the text weight for the table cell.
+ ///
+ [Parameter] public TextWeight TextWeight { get; set; }
+
+ ///
+ /// Determines how the text will behave when it is larger than a parent container for the table cell.
+ ///
+ [Parameter] public TextOverflow TextOverflow { get; set; }
+
+ ///
+ /// Determines the font size of an element for the table cell.
+ ///
+ [Parameter] public IFluentTextSize TextSize { get; set; }
+
+ ///
+ /// Defines the vertical alignment for the table cell.
///
[Parameter] public VerticalAlignment VerticalAlignment { get; set; }
@@ -668,10 +808,35 @@ public SortDirection CurrentSortDirection
[Parameter] public IFluentGap Gap { get; set; }
///
- /// Defines the alignment for column header cell.
+ /// Defines the alignment for column header cell. If not set, it will fallback to the TextAlignment.
///
[Parameter] public TextAlignment? HeaderTextAlignment { get; set; }
+ ///
+ /// Gets or sets the text transformation for column header cell. If not set, it will fallback to the TextTransform.
+ ///
+ [Parameter] public TextTransform? HeaderTextTransform { get; set; }
+
+ ///
+ /// Gets or sets the text decoration for column header cell. If not set, it will fallback to the TextDecoration.
+ ///
+ [Parameter] public TextDecoration? HeaderTextDecoration { get; set; }
+
+ ///
+ /// Gets or sets the text weight for column header cell. If not set, it will fallback to the TextWeight.
+ ///
+ [Parameter] public TextWeight? HeaderTextWeight { get; set; }
+
+ ///
+ /// Determines how the text will behave when it is larger than a parent container for column header cell. If not set, it will fallback to the TextOverflow.
+ ///
+ [Parameter] public TextOverflow? HeaderTextOverflow { get; set; }
+
+ ///
+ /// Determines the font size of an element for column header cell. If not set, it will fallback to the TextSize.
+ ///
+ [Parameter] public IFluentTextSize HeaderTextSize { get; set; }
+
///
/// Defines the vertical alignment for column header cell.
///
@@ -815,10 +980,35 @@ public SortDirection CurrentSortDirection
[Parameter] public string AggregateCellStyle { get; set; }
///
- /// Defines the alignment for column the aggregate cell.
+ /// Defines the alignment for column the aggregate cell. If not set, it will fallback to the TextAlignment.
///
[Parameter] public TextAlignment? AggregateTextAlignment { get; set; }
+ ///
+ /// Gets or sets the text transformation for column the aggregate cell. If not set, it will fallback to the TextTransform.
+ ///
+ [Parameter] public TextTransform? AggregateTextTransform { get; set; }
+
+ ///
+ /// Gets or sets the text decoration for column the aggregate cell. If not set, it will fallback to the TextDecoration.
+ ///
+ [Parameter] public TextDecoration? AggregateTextDecoration { get; set; }
+
+ ///
+ /// Gets or sets the text weight for column the aggregate cell. If not set, it will fallback to the TextWeight.
+ ///
+ [Parameter] public TextWeight? AggregateTextWeight { get; set; }
+
+ ///
+ /// Determines how the text will behave when it is larger than a parent container for column the aggregate cell. If not set, it will fallback to the TextOverflow.
+ ///
+ [Parameter] public TextOverflow? AggregateTextOverflow { get; set; }
+
+ ///
+ /// Determines the font size of an element for column the aggregate cell. If not set, it will fallback to the TextSize.
+ ///
+ [Parameter] public IFluentTextSize AggregateTextSize { get; set; }
+
///
/// Defines the vertical alignment for column the aggregate cell.
///
diff --git a/Source/Extensions/Blazorise.DataGrid/_DataGridAggregateRow.razor b/Source/Extensions/Blazorise.DataGrid/_DataGridAggregateRow.razor
index ae2142bcce..d74e99b2ff 100644
--- a/Source/Extensions/Blazorise.DataGrid/_DataGridAggregateRow.razor
+++ b/Source/Extensions/Blazorise.DataGrid/_DataGridAggregateRow.razor
@@ -8,7 +8,7 @@
{
@if ( column.ColumnType == DataGridColumnType.Command )
{
-
+
@if(column.AggregateTemplate is not null )
{
@column.AggregateTemplate( new( column.Field, null ) )
@@ -19,7 +19,7 @@
{
@if ( ParentDataGrid.MultiSelect )
{
-
+
@if ( column.AggregateTemplate is not null )
{
@column.AggregateTemplate( new( column.Field, null ) )
@@ -29,7 +29,7 @@
}
else
{
-
+
@{
var aggregateColumn = Aggregates.FirstOrDefault( x => x.Field == column.Field );
diff --git a/Source/Extensions/Blazorise.DataGrid/_DataGridRow.razor b/Source/Extensions/Blazorise.DataGrid/_DataGridRow.razor
index 5adf4c94db..b619fbc4fc 100644
--- a/Source/Extensions/Blazorise.DataGrid/_DataGridRow.razor
+++ b/Source/Extensions/Blazorise.DataGrid/_DataGridRow.razor
@@ -86,7 +86,8 @@
@onfocus="@(args => ParentDataGrid.IsCellNavigable ? HandleCellFocus(args, column) : default)"
tabindex="@(ParentDataGrid.IsCellNavigable ? 0 : null)"
ClickStopPropagation=@column.PreventRowClick
- TextAlignment="@column.TextAlignment" VerticalAlignment="@column.VerticalAlignment" Display="@column.Display" Flex="@column.Flex" Gap="@column.Gap" FixedPosition="@column.FixedPosition" Width="@column.BuildCellFluentSizing()"
+ TextAlignment="@column.TextAlignment" TextTransform="@column.TextTransform" TextDecoration="@column.TextDecoration" TextWeight="@column.TextWeight" TextOverflow="@column.TextOverflow" TextSize="@column.TextSize"
+ VerticalAlignment="@column.VerticalAlignment" Display="@column.Display" Flex="@column.Flex" Gap="@column.Gap" FixedPosition="@column.FixedPosition" Width="@column.BuildCellFluentSizing()"
Style="@GetCellStyle(column, styling, selectedStyling, cellBatchEditStyling)" Class="@GetCellClass(column, styling, selectedStyling, cellBatchEditStyling)"
Background="@GetCellBackground(styling, selectedStyling, cellBatchEditStyling)" Color="@GetCellColor(styling, selectedStyling, cellBatchEditStyling)" TextColor="@GetCellTextColor(styling, selectedStyling, cellBatchEditStyling)"
MobileModeCaption="@column.Caption">
diff --git a/Source/Extensions/Blazorise.DataGrid/_DataGridRowCommand.razor b/Source/Extensions/Blazorise.DataGrid/_DataGridRowCommand.razor
index 46e1adbd17..4433eee77e 100644
--- a/Source/Extensions/Blazorise.DataGrid/_DataGridRowCommand.razor
+++ b/Source/Extensions/Blazorise.DataGrid/_DataGridRowCommand.razor
@@ -3,7 +3,7 @@
@if ( EditState == DataGridEditState.Edit )
{
-
+