merge master into dev

_pdf.yml

@@ -5,73 +5,96 @@ intro_columns:
 -
   categories:
   -
-    title: "Data Controls"  
+    title: "Data Controls"
     items:
+      "CollectionView": "collectionview-overview"
+      "DataForm": "dataform-overview"
       "DataGrid": "datagrid-overview"
-      "ListView": "listview-overview"
-      "DataForm": "dataform-overview"   
+      "DataPager": "datapager-overview"
+      "ItemsControl": "itemscontrol-overview"
   -
-    title: "Pdf Viewer"
+    title: "Data Visualization"
     items:
-      "PdfViewer": "pdfviewer-overview"
+        "Barcodes": "barcode-overview"
+        "Charts": "chart-overview"
+        "Gauges": "gauge-overview"
+        "Map": "map-overview"
+        "ProgressBar": "progressbar-overview"       
+        "Ratings": "rating-overview"
   -
-    title: "Calendar & Scheduling"
+    title: "Chatbots"
     items:
-        "Calendar": "calendar-overview"
+        "Conversation UI (Chat)": "chat-overview"
+-
+  categories:
   -
-    title: "Navigation & Layout"
+    title: "Editors"
+    items:
+        "AutoComplete": "autocomplete-overview"
+        "ComboBox": "combobox-overview"
+        "DatePicker": "datepicker-overview"
+        "DateTimePicker": "datetimepicker-overview"
+        "Entry": "entry-overview"
+        "ImageEditor": "imageeditor-overview"
+        "ListPicker": "listpicker-overview"
+        "MaskedEntries": "maskedentry-overview"
+        "NumericInput": "numericinput-overview"
+        "RangeSlider": "rangeslider-overview"
+        "RichTextEditor": "richtexteditor-overview"
+        "TemplatedPicker": "templatedpicker-overview"
+        "TimePicker": "timepicker-overview"
+        "TimeSpanPicker": "timespanpicker-overview"
+        "SignaturePad": "signaturepad-overview"
+        "Slider": "slider-overview"
+-
+  categories:
+  -
+    title: "Navigation & Layouts"
     items:
-        "TreeView": "treeview-overview"
-        "SideDrawer": "sidedrawer-overview"
-        "TabView": "tabview-overview"
         "Accordion": "accordion-overview"
-        "Expander": "expander-overview"
         "DockLayout": "docklayout-overview"
+        "Expander": "expander-overview"
+        "NavigationView": "navigationview-overview"
+        "SideDrawer": "sidedrawer-overview"
+        "SlideView": "slideview-overview"
+        "TabView": "tabview-overview"
+        "TreeView": "treeview-overview"
+        "WrapLayout": "wraplayout-overview"
+  -
+    title: "Calendar & Scheduling"
+    items:
+        "Calendar": "calendar-overview"
+        "Scheduler": "scheduler-overview"
   -
     title: "Buttons"
     items:
         "Segmented Control": "segmentedcontrol-overview"
         "Button": "button-overview"
         "CheckBox": "checkbox-overview"
-  -   
-    title: "Editors"
-    items: 
-        "Entry": "entry-overview"
-        "AutoCompleteView": "autocompleteview-overview"
-        "NumericInput": "numericinput-overview"
-        "MaskedInput": "maskedinput-overview"
-        "Image Editor": "imageeditor-overview"
-        "DateTime Picker": "datetime-picker-overview"
-        "List Picker": "list-picker-overview"
-        "Templated Picker": "templated-picker-overview"
+        "TemplatedButton": "templatedbutton-overview"
+        "ToggleButton": "togglebutton-overview"
 -
   categories:
   -
-    title: "Data Visualization"
-    items:
-        "Charts": "chart-overview"
-        "Map": "map-overview"
-        "Gauge": "gauge-overview"
-        "Rating": "rating-overview"
-        "Barcode": "barcode-overview"    
-  - 
     title: "Interactivity & UX"
     items:
-        "BusyIndicator": "busyindicator-overview"
-        "Popup": "popup-overview"
-        "SlideView": "slideview-overview"
+        "AIPrompt": "aiprompt-overview"
+        "BadgeView": "badgeview-overview"
         "Border": "border-overview"
+        "BusyIndicator": "busyindicator-overview"
+        "GridSplitter": "gridsplitter-overview"
         "Path": "path-overview"
+        "Popup": "popup-overview"
+        "Toolbar": "toolbar-overview"
   -
-    title: "Document Processing Libraries"
+    title: "PDF Viewer"
     items:
-        "PdfProcessing": "radpdfprocessing-overview"
-        "WordsProcessing": "radwordsprocessing-overview"
-        "SpreadProcessing": "radspreadprocessing-overview"
-        "SpreadStreamProcessing": "radspreadstreamprocessing-overview"
-        "ZipLibrary": "radziplibrary-overview"
+        "PDF Viewer": "pdfviewer-overview"
   -
-    title: "Chatbots"
+    title: "Document Processing Libraries"
     items:
-        "Conversational UI": "chat-overview"
-
+        "PdfProcessing": "document-processing-libraries-overview"
+        "WordsProcessing": "document-processing-libraries-overview"
+        "SpreadProcessing": "document-processing-libraries-overview"
+        "SpreadStreamProcessing": "document-processing-libraries-overview"
+        "ZipLibrary": "document-processing-libraries-overview"

controls/accordion/overview.md

@@ -12,7 +12,7 @@ The Telerik UI for .NET MAUI Accordion is a vertically collapsible content panel
 
 ![.NET MAUI Accordion Overview](images/accordion-overview.png)
 
-## Key features
+## Key Features of the .NET MAUI Accordion
 
 * [Collapsed/expanded states]({%slug accordion-expand-collapse-states%})—Accordion consists of AccordionItems that can present any content. The end users can show or hide this content by interacting with the headers of the control.
 * [Collapse All Items]({% slug accordion-expand-collapse-states%}#collapse-all-items)—You can allow the app users to collapse the Accordion through the `CanCollapseAllItems` Boolean property.

controls/aiprompt/overview.md

@@ -14,7 +14,7 @@ The component allows you to interact with the output from the AI and execute a s
 
 ![.NET MAUI AIPrompt Overview](images/aiprompt-overview.png)
 
-## Key Features
+## Key Features of the .NET MAUI AIPrompt
 
 * [Views]({%slug aiprompt-views-overview %})—The AIPrompt provides different views that you can include in it - Input, Output and Commands view. Through interaction with the component, the user can change the currently active view.
 * [Suggestions]({%slug aiprompt-suggestions%})—This collection will allow you to populate the AIPrompt component with suggestions that will be displayed to the user prior to sending the request.

controls/autocomplete/overview.md

@@ -12,7 +12,7 @@ The Telerik UI for .NET MAUI AutoComplete can automatically complete user input
 
 ![.NET MAUI AutoComplete Overview](images/autocomplete-getting-started.png "AutoComplete Overview")
 
-## Key features
+## Key Features of the .NET MAUI AutoComplete
 
 * [Tokens Support]({%slug autocomplete-tokens-support%})—With AutoComplete you can enable users to search for and pick items in one control.
 * [Filtering Options]({%slug autocomplete-filtering%})—You can define the filtering behavior to display all the matches that either `StartsWith` or `Contains` the typed symbols.

controls/autocomplete/styling.md

@@ -16,14 +16,10 @@ The Telerik UI for .NET MAUI AutoComplete control provides the following Style p
 * `BorderBrush`(`Brush`)—Defines the brush of the border around the control.
 * `BorderThickness`(`Thickness`)—Defines the thickness of the border around the control.
 * `ClearButtonStyle` (of type `Style` with target type `Telerik.Maui.Controls.RadTemplatedButton`)—Defines the style for the clear button.
-* `TextInputStyle`(of type `Style` with target type `Telerik.Maui.Controls.RadTextInput`)—Defines the style of the inner `RadTextInput` control.
 
-In addition, you can change the visual appearance of the AutoComplete by defining the following visual states through the .NET MAUI Visual State Manager:
+The AutoComplete control uses the [`RadTextInput`]({%slug entry-textinput%}) control internally. To style the input control (`RadTextInput`), use the `TextInputStyle` (of type `Style` with target type `Telerik.Maui.Controls.RadTextInput`).
 
-* `Normal`—Applied when the AutoComplete is in its normal state.
-* `Focused`—Applied when the AutoComplete receives focus.
-* (Windows Only)`MouseOver`—Applied when the mouse cursor is hovering over the AutoComplete.
-* `Disabled`—Applied when the AutoComplete's `IsEnabled` is `False`.
+In addition to the available styling properties, you can apply specific [Visual States]({%slug autocomplete-visual-states%}) to the AutoComplete control.
 
 ## Suggestion View Styling 
 
@@ -63,6 +59,8 @@ And when an item is selected:
 
 ![.NET MAUI AutoComplete Styling Selected Item](images/autocomplete-selected-styling.png)
 
+>tip For a runnable example demonstrating the AutoComplete's Styling options, see the [SDKBrowser Demo Application]({%slug sdkbrowser-app%}) and go to the **AutoComplete > Styling** category.
+
 ## Highlight Customization
 
 In case a custom template is used, the user can achieve text highlighting inside the `RadAutoComplete.SuggestionItemTemplate` using `RadHighlightLabel`.
@@ -91,10 +89,12 @@ Here is the result:
 
 ![AutoComplete Highlight Customization](images/autocomplete-highlight.png "AutoComplete Highlight Customization")
 
->important For AutoComplete HighlightText example refer to the [SDKBrowser Demo application]({%slug sdkbrowser-app%}).
+>important For AutoComplete HighlightText example, refer to the [SDKBrowser Demo application]({%slug sdkbrowser-app%}) and go to the **AutoComplete > Featrues** category.
 
 ## See Also
 
+- [Apply Implicit Style]({%slug style-combobox-autocomplete-entry-implicit-explicit%})
+- [Styling the AutoComplete Using Visual States]({%slug style-autocomplete-visual-state-border-telerik-maui%})
 - [Data Binding]({%slug autocomplete-data-binding%})
 - [Configuration]({%slug autocomplete-configuration%})
 - [Suggest Mode]({%slug autocomplete-suggest-mode%})

controls/autocomplete/visual-states.md

@@ -0,0 +1,54 @@
+---
+title: Visual States
+page_title: .NET MAUI AutoComplete Documentation - Visual States
+description: Learn how to set the border color, background color, and other visual states for the Telerik UI for .NET MAUI AutoComplete control.
+position: 15
+tags: .net maui, telerik .net maui, ui for .net maui, autocomplete, states, microsoft .net maui
+slug: autocomplete-visual-states
+---
+
+# .NET MAUI AutoComplete Visual States
+
+This article describes the visual states provided by the AutoComplete control. You can use these visual states to change the appearance of the control based on its state—such as when it’s disabled, focused, hovered, and more.
+
+The AutoComplete provides the following `CommonStates` visual states:
+
+| Visual State | Description |
+| ------------- | --------------- |
+| `Normal` | Applies when the AutoComplete is in its normal state. |
+| `Focused` | Applied when the AutoComplete receives focus. |
+| `MouseOver` | (Windows-only) Applied when the mouse cursor is hovering over the AutoComplete. |
+| `PointerOver` | (MacCatalyst-only) Applied when the mouse cursor is hovering over the AutoComplete. |
+| `Disabled` | Applied when the AutoComplete's `IsEnabled` is `False`. |
+
+## Using the Visual States
+
+The example below demonstrates some of the styling capabilities of the AutoComplete, such as custom `ClearButtonStyle`, `TextInputStyle`, `TextColor`, `PlaceholderColor`, and others. It also shows how to switch its appearance through the .NET MAUI Visual State Manager.
+
+**1.** Add a Style that targets the `RadAutoComplete` to your page's resources and apply all the needed styling properties and the visual states:
+
+<snippet id='autocomplete-custom-styles' />
+
+**2.** Define the AutoComplete in XAML:
+
+<snippet id='autocomplete-styling-xaml'/>
+
+**3.** Create the needed business objects, for example type `Client` with the following properties:
+
+<snippet id='autocomplete-client-businessobject'/>
+
+**4.** Create a `ViewModel` with a collection of `Client` objects:
+
+<snippet id='autocomplete-extended-clients-viewmodel'/>
+
+Here is how the AutoComplete looks when styling is applied:
+
+![.NET MAUI AutoComplete Styling](images/autocomplete-styling.png)
+
+>tip For a runnable example demonstrating the AutoComplete's Visual States, see the [SDKBrowser Demo Application]({%slug sdkbrowser-app%}) and go to the **AutoComplete > Styling** category.
+
+## See Also
+
+- [AutoComplete Styling]({%slug autocomplete-styling%})
+- [Apply Implicit Style]({%slug style-combobox-autocomplete-entry-implicit-explicit%})
+- [Styling AutoComplete Using Visual States]({%slug style-autocomplete-visual-state-border-telerik-maui%})

controls/autocomplete/visual-structure.md

@@ -0,0 +1,33 @@
+---
+title: Visual Structure
+page_title: .NET MAUI AutoComplete Documentation - AutoComplete Visual Structure
+description: Learn more about the visual elements used in the Telerik UI for .NET MAUI AutoComplete control.
+position: 0
+slug: autocomplete-visual-structure
+---
+
+# .NET MAUI AutoComplete Visual Structure
+
+The visual structure of the [.NET MAUI AutoComplete]({%slug autocomplete-overview%}) represents the anatomy of the UI control. Being familiar with the visual elements of the AutoComplete allows you to quickly find the information required to configure them.
+
+The images in this article show the anatomy of the AutoComplete and its building blocks.
+
+![Telerik UI for .NET MAUI AutoComplete Visual Structure](images/autocomplete-placeholder.png "Visual elements of AutoComplete control")
+
+- `Placeholder`—The text that guides the end-user on what can be entered/searched in the input.
+
+## Tokens Structure
+
+![Telerik UI for .NET MAUI AutoComplete Tokens Visual Structure](images/autocomplete-tokens-template.png "Visual elements of AutoComplete control")
+
+- `Tokens`—When multiple items are selected from the dropdown list, these items appear as tokens. They can be deselected using their close button.
+- `ShowMore Template`—This template represents a UI that is displayed when the control is not focused and the space is insufficient to show all tokens in a multiple selection scenario.
+
+## Filtering Structure
+
+![Telerik UI for .NET MAUI AutoComplete Filtering Visual Structure](images/autocomplete-focused-text.png "Visual elements of AutoComplete control")
+
+- `Text`—The text entered in the control's input filed.
+- [`RadTextInput`]({%slug entry-textinput%})—The control used for the text input.
+- `Clear Button`—Clears the selection in the control (for both multiple and single selection scenarios).
+- `Filtered Items`—The items that are displayed after filtering the `ItemsSource` of the AutoComplete control.

controls/badgeview/overview.md

@@ -7,7 +7,7 @@ tags: badge, .net maui, badgeview, notifications, indicator, marker, badge for .
 slug: badgeview-overview
 ---
 
-# .NET MAUI BadgeView - Overview
+# .NET MAUI BadgeView Overview
 
 The Telerik UI for .NET MAUI BadgeView allows you to display badges in your application.
 
@@ -16,7 +16,7 @@ Badges can be used as an additional marker for any element: to decorate avatars,
 ![BadgeView Overview](images/badgeview-overview.png)
 
 
-## Key Features
+## Key Features of the .NET MAUI BadgeView
 
 * [Badge indicator]({% slug badge-overview %})—The BadgeView provides a number of features for customizing its Badge indicator.
 * [Position]({%slug badgeview-position-alignment%}#badge-position)—The BadgeView allows you to specify the `Position` of the Badge indicator based on its content.

controls/barcode/overview.md

@@ -13,7 +13,7 @@ The Telerik UI for .NET MAUI Barcode enables you to create and show barcodes. Yo
 
 ![Barcode Overview](images/barcode_overview.png)
 
-## Key Features
+## Key Features of the .NET MAUI Barcode
 
 * [Value and symbology]({% slug barcode-valuesymbology %})—The Barcode enables you set the symbology that will be used to convert the value of the control into a visual barcode representation.
 * [Sizing modes]({% slug barcode-sizingmodes %})—The Barcode provides three sizing modes that enable you to fine-tune the rendering of the barcodes.

controls/border/overview.md

@@ -16,7 +16,7 @@ It provides various border thickness types and corner-side radiuses, which can b
 
 ![Border Overview](images/border-overview.png "RadBorder Overview")
 
-## Key Features
+## Key Features of the .NET MAUI Border
 
 * [Thickness]({% slug border-styling%}#border-thickness)—Telerik UI for .NET MAUI Border provides options for setting its thickness and enables you to visually enhance your label, image, and other views.
 

controls/busyindicator/overview.md

@@ -13,7 +13,7 @@ The Telerik BusyIndicator for .NET MAUI allows you to display a notification whe
 
 ![BusyIndicator Overview](images/busyindicator-overview.png)
 
-## Key Features
+## Key Features of the .NET MAUI BusyIndicator
 
 * [Built-in animations]({%slug busyindicator-animations%}#built-in-animations)—The BusyIndicator control provides a set of built-in animations, which you can use.
 * [Custom animation]({%slug busyindicator-animations%}#custom-animation)—The control allows you to define custom content and animate it by using the `RadAnimation` class.

controls/button/overview.md

@@ -14,7 +14,7 @@ The Telerik UI for .NET MAUI Button control enhances the functionality of the st
 
 ![.NET MAUI Button Overview](images/button-overview.png "Button for .NET MAUI")
 
-## Key Features
+## Key Features of the .NET MAUI Button
 
 * [Content alignment]({% slug button-configuration%})—The Button enables you to control the horizontal and vertical positioning of its content.
 * [Background image]({%slug button-configuration%}#background-image)—Apply an image as a background of the button.

controls/calendar/blackout-dates.md

@@ -8,7 +8,7 @@ slug: calendar-blackout-dates
 
 # .NET MAUI Calendar Blackout Dates
 
-The Calendar component for .NET MAUI provides a simple way to disable specific dates. To take advantage of this feature, specify the `BlackoutDates`(`IEnumerable<DateTime>`) collection and the user cannot select the defined dates.
+The <a href="https://www.telerik.com/maui-ui/calendar" target="_blank">.NET MAUI Calendar</a> component provides a simple way to disable specific dates. To take advantage of this feature, specify the `BlackoutDates`(`IEnumerable<DateTime>`) collection and the user cannot select the defined dates.
 
 ## Disabled (Blackout) Dates Example
 

controls/calendar/commands.md

@@ -8,7 +8,7 @@ slug: calendar-commands
 
 # .NET MAUI Calendar Commands
 
-The .NET MAUI Calendar provides various commands that allow the user to switch between the display modes and views.
+The <a href="https://www.telerik.com/maui-ui/calendar" target="_blank">.NET MAUI Calendar</a> provides various commands that allow the user to switch between the display modes and views.
 
 ## Commands for Navigating the Current View
 

controls/calendar/date-properties.md

@@ -8,7 +8,7 @@ slug: calendar-date-properties
 
 # .NET MAUI Calendar Date Properties
 
-The .NET MAUI Calendar provides various date properties that allow you to configure the control by setting the display date, restricting the selectable dates, disabling the day names, and more.
+The <a href="https://www.telerik.com/maui-ui/calendar" target="_blank">.NET MAUI Calendar</a> provides various date properties that allow you to configure the control by setting the display date, restricting the selectable dates, disabling the day names, and more.
 
 ## Setting the Display Date
 

controls/calendar/display-modes.md

@@ -8,7 +8,7 @@ slug: calendar-display-modes
 
 # .NET MAUI Calendar Display Modes
 
-The Telerik .NET MAUI Calendar is a control that allows the user to select a date from a standard view that can represent various time spans. The Calendar views define what is visible in the Calendar, for example, month, year, decade, or century.
+The Telerik <a href="https://www.telerik.com/maui-ui/calendar" target="_blank">.NET MAUI Calendar</a> is a control that allows the user to select a date from a standard view that can represent various time spans. The Calendar views define what is visible in the Calendar, for example, month, year, decade, or century.
 
 ## Setting the Display Mode Programmatically
 

controls/calendar/events.md

@@ -8,7 +8,7 @@ slug: calendar-events
 
 # .NET MAUI Calendar Events
 
-The Telerik UI for .NET MAUI Calendar component exposes a set of events that users trigger through interaction. You can handle these events and customize the configuration of the UI component.
+The Telerik UI for <a href="https://www.telerik.com/maui-ui/calendar" target="_blank">.NET MAUI Calendar</a> component exposes a set of events that users trigger through interaction. You can handle these events and customize the configuration of the UI component.
 
 The Calendar for .NET MAUI exposes the [`DisplayDateChanged`](#displaydatechanged) and the [`SelectionChanged`](#selectionchanged) events.