Releases: syncfusion/blazor-toolkit
v1.0.1
Release Notes - v1.0.1
This release delivers new components across the Syncfusion Blazor Toolkit. Version 1.0.1 expands component capabilities with improved performance, accessibility refinements, and new customization options. The 16 production-ready components have been enhanced based on user feedback to provide a more robust and developer-friendly experience.
New Components
Button: Used for triggering actions in web apps. Supports different looks, icons, and toggle states.
- Multiple Visual Styles - Choose from Default, Outline, Flat, or Round buttons with color options like Info, Success, Warning, and Danger.
- Icon Placement - Add icons on the left, right, top, or bottom of button text using the IconCss property.
- Toggle State - Turn buttons into switches that stay on or off until clicked again, great for settings and bookmarks.
- Form Support - Works with Blazor forms for submit and reset actions with built-in validation.
ButtonGroup: Is a container component that groups multiple buttons together with support for single and multiple selection modes.
- Selection Modes - Allows single (radio-like) or multiple (checkbox-like) button selection within the group for toolbars and filter interfaces.
- Vertical Layout - Arranges buttons in a vertical stack when IsVertical is set to true, ideal for sidebars and tool panels.
- Icon Support - Adds icons to buttons using IconCss property with flexible positioning (left, right, top, bottom) around button text.
- Form Integration - Uses Name and Value properties to submit selected button data in forms, making it work seamlessly with Blazor's form validation.
Calendar: Used for displaying and selecting dates with support for multiple views, multi-selection, and international calendar systems.
- Multi-Date Selection - Allows selecting multiple non-consecutive dates at once, ideal for scheduling and event planning.
- Islamic Calendar Support - Switches to Hijri calendar system using CalendarMode property for Arabic and Islamic applications.
- Week Number Display - Shows week numbers alongside dates with configurable first week rule for business reporting needs.
- Date Range Restriction - Limits selectable dates using Min and Max properties, perfect for booking systems and form validation.
DatePicker: Combines a text input with an embedded calendar popup for intuitive date selection.
- Input Mask Support - Guides date entry with a specific format pattern, preventing invalid date inputs and showing placeholders for each segment.
- Multiple Input Formats - Accepts various date format patterns when typing dates manually, with support for culture-specific formats like ISO and Gregorian.
- Date Range Restriction - Limits selectable dates using Min and Max properties, with out-of-range dates disabled in the popup.
- Floating Label - Placeholder text floats above the input when focused or filled, providing a clean interface that saves vertical space.
DateTimePicker: Enables selection of both date and time values in a unified interface with configurable formats and time intervals.
- Time Interval Configuration - Set time intervals (e.g., 15, 30, 60 minutes) to control the granularity of time selection in the dropdown list.
- Time Range Restriction - Separate MinTime and MaxTime properties restrict time selection independent of date constraints, perfect for business hours.
- Date and Time Format - Customize display using standard .NET format patterns like "dd/MM/yyyy hh:mm:ss" with culture-specific support.
- Mask Input Support - Guides datetime entry with a mask pattern based on the Format property, showing placeholders for each segment.
TimePicker: Provides specialized time-only selection with configurable intervals, format options, and validation for precise time entry.
- Flexible Time Intervals - Configure the Step property (e.g., 15, 30, 60 minutes) to control the granularity of time options displayed in the popup list.
- Time Range Restriction - Set Min and Max time values to restrict selectable times within a specific range, with out-of-range times automatically disabled.
- 12/24 Hour Formats - Support for both 12-hour format with AM/PM (h:mm tt) and 24-hour format (HH:mm), plus optional seconds display.
- Mask Input Support - Enable the EnableMask property to guide time entry with format placeholders, preventing invalid input and showing segment indicators.
Chart: Provides feature-rich data visualization with multiple chart types and interactive capabilities.
- New Chart Types - Added support for a wide range of chart types including Area, Bar, Bubble, Column, Line, Scatter, Spline (with Area), Multicolored (Area and Line), Step (Line and Area), and stacking variants with 100% options to support diverse visualization needs.
- Indicators and Trendlines - Supports rendering of technical indicators and trendlines to help identify patterns, trends, and analytical insights directly within the chart.
- Annotations and Data Labels - Enables annotations and data labels to highlight specific data points and provide contextual information for better understanding.
- Zooming and Panning - Allows smooth zooming and panning to explore data efficiently across different ranges and scales.
- Selection and Highlight - Provides interactive selection and highlighting to focus on specific data segments for detailed analysis.
- Crosshair - Displays crosshair lines for precise tracking of values across both axes.
- Tooltip - Shows enhanced tooltips with detailed data information when hovering over chart elements.
- Legend with Toggle Support - Allows users to dynamically show or hide series using interactive legend toggle functionality.
- Gradient Support - Supports gradient fills for series, indicators, and trendlines to improve visual appearance.
- Strip Lines - Highlights specific ranges or threshold areas within the chart using configurable strip lines.
- Markers - Enables customizable markers to emphasize individual data points clearly.
- Multiple Axis - Supports multiple axes to represent different data scales within a single chart.
- Multiple Panes - Allows rendering of multiple panes to organize related datasets into separate sections within the same chart.
CheckBox: Enables users to make binary or tri-state selections with support for labels, custom styling, and form integration.
- Tri-State Mode - Supports checked, unchecked, and indeterminate states via EnableTriState property, ideal for "Select All" scenarios in hierarchical lists.
- Label Positioning - Flexible label placement using LabelPosition property (Before or After), adapting to RTL layouts automatically.
- Theme Colors - Built-in color classes like e-primary, e-success, e-warning, and e-danger for matching application themes.
- Form Validation - Seamless integration with Blazor's EditForm and DataAnnotations for model-based validation scenarios.
NumericTextBox: Provides numeric input with formatting, validation, and spin button controls for precise number entry.
- Currency Formatting - Display values with currency symbols using Format="C2" and culture-specific decimal separators.
- Percentage Display - Format values as percentages using Format="P2" with automatic decimal conversion between display and raw values.
- Custom Format Patterns - Use # and 0 placeholders to create custom display patterns like "###.##" for optional decimals or "000.00" for zero-padded values.
- Strict Mode - Automatically constrains values between Min and Max bounds, correcting out-of-range inputs on blur.
RadioButton: Enables users to select a single option from a group of mutually exclusive choices with label and styling support.
- Label Positioning - Place labels before or after the radio button using LabelPosition property, with automatic RTL layout adaptation.
- Disabled State - Prevent interaction on individual radio buttons using the Disabled property while retaining visual presence.
- Theme Colors - Apply built-in color classes like e-success, e-info, e-warning, and e-danger to match application themes.
- Form Validation - Seamless integration with Blazor's EditForm and DataAnnotations for model binding and validation scenarios.
Switch: Provides a toggle control for boolean state selection with customizable on/off labels and seamless form integration.
- On/Off State Labels - Display text inside the switch for ON and OFF states using OnLabel and OffLabel properties, improving user understanding of current state.
- Disabled State - Prevent user interaction using the Disabled property while maintaining visual presence, ideal for conditional form fields.
- Form Validation - Seamless integration with Blazor's EditForm and DataAnnotations for model-based validation scenarios.
TextArea: Provides multi-line text input with configurable rows, columns, and resize behavior for flexible text entry.
- Resize Mode - Control resize direction using ResizeMode property (None, Horizontal, Vertical, Both) to limit or allow user resizing.
- Row and Column Count - Set visible dimensions using RowCount (lines) and ColumnCount (character width) properties for appropriate input sizing.
- Float Label Types - Support for floating labels using FloatLabelType property (Never, Auto, Always) with placeholder text behavior.
- Maximum Length - Enforce character limits using MaxLength property, preventing input beyond specified limit.
TextBox: Provides comprehensive text input with support for multiple input types, multiline mode, and customizable aut...