@page "/changelog"

<div class="changelog">
<RadzenText Anchor="changelog#v11" TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Components v11 Changelog
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Track and review changes to Radzen Blazor Components v11
</RadzenText>
<RadzenText Anchor="changelog#v11-breaking" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Breaking changes
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> .NET 7 support has been removed. The library now targets .NET 8, .NET 9, and .NET 10.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> The Markdown parser namespace has changed from <code>Radzen.Blazor.Markdown</code> to <code>Radzen.Documents.Markdown</code>. Update <code>using</code> directives accordingly.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Empty <code>CategoryProperty</code> in chart series will no longer fall back to the row index.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> The internal <code>Radzen.Blazor.Rendering.Popup</code> component has been promoted to the public <RadzenLink Text="RadzenPopup" Path="/popup" /> component in the <code>Radzen.Blazor</code> namespace. Replace <code>&lt;Popup&gt;</code> with <code>&lt;RadzenPopup&gt;</code> and remove the <code>@@using Radzen.Blazor.Rendering</code> directive.</li>
</ul>

<RadzenText Anchor="changelog#v11-new-components" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    New Components
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="RadzenSpreadsheet" Path="/spreadsheet" /> - a full-featured spreadsheet component with XLSX import/export, formula engine, formatting, filtering, sorting, conditional formatting, data validation, charts, and more.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="RadzenSignaturePad" Path="/signature-pad" /> - a signature pad component for capturing handwritten signatures.</li>
</ul>

<RadzenText Anchor="changelog#v11-spreadsheet" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    RadzenSpreadsheet
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Formula engine with Excel-compatible functions including math, text, date/time, lookup, statistical, and logical functions.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> XLSX import and export with full round-trip support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Cell formatting: bold, italic, underline, font color, background color, text alignment, vertical alignment, and number formats (including scientific and accounting).</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Format Cells dialog for advanced formatting options.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Filtering and sorting with undo support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Conditional formatting rules.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Frozen panes (rows and columns).</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Cell, row header, and column header context menus.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Undo and redo with keyboard shortcuts.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Insert and delete rows and columns.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Merged cells support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Column and row resizing.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Data validation with input prompts and error alerts.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Floating images with interactive resize via drag handles.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Autofill feature for extending cell values and patterns.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Multiple sheet (worksheet) support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Sheet and workbook protection.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Embedded chart support with chart context menu and Edit Chart dialog.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Custom cell type support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Localization service for all spreadsheet UI strings.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Address-aware copy, cut, and paste operations.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Drag-to-move support for charts and images.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Data binding support.</li>
</ul>

<RadzenText Anchor="changelog#v11-charts" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Charts
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> New chart series types: Candlestick, OHLC, Waterfall, Horizontal Waterfall, Range Column, Range Bar, Range Area, Range Step Area, Box Plot, Bullet, Pyramid, Heatmap, Treemap, Funnel, Radar Column, Step Line, Step Area, Stacked Line, Full Stacked Column, Full Stacked Bar, Full Stacked Area, Full Stacked Line, and High-Low.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="RadzenHeatmapSeries" Path="/heatmap-series-chart" /> - chart series that renders a grid of colour-coded cells on numeric X/Y axes, driven by an intensity property and a <code>SeriesColorRange</code> palette.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="RadzenContourSeries" Path="/contour-chart" /> - chart series that renders a filled iso-band contour plot (e.g. isoilluminance) from a regular grid of scalar samples, with optional iso-lines.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="Range Navigator" Path="/range-navigator" /> component for interactive range selection on chart data.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="Chart Gallery" Path="/chart-gallery" /> page showcasing all available chart types.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Pan and zoom support for interactive data exploration.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> RTL (right-to-left) support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Series and legend hover effects.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Multiple axes support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Logarithmic and indexed axis types.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Axis crossing and inverted axis support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Trendline support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Drill-down support.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Spider chart now supports polar chart configurations.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Pie and Donut series <code>RadiusProperty</code> and <code>ExplodeOffset</code> properties.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Range Navigator compact mode and axis support.</li>
</ul>

<RadzenText Anchor="changelog#v11-localization" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Localization
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Localization unified to resource-based approach across all components.</li>
</ul>

<RadzenText Anchor="changelog#v11-label" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    RadzenLabel
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Added <code>TextStyle</code> property to RadzenLabel.</li>
</ul>

<RadzenText Anchor="changelog#v11-trimming" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Trimming and CSP
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Feature" /> Trimming support added for reduced publish size.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Content Security Policy (CSP) compatibility improvements across components.</li>
</ul>

<RadzenText Anchor="changelog#v10" TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Components v10 Changelog
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Track and review changes to Radzen Blazor Components v10
</RadzenText>
<RadzenText Anchor="changelog#v10-radzentoc" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    RadzenToc
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> RadzenTocItem now renders an <code>&lt;a&gt;</code> element instead of a <code>&lt;button&gt;</code>. Update CSS selectors that target <code>.rz-toc-link</code> as a button.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> The selected TOC item now uses <code>aria-selected</code> instead of <code>aria-current="location"</code>.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Scrolling no longer updates the browser address bar. The URL fragment is set only when the user clicks a TOC link.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Scroll tracking made simpler and more deterministic visible-section selection.</li>
</ul>

<RadzenText Anchor="changelog#v10-scheduler" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    RadzenScheduler
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Month view "more" button moved from an absolute-positioned overlay to the slot header (<code>.rz-slot-title</code>). Update custom CSS that targets the old <code>.rz-event-list-btn</code> positioning.</li>
</ul>

<RadzenText Anchor="changelog#v9" TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Components v9 Changelog
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Track and review changes to Radzen Blazor Components v9
</RadzenText>
<RadzenText Anchor="changelog#v9-rendering" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Rendering and accessibility
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Updated rendering across multiple components to improve WAI-ARIA support and semantic HTML (interactive elements now render as buttons/inputs/nav where appropriate, additional <code>aria-*</code> attributes and localizable labels were added, and the new <code>rz-hidden-accessible</code> helper class is used). Update custom DOM or CSS selectors if they target old tags.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> .NET 6.0 support has been removed.</li>
</ul>

<RadzenText Anchor="changelog#v8" TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Components v8 Changelog
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Track and review changes to Radzen Blazor Components v8
</RadzenText>
<RadzenText Anchor="changelog#v8-new-components" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    New Components
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="Chat" Path="/chat" /> - component for multi-participant conversations with support for distinct user identities.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="FAB" Path="/fab" /> - Floating Action Button helps highlight your app’s most important action.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="FabMenu" Path="/fab-menu" /> - RadzenFabMenu provides quick access to multiple actions.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <RadzenLink Text="PivotDataGird" Path="/pivot-data-grid" /> - create cross-tabulation tables for analyzing large datasets.</li>
</ul>

<RadzenText Anchor="changelog#v8-aichat" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    AIChat
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> RadzenAIChat <code>ChatMessage</code> shared between RadzenChat, RadzenAIChat and AIChatService</li>
</ul>

<RadzenText Anchor="changelog#v8-sidebar" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    SiderBar
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Added two new options:
        <ul>
            <li><code>Position="SidebarPosition.Start"</code> to position the SideBar to Left, Right, Start, End</li>
            <li><code>FullHeight</code> for setting the Sidebar to full height or wrapped between RadzenHeader and RadzenFooter. Default is <code>false</code>.</li>
            <li>Example:
<RadzenText TextStyle="TextStyle.Body1" class="rz-m-0">Old:</RadzenText>
<pre><code>&lt;RadzenLayout Style="grid-template-columns: 1fr auto; grid-template-areas: 'rz-header rz-header' 'rz-body rz-sidebar'"&gt;
    &lt;RadzenSidebar&gt;
    &lt;/RadzenSidebar&gt;
&lt;/RadzenLayout&gt;
</code></pre>
<RadzenText TextStyle="TextStyle.Body1" class="rz-m-0">New:</RadzenText>
<pre><code>&lt;RadzenLayout&gt;
    &lt;RadzenSidebar Position="SidebarPosition.End" &gt;
    &lt;/RadzenSidebar&gt;
&lt;/RadzenLayout&gt;
</code></pre>  
            </li>
        </ul>
    </li>
</ul>


<RadzenText Anchor="changelog#v7" TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Components v7 Changelog
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Track and review changes to Radzen Blazor Components v7
</RadzenText>
<RadzenText Anchor="changelog#v7-dependencies" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Dependencies
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1">
    <RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" />
    Starting from Radzen Blazor v7.0.0 we have dropped the dependency on Roslyn (Microsoft.CodeAnalysis.*) packages. 
    Expression parsing now relies on a home-grown implementation. Some expressions may no longer work.
</RadzenText>
<RadzenText Anchor="changelog#v7-animations" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Animations
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1">
    <RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" />
    Added animations to Popup, Dialog, SideDialog, DropDown, DropDownDataGrid, Notification, Tooltip, Tree, Panel, Fieldest, PanelMenu, Menu, ContextMenu, SplitButton and Accordion.

    Some of the components used inline style to hide certain content which makes it impossible to animate. 
    We have updated those components to use CSS class based hiding. As a result theme CSS files need to be updated. 
    The free themes should work out of the box as long as they are not cached by the browser (RadzenTheme takes care of cache busting). 
    Premium themes should be updated from Radzen Blazor Studio and Radzen Blazor for Visual Studio.
    The latest versions of both products would display a warning that the premium theme is outdated and update it automatically without losing any customizations.
</RadzenText>
<RadzenText Anchor="changelog#v7-accordion" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Accordion changes
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1">
    <RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" />
    RadzenAccordion now hides its child content using CSS class in order to support animations. The older behavior was to remove the child content entirely.
</RadzenText>
<RadzenText Anchor="changelog#v7-scheduler" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    RadzenScheduler month view
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1">
    <RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" />
    We have redone rendering implementation of the month view in RadzenScheduler. The old implementation didn't handle some cases and relied on odd sorting rules.
    The new implementation is much more robust and should handle a lot more scenarios. The Breaking change is that appointments may not appear in the same
    order as before.
</RadzenText>
<RadzenText Anchor="changelog#v6" TextStyle="TextStyle.H2" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Components v6 Changelog
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Track and review changes to Radzen Blazor Components v6
</RadzenText>
<RadzenText Anchor="changelog#v6-dependencies" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Dependencies
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1">
    <RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" />
    Starting from Radzen Blazor v6.0.0 we have dropped the dependency on the System.Linq.Dynamic.Core NuGet package.
    We are now using a home-grown solution based on Roslyn (the C# compiler API).
    More information can be found in the <RadzenLink Text="forum" Path="https://forum.radzen.com/t/just-released-our-new-major-version-of-radzen-blazor-6-0-0-without-reference-to-system-linq-dynamic-core-nuget-package/19748" />.
</RadzenText>
<RadzenText Anchor="changelog#v6-markupstring" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    <code>MarkupString</code> support
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1">
    <RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" />
    Starting from v6.4.0 Radzen.Blazor <RadzenLink Path="https://github.com/radzenhq/radzen-blazor/pull/2066">no longer accepts HTML content</RadzenLink> in certain string properties - like <code>Text</code>, <code>Icon</code>, <code>PagingSummaryFormat</code>, etc.
    We have introduced <code>RenderFragment</code> based properties where needed.
    This change is made to improve the security of our components and to prevent certain XSS attacks.
</RadzenText>
<RadzenText TextStyle="TextStyle.Body1">Old:</RadzenText>
<pre><code>PagingSummaryFormat="Displaying page {0} of {1} &lt;b&gt;(total {2} records)&lt;/b&gt;</code></pre>
<RadzenText TextStyle="TextStyle.Body1">New:</RadzenText>
<pre><code>&lt;PagingSummaryTemplate&gt;
    Displaying page @@context.CurrentPage of @@context.NumberOfPages &lt;b&gt;(total @@context.TotalCount records)&lt;/b&gt;
&lt;/PagingSummaryTemplate&gt;
</code></pre>

<RadzenText TextStyle="TextStyle.H2" Anchor="changelog#v5" TagName="TagName.H1" class="rz-pt-8">
    Radzen Blazor Components v5 Changelog
</RadzenText>
<RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-pb-4">
    Track and review changes to Radzen Blazor Components v5.
</RadzenText>

<RadzenText Anchor="changelog#v5-dependencies" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-8">
    Dependencies
</RadzenText>
<ul>
    <li>Dropped Bootstrap - including the Bootstrap CSS is not mandatory any more.</li>
    <li>Dropped the obsolete RadzenGrid component.</li>
    <li>Dropped support for .NET Core 3.x and .NET 5.</li>
</ul>

<RadzenText Anchor="changelog#v5-common" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Common
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> RTL Support - All components now support right to left direction for languages that are written from the right to the left (like Arabic).</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> All components now render with <code>box-sizing: border-box;</code>.</li>
</ul>

<RadzenText Anchor="changelog#v5-new-components" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    New Components
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <code><RadzenLink Text="RadzenAppearanceToggle" Path="/appearance-toggle" /></code> - A toggle button to quickly switch between light and dark themes.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <code>RadzenTheme</code>  - Use it to load themes to your app.</li>
</ul>

<RadzenText Anchor="changelog#v5-themes" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Themes
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> Open sourced Material Dark theme - you can now use Material Dark theme for free!</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> Added Standard Dark free theme.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> Added Humanistic Dark free theme.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> Added Software Dark free theme.</li>
</ul>

<RadzenText Anchor="changelog#v5-colors" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Colors
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> Added <strong>--rz-base</strong> color variable and shades.</li>
</ul>

<RadzenText Anchor="changelog#v5-typography" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Typography
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Replaced all <b>Source Sans Pro</b> fonts with <b>Source Sans 3</b> variable fonts.
        <ul>
        <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> SourceSans3VF-Italic.ttf.woff2</li>
        <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> SourceSans3VF-Upright.ttf.woff2</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-Black.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-BlackIt.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-Black.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-BlackIt.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-Bold.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-BoldIt.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-ExtraLight.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-ExtraLightIt.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-It.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-Light.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-LightIt.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-Regular.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-Semibold.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> SourceSansPro-SemiboldIt.woff</li>
        </ul>
    </li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Replaced all <b>Roboto</b> fonts with <b>Roboto Flex</b> variable font.
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> RobotoFlex.woff2</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> roboto-v15-latin-300.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> roboto-v15-latin-700.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> roboto-v15-latin-regular.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> roboto-v30-latin-300.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> roboto-v30-latin-500.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> roboto-v30-latin-700.woff</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> roboto-v30-latin-regular.woff</li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#v5-icons" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Icons
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Replaced <b>Material Icons</b> font with <b>Material Symbols</b> variable font.
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> MaterialSymbolsOutlined.woff2</li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> MaterialIcons-Regular.woff</li>
        </ul>
    </li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Removed <code>direction: ltr;</code> rule from <code>.rzi</code> CSS class.</li>
</ul>

<RadzenText Anchor="changelog#v5-datagrid" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    DataGrid
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Updated and unified Clear and Apply button appearance in filtering popups</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-grid-header-filter-icon-margin</code> is now <code>--rz-grid-header-filter-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-grid-header-title-padding</code> is now <code>--rz-grid-header-title-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-column-drag-handle-margin</code> is now <code>--rz-column-drag-handle-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-grid-filter-icon-margin</code> is now <code>--rz-grid-filter-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-grid-group-header-item-padding</code> is now <code>--rz-grid-group-header-item-padding-block</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-grid-group-header-item-title-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-grid-group-header-item-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-grid-group-header-gap</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-grid-group-header-item-color</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-grid-group-header-item-margin</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-grid-group-header-items-margin</code></li>

        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#datalist" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    DataList
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-datalist-item-vertical-margin</code> is now <code>--rz-datalist-item-margin-block</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-datalist-item-horizontal-margin</code> is now <code>--rz-datalist-item-margin-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#datafilter" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    DataFilter
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-datafilter-item-padding-y</code> is now <code>--rz-datafilter-item-padding-block</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-datafilter-item-padding-left</code> is now <code>--rz-datafilter-item-padding-inline-start</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#pager" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Pager
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> All CSS classes starting with <code>.rz-paginator-*</code> are renamed to <code>.rz-pager-*</code></li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> All CSS variables starting with <code>--rz-paginator-*</code> are renamed to <code>--rz-pager-*</code></li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Replaced spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-pager-gap</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-first-button-margin</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-last-button-margin</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-dropdown-margin</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-numeric-button-margin</code></li>
        </ul>
    </li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-back-button-hover-color</code></li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-back-button-hover-background-color</code></li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-next-button-hover-color</code></li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-paginator-next-button-hover-background-color</code></li>
</ul>

<RadzenText Anchor="changelog#v5-scheduler" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Scheduler
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-scheduler-prev-next-button-padding</code> is now <code>--rz-scheduler-prev-next-button-padding-block</code> and <code>--rz-scheduler-prev-next-button-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-scheduler-today-button-margin-left</code> is now <code>--rz-scheduler-today-button-margin-inline-start</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-scheduler-event-padding</code> is now <code>--rz-scheduler-event-padding-block</code> and <code>--rz-scheduler-event-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-scheduler-prev-button-border-radius</code> is now split into:
                <ul>
                    <li><code>--rz-scheduler-prev-button-border-start-start-radius</code></li>
                    <li><code>--rz-scheduler-prev-button-border-start-end-radius</code></li>
                    <li><code>--rz-scheduler-prev-button-border-end-start-radius</code></li>
                    <li><code>--rz-scheduler-prev-button-border-end-end-radius</code></li>
                </ul>
            </li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-scheduler-next-button-border-radius</code> is now split into:
                <ul>
                    <li><code>--rz-scheduler-next-button-border-start-start-radius</code></li>
                    <li><code>--rz-scheduler-next-button-border-start-end-radius</code></li>
                    <li><code>--rz-scheduler-next-button-border-end-start-radius</code></li>
                    <li><code>--rz-scheduler-next-button-border-end-end-radius</code></li>
                </ul>
            </li>
        </ul>
    </li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> <code>--rz-scheduler-highlight-background-color</code> - Use it to highlight working hours in day view, or today in calendar view.</li>
</ul>

<RadzenText Anchor="changelog#tree" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Tree
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-tree-node-padding</code> is now <code>--rz-tree-node-padding-block</code> and <code>--rz-tree-node-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-tree-node-margin</code> is now <code>--rz-tree-node-margin-block</code> and <code>--rz-tree-node-margin-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#image" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Image
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> Added <code>vertical-align: middle;</code> to all images and SVGs inside a Radzen Blazor Component</li>
</ul>

<RadzenText Anchor="changelog#layout" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Layout
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="New" /> CSS reset styles to <code>&lt;body&gt;</code> are applied only when <code>&lt;RadzenLayout&gt;</code> is used.</li>
</ul>

<RadzenText Anchor="changelog#dialog" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Dialog
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Dialog's title bar now uses flex model for its layout.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-dialog-title-padding</code> is now <code>--rz-dialog-title-padding-block</code> and <code>--rz-dialog-title-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#sidebar" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Sidebar
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed direction related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-sidebar-border-right</code> is now <code>--rz-sidebar-border-inline-end</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#splitter" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Splitter
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Splitter icons now use <code>font-family: var(--rz-icon-font-family)</code> instead of hardcoded icon font.</li>
</ul>

<RadzenText Anchor="changelog#accordion" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Accordion
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-accordion-item-padding</code> is now <code>--rz-accordion-item-padding-block</code> and <code>--rz-accordion-item-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-accordion-icon-margin</code> is now <code>--rz-accordion-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-accordion-toggle-icon-margin</code> is now <code>--rz-accordion-toggle-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-accordion-content-padding</code> is now <code>--rz-accordion-content-padding-block</code> and <code>--rz-accordion-content-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-accordion-toggle-icon-collapsed-rtl</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-accordion-toggle-icon-expanded-rtl</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#contextmenu" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    ContextMenu
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-context-menu-padding</code> is now <code>--rz-context-menu-padding-block</code> and <code>--rz-context-menu-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#login" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Login
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-login-register-padding</code> is now <code>--rz-login-register-padding-block</code> and <code>--rz-login-register-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-login-register-margin</code> is now <code>--rz-login-register-margin-block</code> and <code>--rz-login-register-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-login-register-button-margin</code> is now <code>--rz-login-register-button-margin-block</code> and <code>--rz-login-register-button-margin-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#menu" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Menu
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-menu-item-icon-margin</code> is now <code>--rz-menu-item-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-menu-item-padding</code> is now <code>--rz-menu-item-padding-block</code> and <code>--rz-menu-item-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-menu-top-item-padding</code> is now <code>--rz-menu-top-item-padding-block</code> and <code>--rz-menu-top-item-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#panelmenu" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    PanelMenu
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Remapped CSS variables for margin, padding, color and background color to match the respective PanelMenu item level.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed some of the above mentioned CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-color</code> is now <code>--rz-panel-menu-item-color</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-background-color</code> is now <code>--rz-panel-menu-item-background-color</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-hover-color</code> is now <code>--rz-panel-menu-item-hover-color</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-hover-background-color</code> is now <code>--rz-panel-menu-item-hover-background-color</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-padding</code> is now <code>--rz-panel-menu-padding-block</code> and <code>--rz-panel-menu-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-item-padding</code> is now <code>--rz-panel-menu-item-padding-block</code> and <code>--rz-panel-menu-item-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-item-2nd-level-padding</code> is now <code>--rz-panel-menu-item-2nd-level-padding-block</code> and <code>--rz-panel-menu-item-2nd-level-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-item-margin</code> is now <code>--rz-panel-menu-item-margin-block</code> and <code>--rz-panel-menu-item-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-item-2nd-level-margin</code> is now <code>--rz-panel-menu-item-2nd-level-margin-block</code> and <code>--rz-panel-menu-item-2nd-level-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-icon-margin</code> is now <code>--rz-panel-menu-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-panel-menu-icon-2nd-level-margin</code> is now <code>--rz-panel-menu-icon-2nd-level-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-panel-menu-item-3rd-level-color</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-panel-menu-item-3rd-level-background-color</code></li>

        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#profilemenu" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    ProfileMenu
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-profile-menu-item-icon-margin</code> is now <code>--rz-profile-menu-item-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-profile-menu-padding</code> is now <code>--rz-profile-menu-padding-block</code> and <code>--rz-profile-menu-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#steps" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Steps
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-steps-number-padding</code> is now <code>--rz-steps-number-padding-block</code> and <code>--rz-steps-number-padding-inline</code></li>
        </ul>
    </li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Prev and Next icon is now rendered via CSS. Instead of <code>&lt;i class="rzi"&gt;navigate_next&lt;/i&gt;</code> and <code>&lt;i class="rzi"&gt;navigate_before&lt;/i&gt;</code> the component now renders <code>&lt;span class="rzi"&gt;&lt;/span&gt;</code></li>
</ul>

<RadzenText Anchor="changelog#tabs" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Tabs
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-tabs-icon-margin</code> is now <code>--rz-tabs-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-tabs-tab-padding</code> is now <code>--rz-tabs-tab-padding-block</code> and <code>--rz-tabs-tab-padding-inline</code></li>
        </ul>
    </li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Updated Tab icon CSS classes <code>&lt;span class="rz-tabview-left-icon rzi" ...</code> to <code>&lt;span class="rzi rz-tabview-icon" ...</code>.</li>
</ul>

<RadzenText Anchor="changelog#button" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Button
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Removed <code>$button-styles</code> SCSS map and use <code>$severity-styles-map</code> and <code>$base-styles-map</code> to generate CSS for Button styles.</li>
</ul>

<RadzenText Anchor="changelog#checkbox" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    CheckBox
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-checkbox-margin</code> is now <code>--rz-checkbox-margin-block</code> and <code>--rz-checkbox-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-checkbox-label-margin</code> is now <code>--rz-checkbox-label-margin-block</code> and <code>--rz-checkbox-label-margin-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#colorpicker" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    ColorPicker
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-colorpicker-item-margin</code> is now <code>--rz-colorpicker-items-gap</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#datepicker" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    DatePicker
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> New DatePicker markup. Revised HTML elements and CSS classes to better describe DatePicker's contents.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-datepicker-header-padding</code> is now <code>--rz-datepicker-header-padding-block</code> and <code>--rz-datepicker-header-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-datepicker-calendar-padding</code> is now <code>--rz-datepicker-calendar-item-padding</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-timepicker-padding</code> is now <code>--rz-timepicker-padding-block</code> and <code>--rz-timepicker-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-datepicker-calendar-padding-block</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-datepicker-calendar-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-datepicker-popup-width</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-datepicker-month-dropdown-width</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-datepicker-year-dropdown-width</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-datepicker-prev-next-icon-size</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-datepicker-prev-next-button-border-radius</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-datepicker-header-line-height</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#dropdown" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    DropDown
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> New DatePicker markup. Revised HTML elements and CSS classes to better describe DatePicker's contents.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-dropdown-trigger-icon-margin</code> is now <code>--rz-dropdown-trigger-icon-margin-block</code> and <code>--rz-dropdown-trigger-icon-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-dropdown-label-padding</code> is now <code>--rz-dropdown-label-padding-block</code> and <code>--rz-dropdown-label-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-multiselect-checkbox-margin</code> is now <code>--rz-multiselect-checkbox-margin-block</code> and <code>--rz-multiselect-checkbox-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-dropdown-chips-padding</code> is now <code>--rz-dropdown-chips-padding-block</code> and <code>--rz-dropdown-chips-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#dropdowndatagrid" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    DropDownDataGrid
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Improved lookup styles:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-lookup-search-margin-bottom</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> <code>--rz-lookup-search-gap</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#fieldset" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Fieldset
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-fieldset-legend-margin</code> is now <code>--rz-fieldset-legend-margin-block</code> and <code>--rz-fieldset-legend-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-fieldset-legend-padding</code> is now <code>--rz-fieldset-legend-padding-block</code> and <code>--rz-fieldset-legend-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-fieldset-toggle-margin</code> is now <code>--rz-fieldset-toggle-margin-block</code> and <code>--rz-fieldset-toggle-margin-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#formfield" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    FormField
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-form-field-filled-padding</code> is now <code>--rz-form-field-filled-padding-block</code> and <code>--rz-form-field-filled-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-form-field-start-end-padding</code> is now <code>--rz-form-field-start-end-padding-block</code> and <code>--rz-form-field-start-end-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-form-field-margin</code> is now <code>--rz-form-field-margin-block</code> and <code>--rz-form-field-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-form-field-filled-numeric-padding</code> is now <code>--rz-form-field-filled-numeric-padding-block</code> and <code>--rz-form-field-filled-numeric-padding-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-form-field-label-left</code> is now <code>--rz-form-field-label-inset-inline-start</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#htmleditor" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    HtmlEditor
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Changed Underline icon from <code>format_underline</code> to <code>format_underlined</code></li>
</ul>

<RadzenText Anchor="changelog#listbox" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    ListBox
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-listbox-checkbox-margin</code> is now <code>--rz-listbox-checkbox-margin-block</code> and <code>--rz-listbox-checkbox-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-listbox-header-padding</code> is now <code>--rz-listbox-header-padding-block</code> and <code>--rz-listbox-header-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#numeric" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Numeric
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> All CSS classes starting with <code>.rz-spinner-*</code> are renamed to <code>.rz-numeric-*</code></li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-numeric-input-padding</code> is now <code>--rz-numeric-input-padding-block</code> and <code>--rz-numeric-input-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#radiobuttonlist" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    RadioButtonList
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-radio-label-margin</code> is now <code>--rz-radio-label-margin-block</code> and <code>--rz-radio-label-margin-inline</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-radio-margin</code> is now <code>--rz-radio-margin-block</code> and <code>--rz-radio-margin-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#speechtotextbutton" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    SpeechToTextButton
</RadzenText>
<ul>
    <li>---</li>
</ul>

<RadzenText Anchor="changelog#splitbutton" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    SplitButton
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Remove redundant CSS variables:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-splitbutton-menu-button-width</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-splitbutton-menu-button-padding</code></li>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Deleted" /> <code>--rz-splitbutton-menu-button-font-size</code></li>
        </ul>
    </li>
</ul>


<RadzenText Anchor="changelog#switch" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Switch
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-switch-circle-margin</code> is now <code>--rz-switch-circle-offset</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#textarea" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    TextArea
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-text-area-padding</code> is now <code>--rz-text-area-padding-block</code> and <code>--rz-text-area-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#textbox" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    TextBox
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-input-padding</code> is now <code>--rz-input-padding-block</code> and <code>--rz-input-padding-inline</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#badge" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Badge
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Removed <code>$badge-styles</code> SCSS map and use <code>$severity-styles-map</code> and <code>$base-styles-map</code> to generate CSS for Badge styles.</li>
</ul>

<RadzenText Anchor="changelog#chip" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Chip
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> Renamed spacing related CSS variables and updated values respectively:
        <ul>
            <li><RadzenBadge BadgeStyle="BadgeStyle.Base" Text="Updated" /> <code>--rz-chip-padding</code> is now <code>--rz-chip-padding-block</code> and <code>--rz-chip-padding-inline</code></li>
        </ul>
    </li>
</ul>


<RadzenText Anchor="changelog#notification" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Notification
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> New Notification markup. The component now uses flex model for its layout.</li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Danger" Shade="Shade.Lighter" Text="Breaking" /> All CSS classes starting with <code>.rz-growl-*</code> are renamed to <code>.rz-notification-*</code></li>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Success" Shade="Shade.Lighter" Text="Added" /> New <code>--rz-notification-gap</code> CSS variable.</li>
</ul>

<RadzenText Anchor="changelog#alert" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    Alert
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Changed Alert icons:
        <ul>
            <li><code>check_circle_outline</code> is now <code>check_circle</code></li>
            <li><code>error_outline</code> is now <code>error</code></li>
            <li><code>info_outline</code> is now <code>info</code></li>
            <li><code>lightbulb_outline</code> is now <code>lightbulb</code></li>
        </ul>
    </li>
</ul>

<RadzenText Anchor="changelog#progressbar" TextStyle="TextStyle.H5" TagName="TagName.H2" class="rz-pt-4">
    ProgressBar
</RadzenText>
<ul>
    <li><RadzenBadge BadgeStyle="BadgeStyle.Info" Shade="Shade.Lighter" Text="Update" /> Removed <code>$progressbar-styles</code> SCSS map and use <code>$severity-styles-map</code> and <code>$progressbar-base-styles</code> to generate CSS for ProgressBar styles.</li>
</ul>
</div>

<style>
    .changelog li {
        margin-block: 0.25rem;
    }
</style>