From d734b7874f77ff7cd959cee961012fdfc9eee655 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Mon, 9 Dec 2024 16:12:47 +0530 Subject: [PATCH 01/12] 925696: Swipe mode API UG doc --- .../how-to/prevent-content-swipe-selection.md | 38 ++++++++++++++++++- 1 file changed, 37 insertions(+), 1 deletion(-) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index 75360c5952..21219aa7ea 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -48,4 +48,40 @@ The tab selection can be prevented on touch swipe action by using the Tab [Selec } } } -``` \ No newline at end of file +``` + + +## Swipe modes + +In the tab, the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property allows specifying whether the tab transition should occur while performing swiping via touch or mouse. The tab swiping is enabled or disabled using the bitwise operator. + +The following are the different swipe modes available in the tab: + +* [`TabSwipeMode.Touch`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using touch actions. +* [`TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using mouse actions. +* [`TabSwipeMode.Touch & TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using both touch and mouse actions. +* [`~TabSwipeMode.Touch & ~TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Disables both touch and mouse actions. + +```cshtml + + + + + + + + + + + + + + + + + + + +``` + +{% previewsample "https://blazorplayground.syncfusion.com/embed/LXhJWBXRTkcUTrZj?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5" %} \ No newline at end of file From 4cc984e08e426aeb34eee546faf72134c95d8810 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Mon, 9 Dec 2024 17:18:08 +0530 Subject: [PATCH 02/12] 925696: Swipe mode API UG doc --- .../how-to/prevent-content-swipe-selection.md | 38 +---------------- blazor/tabs/how-to/swipe-modes.md | 42 +++++++++++++++++++ 2 files changed, 43 insertions(+), 37 deletions(-) create mode 100644 blazor/tabs/how-to/swipe-modes.md diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index 21219aa7ea..75360c5952 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -48,40 +48,4 @@ The tab selection can be prevented on touch swipe action by using the Tab [Selec } } } -``` - - -## Swipe modes - -In the tab, the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property allows specifying whether the tab transition should occur while performing swiping via touch or mouse. The tab swiping is enabled or disabled using the bitwise operator. - -The following are the different swipe modes available in the tab: - -* [`TabSwipeMode.Touch`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using touch actions. -* [`TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using mouse actions. -* [`TabSwipeMode.Touch & TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using both touch and mouse actions. -* [`~TabSwipeMode.Touch & ~TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Disables both touch and mouse actions. - -```cshtml - - - - - - - - - - - - - - - - - - - -``` - -{% previewsample "https://blazorplayground.syncfusion.com/embed/LXhJWBXRTkcUTrZj?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5" %} \ No newline at end of file +``` \ No newline at end of file diff --git a/blazor/tabs/how-to/swipe-modes.md b/blazor/tabs/how-to/swipe-modes.md new file mode 100644 index 0000000000..4ed7e0e350 --- /dev/null +++ b/blazor/tabs/how-to/swipe-modes.md @@ -0,0 +1,42 @@ +--- +layout: post +title: Swipe modes in Blazor Tabs Component | Syncfusion +description: Checkout and learn here all about how to enable/disable content swipe selection in Syncfusion Blazor Tabs component and more. +platform: Blazor +control: Tabs +documentation: ug +--- +## Swipe modes + +In the tab, the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property allows specifying whether the tab transition should occur while performing swiping via touch or mouse. The tab swiping is enabled or disabled using the bitwise operator. + +The following are the different swipe modes available in the tab: + +* [`TabSwipeMode.Touch`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using touch actions. +* [`TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using mouse actions. +* [`TabSwipeMode.Touch & TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using both touch and mouse actions. +* [`~TabSwipeMode.Touch & ~TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Disables both touch and mouse actions. + +```cshtml + + + + + + + + + + + + + + + + + + + +``` + +{% previewsample "https://blazorplayground.syncfusion.com/embed/LXhJWBXRTkcUTrZj?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5" %} \ No newline at end of file From 832363b39a3d0122f9ab8d648bf12efdd405ce02 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Tue, 10 Dec 2024 15:33:55 +0530 Subject: [PATCH 03/12] 925696: Swipe mode API UG doc --- .../how-to/prevent-content-swipe-selection.md | 51 ------------------- .../{swipe-modes.md => tab-swipe-mode.md} | 7 +-- 2 files changed, 4 insertions(+), 54 deletions(-) delete mode 100644 blazor/tabs/how-to/prevent-content-swipe-selection.md rename blazor/tabs/how-to/{swipe-modes.md => tab-swipe-mode.md} (94%) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md deleted file mode 100644 index 75360c5952..0000000000 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ /dev/null @@ -1,51 +0,0 @@ ---- -layout: post -title: Prevent content swipe selection in Blazor Tabs Component | Syncfusion -description: Checkout and learn here all about how to prevent content swipe selection in Syncfusion Blazor Tabs component and more. -platform: Blazor -control: Tabs -documentation: ug ---- - -# Prevent content swipe selection in Blazor Tabs Component - -The tab selection can be prevented on touch swipe action by using the Tab [Selecting](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabEvents.html#Syncfusion_Blazor_Navigations_TabEvents_Selecting) event. - -```cshtml -@using Syncfusion.Blazor.Navigations - - - - - - - - - - - - - - - - - - - - - - - - - - -@code { - public void Select(SelectingEventArgs args) - { - if(args.IsSwiped) - { - args.Cancel = true; - } - } -} -``` \ No newline at end of file diff --git a/blazor/tabs/how-to/swipe-modes.md b/blazor/tabs/how-to/tab-swipe-mode.md similarity index 94% rename from blazor/tabs/how-to/swipe-modes.md rename to blazor/tabs/how-to/tab-swipe-mode.md index 4ed7e0e350..ab9ec9f873 100644 --- a/blazor/tabs/how-to/swipe-modes.md +++ b/blazor/tabs/how-to/tab-swipe-mode.md @@ -1,12 +1,13 @@ --- layout: post -title: Swipe modes in Blazor Tabs Component | Syncfusion -description: Checkout and learn here all about how to enable/disable content swipe selection in Syncfusion Blazor Tabs component and more. +title: Tab Swipe modes in Blazor Tabs Component | Syncfusion +description: Checkout and learn here all about Tab swipe modes in Syncfusion Blazor Tabs component and more. platform: Blazor control: Tabs documentation: ug --- -## Swipe modes + +# Tab Swipe modes In the tab, the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property allows specifying whether the tab transition should occur while performing swiping via touch or mouse. The tab swiping is enabled or disabled using the bitwise operator. From 55a6e4774410a9daa79a47e09c62f66186e0ba7a Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Tue, 10 Dec 2024 16:25:23 +0530 Subject: [PATCH 04/12] 925696: Swipe mode API UG doc --- blazor-toc.html | 2 +- blazor/tabs/how-to/tab-swipe-mode.md | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/blazor-toc.html b/blazor-toc.html index 06c49effd6..63694e910b 100644 --- a/blazor-toc.html +++ b/blazor-toc.html @@ -4452,7 +4452,7 @@
  • Show/Hide Tab item
  • Enable/Disable Tab item
  • Add nested Tabs
    • -
  • Prevent content swipe selection
    • +
  • Prevent content swipe selection using swipe mode
  • Create wizard
  • Style Customization for active Item
  • Set state persistence
    • diff --git a/blazor/tabs/how-to/tab-swipe-mode.md b/blazor/tabs/how-to/tab-swipe-mode.md index ab9ec9f873..9daf231c3e 100644 --- a/blazor/tabs/how-to/tab-swipe-mode.md +++ b/blazor/tabs/how-to/tab-swipe-mode.md @@ -1,13 +1,13 @@ --- layout: post title: Tab Swipe modes in Blazor Tabs Component | Syncfusion -description: Checkout and learn here all about Tab swipe modes in Syncfusion Blazor Tabs component and more. +description: Checkout and learn here all about how to prevent content swipe selection using swipe modes in Syncfusion Blazor Tabs component and more. platform: Blazor control: Tabs documentation: ug --- -# Tab Swipe modes +# Prevent tab content swipe selection using swipe modes In the tab, the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property allows specifying whether the tab transition should occur while performing swiping via touch or mouse. The tab swiping is enabled or disabled using the bitwise operator. From 26468652fe8fb64d11d49b326f7e3360896d336a Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Tue, 10 Dec 2024 16:48:09 +0530 Subject: [PATCH 05/12] 925696: Swipe mode API UG doc --- blazor-toc.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/blazor-toc.html b/blazor-toc.html index 63694e910b..d1f70d2e39 100644 --- a/blazor-toc.html +++ b/blazor-toc.html @@ -4452,7 +4452,7 @@
  • Show/Hide Tab item
  • Enable/Disable Tab item
  • Add nested Tabs
    • -
  • Prevent content swipe selection using swipe mode
    • +
  • Prevent content swipe selection using swipe mode
  • Create wizard
  • Style Customization for active Item
  • Set state persistence
    • From 6eec1c37b4ed4024347294789c90ccb62b206143 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Wed, 11 Dec 2024 09:57:47 +0530 Subject: [PATCH 06/12] 925700: Swipe mode API UG doc --- blazor-toc.html | 2 +- ...tab-swipe-mode.md => prevent-content-swipe-selection.md} | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) rename blazor/tabs/how-to/{tab-swipe-mode.md => prevent-content-swipe-selection.md} (94%) diff --git a/blazor-toc.html b/blazor-toc.html index d1f70d2e39..06c49effd6 100644 --- a/blazor-toc.html +++ b/blazor-toc.html @@ -4452,7 +4452,7 @@
  • Show/Hide Tab item
  • Enable/Disable Tab item
  • Add nested Tabs
    • -
  • Prevent content swipe selection using swipe mode
    • +
  • Prevent content swipe selection
  • Create wizard
  • Style Customization for active Item
  • Set state persistence
    • diff --git a/blazor/tabs/how-to/tab-swipe-mode.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md similarity index 94% rename from blazor/tabs/how-to/tab-swipe-mode.md rename to blazor/tabs/how-to/prevent-content-swipe-selection.md index 9daf231c3e..294a4b38ce 100644 --- a/blazor/tabs/how-to/tab-swipe-mode.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -1,13 +1,13 @@ --- layout: post -title: Tab Swipe modes in Blazor Tabs Component | Syncfusion -description: Checkout and learn here all about how to prevent content swipe selection using swipe modes in Syncfusion Blazor Tabs component and more. +title: Prevent content swipe selection in Blazor Tabs Component | Syncfusion +description: Checkout and learn here all about how to prevent content swipe selection in Syncfusion Blazor Tabs component and more. platform: Blazor control: Tabs documentation: ug --- -# Prevent tab content swipe selection using swipe modes +# Prevent content swipe selection in Blazor Tabs Component In the tab, the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property allows specifying whether the tab transition should occur while performing swiping via touch or mouse. The tab swiping is enabled or disabled using the bitwise operator. From d26c5d007b84b04b4edc29bfcc529209d397ec88 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Wed, 11 Dec 2024 15:34:28 +0530 Subject: [PATCH 07/12] 925700: Swipe mode API UG doc review correction. --- blazor/tabs/how-to/prevent-content-swipe-selection.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index 294a4b38ce..e9bf583bab 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -19,7 +19,7 @@ The following are the different swipe modes available in the tab: * [`~TabSwipeMode.Touch & ~TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Disables both touch and mouse actions. ```cshtml - + @@ -40,4 +40,4 @@ The following are the different swipe modes available in the tab: ``` -{% previewsample "https://blazorplayground.syncfusion.com/embed/LXhJWBXRTkcUTrZj?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5" %} \ No newline at end of file +{% previewsample "https://blazorplayground.syncfusion.com/embed/rDBzMrWWARDOqfgG?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5" %} \ No newline at end of file From d7f0b8d4552c1004c69d13658eabafca0d0c46ee Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Wed, 11 Dec 2024 17:30:45 +0530 Subject: [PATCH 08/12] 925700: Swipe mode API UG doc review correction. --- blazor/tabs/how-to/prevent-content-swipe-selection.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index e9bf583bab..627a6f6382 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -9,7 +9,9 @@ documentation: ug # Prevent content swipe selection in Blazor Tabs Component -In the tab, the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property allows specifying whether the tab transition should occur while performing swiping via touch or mouse. The tab swiping is enabled or disabled using the bitwise operator. +The [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property in the Tab component enables users to navigate between tabs using swipe gestures, whether through touch or mouse inputs. This feature enhances the user experience by providing an intuitive way to switch tabs. +However, in scenarios where a tab contains critical elements like a user input form, accidental swipes can be disruptive. For example, if a user is filling out a form and unintentionally swipes, it could cause the tab to change, interrupting their workflow and potentially resulting in unsaved data loss. +To mitigate this, developers can configure the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property to suit the application's needs, ensuring a balance between ease of navigation and user data protection. The following are the different swipe modes available in the tab: From 76cef6a710345516536c4a49dce0609bd4dacaa1 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Wed, 11 Dec 2024 18:15:01 +0530 Subject: [PATCH 09/12] 925700: Swipe mode API UG doc review correction. --- blazor/tabs/how-to/prevent-content-swipe-selection.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index 627a6f6382..bbe7ca5a7a 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -15,9 +15,9 @@ To mitigate this, developers can configure the [`SwipeMode`](https://help.syncfu The following are the different swipe modes available in the tab: +* [`TabSwipeMode.Touch & TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - By default, allows the user to swipe the tabs using both touch and mouse actions. * [`TabSwipeMode.Touch`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using touch actions. * [`TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using mouse actions. -* [`TabSwipeMode.Touch & TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using both touch and mouse actions. * [`~TabSwipeMode.Touch & ~TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Disables both touch and mouse actions. ```cshtml From 7609083b35924d7bb2d569e4a7c44d3f3ea281c1 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Thu, 12 Dec 2024 12:33:00 +0530 Subject: [PATCH 10/12] 925700: Swipe mode API UG doc review correction. --- .../how-to/prevent-content-swipe-selection.md | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index bbe7ca5a7a..67b032f38c 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -9,16 +9,18 @@ documentation: ug # Prevent content swipe selection in Blazor Tabs Component -The [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property in the Tab component enables users to navigate between tabs using swipe gestures, whether through touch or mouse inputs. This feature enhances the user experience by providing an intuitive way to switch tabs. -However, in scenarios where a tab contains critical elements like a user input form, accidental swipes can be disruptive. For example, if a user is filling out a form and unintentionally swipes, it could cause the tab to change, interrupting their workflow and potentially resulting in unsaved data loss. -To mitigate this, developers can configure the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property to suit the application's needs, ensuring a balance between ease of navigation and user data protection. +The [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property in the Tab component allows users to navigate between tabs using swipe gestures, improving the overall navigation experience. It supports both touch and mouse inputs, enabling intuitive tab switching. -The following are the different swipe modes available in the tab: +However, in certain cases, such as when a tab contains critical elements like a form, accidental swipes can disrupt the user's workflow. For example, if a user is filling out a form and mistakenly swipes, the tab might change unexpectedly, potentially leading to unsaved data or interruptions. -* [`TabSwipeMode.Touch & TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - By default, allows the user to swipe the tabs using both touch and mouse actions. -* [`TabSwipeMode.Touch`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using touch actions. -* [`TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Allows the user to swipe the tabs using mouse actions. -* [`~TabSwipeMode.Touch & ~TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - Disables both touch and mouse actions. +To address this, you can customize the [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) property based on the needs of the application. By adjusting this setting, you can balance smooth, intuitive navigation with protecting the user experience and safeguarding against accidental tab switches. + +The following are the available [`SwipeMode`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfTab.html#Syncfusion_Blazor_Navigations_SfTab_SwipeMode) options for the Tab component: + +* [`TabSwipeMode.Touch & TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - By default, this option allows the user to swipe between tabs using both touch and mouse actions. +* [`TabSwipeMode.Touch`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - This option allows users to swipe between tabs using touch gestures only. +* [`TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - This option allows users to swipe between tabs using mouse gestures only. +* [`~TabSwipeMode.Touch & ~TabSwipeMode.Mouse`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.TabSwipeMode.html) - This disables both touch and mouse swipe actions, preventing any unintended tab switches. ```cshtml From bddcd926313a795fd163ed78e3c00580a9b2e3d5 Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Thu, 12 Dec 2024 17:42:41 +0530 Subject: [PATCH 11/12] 925700: Swipe mode API UG doc review correction. --- .../how-to/prevent-content-swipe-selection.md | 45 +++++++++++++------ 1 file changed, 31 insertions(+), 14 deletions(-) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index 67b032f38c..fa623eff78 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -25,20 +25,37 @@ The following are the available [`SwipeMode`](https://help.syncfusion.com/cr/bla ```cshtml - - - - - - - - - - - - - - + + India + +
    + India officially the Republic of India, is a country in South Asia. It is the seventh-largest country by area, the second-most populous country with over 1.2 billion people, and the most populous democracy in the world. Bounded by the Indian Ocean on the south, the Arabian Sea on the south-west, and the Bay of Bengal on the south-east, it shares land borders with Pakistan to the west;China, Nepal, and Bhutan to the north-east; and Burma and Bangladesh to the east. In the Indian Ocean, India is in the vicinity of Sri Lanka and the Maldives; in addition, India Andaman and Nicobar Islands share a maritime border with Thailand and Indonesia. +
    +     +     + + Australia + +
    + Australia, officially the Commonwealth of Australia, is a country comprising the mainland of the Australian continent, the island of Tasmania and numerous smaller islands. It is the world sixth-largest country by total area. Neighboring countries include Indonesia, East Timor and Papua New Guinea to the north; the Solomon Islands, Vanuatu and New Caledonia to the north-east; and New Zealand to the south-east. +
    +     +     + + USA + +
    + The United States of America (USA or U.S.A.), commonly called the United States (US or U.S.) and America, is a federal republic consisting of fifty states and a federal district. The 48 contiguous states and the federal district of Washington, D.C. are in central North America between Canada and Mexico. The state of Alaska is west of Canada and east of Russia across the Bering Strait, and the state of Hawaii is in the mid-North Pacific. The country also has five populated and nine unpopulated territories in the Pacific and the Caribbean. +
    +     +     + + France + +
    + France, officially the French Republic is a sovereign state comprising territory in western Europe and several overseas regions and territories. The European part of France, called Metropolitan France, extends from the Mediterranean Sea to the English Channel and the North Sea, and from the Rhine to the Atlantic Ocean; France covers 640,679 square kilo metres and as of August 2015 has a population of 67 million, counting all the overseas departments and territories. +
    +     From c6337294d3571f9ccc6e3cbe47f77113d1ff304c Mon Sep 17 00:00:00 2001 From: VijayakumarSF4470 <160592658+VijayakumarSF4470@users.noreply.github.com> Date: Thu, 12 Dec 2024 18:59:32 +0530 Subject: [PATCH 12/12] 925700: Swipe mode API UG doc --- blazor/tabs/how-to/prevent-content-swipe-selection.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/blazor/tabs/how-to/prevent-content-swipe-selection.md b/blazor/tabs/how-to/prevent-content-swipe-selection.md index fa623eff78..802d94fa34 100644 --- a/blazor/tabs/how-to/prevent-content-swipe-selection.md +++ b/blazor/tabs/how-to/prevent-content-swipe-selection.md @@ -61,4 +61,4 @@ The following are the available [`SwipeMode`](https://help.syncfusion.com/cr/bla     ``` -{% previewsample "https://blazorplayground.syncfusion.com/embed/rDBzMrWWARDOqfgG?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5" %} \ No newline at end of file +{% previewsample "https://blazorplayground.syncfusion.com/embed/LjLzsrsrTlqFIhjX?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5" %} \ No newline at end of file