From 2b63c3d978cb718c812f9e7aeb9ae1500a114676 Mon Sep 17 00:00:00 2001
From: mrholek <lukasz@holeczek.pl>
Date: Sun, 26 Jul 2026 14:15:21 +0200
Subject: [PATCH 1/2] docs: capitalize the React framework name in prose

---
 .../docs/components/accordion/index.mdx        |  2 +-
 .../content/docs/components/alert/index.mdx    |  6 +++---
 .../content/docs/components/avatar/index.mdx   |  6 +++---
 .../content/docs/components/badge/index.mdx    |  4 ++--
 .../docs/components/breadcrumb/index.mdx       |  4 ++--
 .../content/docs/components/button/index.mdx   |  4 ++--
 .../src/content/docs/components/card/index.mdx |  2 +-
 .../docs/src/content/docs/components/icon.mdx  | 18 +++++++++---------
 .../docs/components/list-group/index.mdx       |  2 +-
 .../content/docs/components/modal/index.mdx    |  6 +++---
 .../docs/components/placeholder/index.mdx      |  2 +-
 .../docs/components/table/bootstrap.mdx        | 10 +++++-----
 .../content/docs/components/table/index.mdx    | 14 +++++++-------
 .../content/docs/forms/input-mask/index.mdx    |  6 +++---
 .../src/content/docs/forms/switch/index.mdx    |  2 +-
 .../content/docs/templates/admin-dashboard.mdx |  2 +-
 .../src/content/docs/templates/customize.mdx   |  4 ++--
 .../src/content/docs/templates/download.mdx    |  6 +++---
 18 files changed, 50 insertions(+), 50 deletions(-)

diff --git a/packages/docs/src/content/docs/components/accordion/index.mdx b/packages/docs/src/content/docs/components/accordion/index.mdx
index 4f755692..56f4209a 100644
--- a/packages/docs/src/content/docs/components/accordion/index.mdx
+++ b/packages/docs/src/content/docs/components/accordion/index.mdx
@@ -31,7 +31,7 @@ Add `flush` to remove the default `background-color`, some borders, and some rou
 
 ### Always open
 
-Add `alwaysOpen` property to make react accordion items stay open when another item is opened.
+Add `alwaysOpen` property to make React accordion items stay open when another item is opened.
 
 <Example code={AccordionAlwaysOpenExampleRaw} name="AccordionAlwaysOpenExample" componentName="React Accordion">
   <AccordionAlwaysOpenExample client:only="react" />
diff --git a/packages/docs/src/content/docs/components/alert/index.mdx b/packages/docs/src/content/docs/components/alert/index.mdx
index 087e01a2..c189af16 100644
--- a/packages/docs/src/content/docs/components/alert/index.mdx
+++ b/packages/docs/src/content/docs/components/alert/index.mdx
@@ -43,7 +43,7 @@ Click the button below to show an alert (hidden with inline styles to start), th
 
 ### Link color
 
-Use the `<CAlertLink>` component to immediately give matching colored links inside any react alert component.
+Use the `<CAlertLink>` component to immediately give matching colored links inside any React alert component.
 
 <Example code={AlertLinkColorExampleRaw} name="AlertLinkColorExample" componentName="React Alert">
   <AlertLinkColorExample client:only="react" />
@@ -59,13 +59,13 @@ React Alert can also incorporate supplementary components &amp; elements like he
 
 ### Icons
 
-Similarly, you can use [flexbox utilities](https://coreui.io/bootstrap/docs/utilities/flex) and [CoreUI Icons](https://coreui.io/icons/) to create react alerts with icons. Depending on your icons and content, you may want to add more utilities or custom styles.
+Similarly, you can use [flexbox utilities](https://coreui.io/bootstrap/docs/utilities/flex) and [CoreUI Icons](https://coreui.io/icons/) to create React alerts with icons. Depending on your icons and content, you may want to add more utilities or custom styles.
 
 <Example code={AlertIcons1ExampleRaw} name="AlertIcons1Example" componentName="React Alert">
   <AlertIcons1Example client:only="react" />
 </Example>
 
-Need more than one icon for your react alerts? Consider using [CoreUI Icons](https://coreui.io/icons/).
+Need more than one icon for your React alerts? Consider using [CoreUI Icons](https://coreui.io/icons/).
 
 <Example code={AlertIcons2ExampleRaw} name="AlertIcons2Example" componentName="React Alert">
   <AlertIcons2Example client:only="react" />
diff --git a/packages/docs/src/content/docs/components/avatar/index.mdx b/packages/docs/src/content/docs/components/avatar/index.mdx
index 656197a8..5e4ba18f 100644
--- a/packages/docs/src/content/docs/components/avatar/index.mdx
+++ b/packages/docs/src/content/docs/components/avatar/index.mdx
@@ -47,7 +47,7 @@ Incorporate icons within React avatars, allowing for a visual representation usi
 
 ## Rounded avatars
 
-Use the `shape="rounded"` prop to make react avatars squared with rounded corners.
+Use the `shape="rounded"` prop to make React avatars squared with rounded corners.
 
 <Example code={AvatarRoundedRaw} name="AvatarRounded" componentName="React Avatar">
   <AvatarRounded client:only="react" />
@@ -55,7 +55,7 @@ Use the `shape="rounded"` prop to make react avatars squared with rounded corner
 
 ## Square avatars
 
-Use the `shape="rounded-0"` prop to make react avatars squared.
+Use the `shape="rounded-0"` prop to make React avatars squared.
 
 <Example code={AvatarSquareRaw} name="AvatarSquare" componentName="React Avatar">
   <AvatarSquare client:only="react" />
@@ -63,7 +63,7 @@ Use the `shape="rounded-0"` prop to make react avatars squared.
 
 ## Sizes
 
-Fancy larger or smaller react avatar component? Add `size="xl"`, `size="lg"`, `size="md"` or `size="sm"` for additional sizes.
+Fancy larger or smaller React avatar component? Add `size="xl"`, `size="lg"`, `size="md"` or `size="sm"` for additional sizes.
 
 <Example code={AvatarSizesRaw} name="AvatarSizes" componentName="React Avatar">
   <AvatarSizes client:only="react" />
diff --git a/packages/docs/src/content/docs/components/badge/index.mdx b/packages/docs/src/content/docs/components/badge/index.mdx
index 5396d057..801f82d5 100644
--- a/packages/docs/src/content/docs/components/badge/index.mdx
+++ b/packages/docs/src/content/docs/components/badge/index.mdx
@@ -37,7 +37,7 @@ React badges can be used as part of links or buttons to provide a counter.
   <Badge2Example client:only="react" />
 </Example>
 
-Remark that depending on how you use them, react badges may be complicated for users of screen readers and related assistive technologies.
+Remark that depending on how you use them, React badges may be complicated for users of screen readers and related assistive technologies.
 
 Unless the context is clear, consider including additional context with a visually hidden piece of additional text.
 
@@ -61,7 +61,7 @@ You can also create more generic indicators without a counter using a few more u
 
 ## Contextual variations
 
-Add any of the below-mentioned `color` props to modify the presentation of a react badge.
+Add any of the below-mentioned `color` props to modify the presentation of a React badge.
 
 <Example code={BadgeContextualVariationsRaw} name="BadgeContextualVariations" componentName="React Badge">
   <BadgeContextualVariations client:only="react" />
diff --git a/packages/docs/src/content/docs/components/breadcrumb/index.mdx b/packages/docs/src/content/docs/components/breadcrumb/index.mdx
index 9adaf03e..7ad20cad 100644
--- a/packages/docs/src/content/docs/components/breadcrumb/index.mdx
+++ b/packages/docs/src/content/docs/components/breadcrumb/index.mdx
@@ -20,7 +20,7 @@ import BreadcrumbDividers3ExampleJsRaw from './examples/BreadcrumbDividers3Examp
 
 ## How to use React Breadcrumb Component.
 
-The react breadcrumb navigation provides links back to each previous page the user navigated through and shows the current location in a website or an application. You don’t have to add separators, because they automatically added in CSS through ::before and content.
+The React breadcrumb navigation provides links back to each previous page the user navigated through and shows the current location in a website or an application. You don’t have to add separators, because they automatically added in CSS through ::before and content.
 
 <Example code={BreadcrumbExampleRaw} name="BreadcrumbExample" componentName="React Breadcrumb">
   <BreadcrumbExample client:only="react" />
@@ -63,7 +63,7 @@ $breadcrumb-divider: none;
 
 ## Accessibility
 
-Since react breadcrumbs provide navigation, it's useful to add a significant label such as `aria-label="breadcrumb"` to explain the type of navigation implemented in the `<nav>` element. You should also add an `aria-current="page"` to the last item of the set to show that it represents the current page. **CoreUI for React.js automatically add all of this labels to breadcrumb's components.**
+Since React breadcrumbs provide navigation, it's useful to add a significant label such as `aria-label="breadcrumb"` to explain the type of navigation implemented in the `<nav>` element. You should also add an `aria-current="page"` to the last item of the set to show that it represents the current page. **CoreUI for React.js automatically add all of this labels to breadcrumb's components.**
 
 For more information, see the [WAI-ARIA Authoring Practices for the breadcrumb pattern](https://www.w3.org/TR/wai-aria-practices/#breadcrumb).
 
diff --git a/packages/docs/src/content/docs/components/button/index.mdx b/packages/docs/src/content/docs/components/button/index.mdx
index fcbceb8b..28f9fa23 100644
--- a/packages/docs/src/content/docs/components/button/index.mdx
+++ b/packages/docs/src/content/docs/components/button/index.mdx
@@ -58,7 +58,7 @@ CoreUI includes a bunch of predefined buttons components, each serving its own s
 
 ## Disable text wrapping
 
-If you don't want the react button text to wrap, you can add the `.text-nowrap` className to the `<CButton>`. In Sass, you can set `$btn-white-space: nowrap` to disable text wrapping for each button.
+If you don't want the React button text to wrap, you can add the `.text-nowrap` className to the `<CButton>`. In Sass, you can set `$btn-white-space: nowrap` to disable text wrapping for each button.
 
 ## Button components
 
@@ -117,7 +117,7 @@ To apply theme colors to React ghost buttons, use the `color` and `variant="ghos
 
 ## Sizes
 
-Larger or smaller react buttons? Add `size="lg"` or `size="sm"` for additional sizes.
+Larger or smaller React buttons? Add `size="lg"` or `size="sm"` for additional sizes.
 
 <Example code={ButtonSizesExampleRaw} name="ButtonSizesExample" componentName="React Button">
   <ButtonSizesExample client:only="react" />
diff --git a/packages/docs/src/content/docs/components/card/index.mdx b/packages/docs/src/content/docs/components/card/index.mdx
index 37084994..392a5171 100644
--- a/packages/docs/src/content/docs/components/card/index.mdx
+++ b/packages/docs/src/content/docs/components/card/index.mdx
@@ -69,7 +69,7 @@ import CardGrid4ExampleRaw from './examples/CardGrid4Example.tsx?raw'
 
 ## About
 
-A react card component is a content container. It incorporates options for images, headers, and footers, a wide variety of content, contextual background colors, and excellent display options.
+A React card component is a content container. It incorporates options for images, headers, and footers, a wide variety of content, contextual background colors, and excellent display options.
 
 ## Example
 
diff --git a/packages/docs/src/content/docs/components/icon.mdx b/packages/docs/src/content/docs/components/icon.mdx
index 8c3df4c4..fdd5f4a9 100644
--- a/packages/docs/src/content/docs/components/icon.mdx
+++ b/packages/docs/src/content/docs/components/icon.mdx
@@ -42,11 +42,11 @@ yarn add @coreui/icons @coreui/icons-react
 
 ## Usage
 
-Import react icons using one of these two options:
+Import React icons using one of these two options:
 
-### Single react icon
+### Single React icon
 
-To use a single react icon, import the `<CIcon>` component and the desired icon(s) from the `@coreui/icons` library. Then, include the `<CIcon>` component in your code and specify the icon prop with the imported icon variable. Additionally, you can set the desired size for the icon using the `size` prop.
+To use a single React icon, import the `<CIcon>` component and the desired icon(s) from the `@coreui/icons` library. Then, include the `<CIcon>` component in your code and specify the icon prop with the imported icon variable. Additionally, you can set the desired size for the icon using the `size` prop.
 
 <Example>
   <IconDemo0 client:only="react" />
@@ -62,7 +62,7 @@ import { cilList, cilShieldAlt } from '@coreui/icons';
 ...
 ```
 
-### All react icons
+### All React icons
 
 To use all icons available in the CoreUI React Icons package, import the CIcon component and the entire `@coreui/icons` library using the `* as` syntax. Then, reference the desired icon within the `icon` prop.
 
@@ -108,7 +108,7 @@ CoreUI React Icons leverage local CSS variables, such as `--ci-primary-color` an
 
 ### Sizing
 
-Set heights of react icons using size property like size="lg" and size="sm".
+Set heights of React icons using size property like size="lg" and size="sm".
 
 ```jsx preview
 <CIcon icon={cilList} size="sm" />
@@ -157,11 +157,11 @@ import { CIconSvg } from '@coreui/icons-react';
 
 ## Accessibility
 
-It's crucial for react icons to be seen by as many people as possible because they have the power to communicate a variety of meaningful information.
+It's crucial for React icons to be seen by as many people as possible because they have the power to communicate a variety of meaningful information.
 
 People who are blind, have low vision, or have other visual impairments make up approximately 10% of the world's population, and more than 5% of people worldwide have hearing loss that makes them unable to function normally.
 
-Therefore, it's crucial to make sure that the assistive equipment for people with disabilities, such as screen readers, either ignores or better understands the react icons you use online.
+Therefore, it's crucial to make sure that the assistive equipment for people with disabilities, such as screen readers, either ignores or better understands the React icons you use online.
 
 Icons are used in one of two ways on websites, apps, and other digital spaces.
 
@@ -177,7 +177,7 @@ In certain circumstances, the details of the icon ought to be concealed from the
 
 You need to make sure that consumers understand the meaning an icon is intended to represent by giving them text-based alternatives.
 
-This applies to both the content you're using icons to represent (such as the status of your shopping cart or the number of unread messages), as well react icons as interactive controls (such as buttons, form elements, toggles, etc.).
+This applies to both the content you're using icons to represent (such as the status of your shopping cart or the number of unread messages), as well React icons as interactive controls (such as buttons, form elements, toggles, etc.).
 
 ### CoreUI React Icons and Accessibility
 
@@ -228,7 +228,7 @@ CoreUI React Icon Component will make the necessary adjustments so that only scr
 </button>
 ```
 
-## Available react icons
+## Available React icons
 
 The CoreUI React Icons package includes a comprehensive library of more than 1500 icons, available in various formats such as SVG, PNG, and Webfonts. These popular icons are meticulously crafted symbols representing common actions and items. You can utilize them in your digital products, whether they are web or mobile applications, to enhance their visual appeal and user experience.
 
diff --git a/packages/docs/src/content/docs/components/list-group/index.mdx b/packages/docs/src/content/docs/components/list-group/index.mdx
index 287e2da7..56a9cead 100644
--- a/packages/docs/src/content/docs/components/list-group/index.mdx
+++ b/packages/docs/src/content/docs/components/list-group/index.mdx
@@ -1,7 +1,7 @@
 ---
 title: "React List Group Component"
 name: "List group"
-description: "React List Group component allows displaying a series of content. Learn how to use react list group to build complex list structure on your website."
+description: "React List Group component allows displaying a series of content. Learn how to use React list group to build complex list structure on your website."
 otherFrameworks:
   - list-group
 ---
diff --git a/packages/docs/src/content/docs/components/modal/index.mdx b/packages/docs/src/content/docs/components/modal/index.mdx
index 678e847c..af10b32d 100644
--- a/packages/docs/src/content/docs/components/modal/index.mdx
+++ b/packages/docs/src/content/docs/components/modal/index.mdx
@@ -35,7 +35,7 @@ A modal component is a fundamental part of modern UI design, providing a focused
 
 ### Static modal component example
 
-Below is a static react modal component example (meaning its `position` and `display` have been overridden). Included are the modal header, modal body (required for `padding`), and modal footer (optional). We ask that you include react modal headers with dismiss actions whenever possible, or provide another explicit dismiss action.
+Below is a static React modal component example (meaning its `position` and `display` have been overridden). Included are the modal header, modal body (required for `padding`), and modal footer (optional). We ask that you include React modal headers with dismiss actions whenever possible, or provide another explicit dismiss action.
 
 <Example>
   <div className="modal position-static d-block" tabIndex="-1">
@@ -97,7 +97,7 @@ When modals become too long for the user's viewport or device, they scroll indep
   <ModalScrollingLongContentExample client:only="react" />
 </Example>
 
-You can also create a scrollable react modal component that allows scroll the modal body by adding `scrollable` prop.
+You can also create a scrollable React modal component that allows scroll the modal body by adding `scrollable` prop.
 
 <Example code={ModalScrollingLongContent2ExampleRaw} name="ModalScrollingLongContent2Example" componentName="React Modal">
   <ModalScrollingLongContent2Example client:only="react" />
@@ -117,7 +117,7 @@ Add `alignment="center` to `<CModal>` to vertically center the React modal.
 
 ### Tooltips and popovers
 
-`<CTooltips>` and `<CPopovers>` can be placed within react modals as needed. When modal components are closed, any tooltips and popovers within are also automatically dismissed.
+`<CTooltips>` and `<CPopovers>` can be placed within React modals as needed. When modal components are closed, any tooltips and popovers within are also automatically dismissed.
 
 <Example code={ModalTooltipsAndPopoversExampleRaw} name="ModalTooltipsAndPopoversExample" componentName="React Modal">
   <ModalTooltipsAndPopoversExample client:only="react" />
diff --git a/packages/docs/src/content/docs/components/placeholder/index.mdx b/packages/docs/src/content/docs/components/placeholder/index.mdx
index 6f009758..68a7cd2f 100644
--- a/packages/docs/src/content/docs/components/placeholder/index.mdx
+++ b/packages/docs/src/content/docs/components/placeholder/index.mdx
@@ -1,7 +1,7 @@
 ---
 title: "React Placeholder Component"
 name: "Placeholder"
-description: "Use loading react placeholders for your components or pages to indicate something may still be loading."
+description: "Use loading React placeholders for your components or pages to indicate something may still be loading."
 otherFrameworks:
   - placeholder
 ---
diff --git a/packages/docs/src/content/docs/components/table/bootstrap.mdx b/packages/docs/src/content/docs/components/table/bootstrap.mdx
index 28a2dec1..3ebeaec6 100644
--- a/packages/docs/src/content/docs/components/table/bootstrap.mdx
+++ b/packages/docs/src/content/docs/components/table/bootstrap.mdx
@@ -128,7 +128,7 @@ Both methods produce the same html code.
 
 ## Variants
 
-Use contextual classes to color react tables, table rows or individual cells.
+Use contextual classes to color React tables, table rows or individual cells.
 
 
 <Example className="theme-bootstrap">
@@ -273,7 +273,7 @@ return <CTable columns={columns} items={items} />
 
 ### Striped rows
 
-Use `striped` property to add zebra-striping to any react table row within the `<CTableBody>`.
+Use `striped` property to add zebra-striping to any React table row within the `<CTableBody>`.
 
 <Example className="theme-bootstrap">
   <TableExample client:only="react" striped />
@@ -299,7 +299,7 @@ Enable `striped` to alternate row background colors for better visual distinctio
 </CTable>
 ```
 
-These classes can also be added to react table variants:
+These classes can also be added to React table variants:
 
 <Example className="theme-bootstrap">
   <TableExample client:only="react" color="dark" striped />
@@ -553,7 +553,7 @@ Add `bordered` property for borders on all sides of the table and cells.
 
 ### Tables without borders
 
-Add `borderless` property for a react table without borders.
+Add `borderless` property for a React table without borders.
 
 <Example className="theme-bootstrap">
   <TableExample client:only="react" borderless />
@@ -714,7 +714,7 @@ You can also put all table components together manually as hitherto.
 
 ## Nesting
 
-Border styles, active styles, and react table component variants are not inherited by nested tables.
+Border styles, active styles, and React table component variants are not inherited by nested tables.
 
 <Example className="theme-bootstrap">
   <TableNestingExample client:only="react" />
diff --git a/packages/docs/src/content/docs/components/table/index.mdx b/packages/docs/src/content/docs/components/table/index.mdx
index 12378b73..89bdf466 100644
--- a/packages/docs/src/content/docs/components/table/index.mdx
+++ b/packages/docs/src/content/docs/components/table/index.mdx
@@ -35,7 +35,7 @@ import TableResponsiveXxlExampleRaw from './examples/TableResponsiveXxlExample.t
 
 ## How to use React Table Component
 
-Due to the widespread use of `<CTable>` elements across third-party widgets like calendars and date pickers, CoreUI's react tables are **opt-in**. All table styles are not inherited in CoreUI, meaning any nested tables can be styled independent from the parent.
+Due to the widespread use of `<CTable>` elements across third-party widgets like calendars and date pickers, CoreUI's React tables are **opt-in**. All table styles are not inherited in CoreUI, meaning any nested tables can be styled independent from the parent.
 
 Using the most basic table CoreUI, here's how `<CTable>`-based tables look in CoreUI.
 
@@ -131,7 +131,7 @@ Both methods produce the same html code.
 
 ## Variants
 
-Use contextual classes to color react tables, table rows or individual cells.
+Use contextual classes to color React tables, table rows or individual cells.
 
 
 <Example>
@@ -276,7 +276,7 @@ return <CTable columns={columns} items={items} />
 
 ### Striped rows
 
-Use `striped` property to add zebra-striping to any react table row within the `<CTableBody>`.
+Use `striped` property to add zebra-striping to any React table row within the `<CTableBody>`.
 
 <Example>
   <TableExample client:only="react" striped />
@@ -302,7 +302,7 @@ Use `stripedColumns` boolean property to add zebra-striping to any table column.
 </CTable>
 ```
 
-These classes can also be added to react table variants:
+These classes can also be added to React table variants:
 
 <Example>
   <TableExample client:only="react" color="dark" striped />
@@ -346,7 +346,7 @@ These classes can also be added to react table variants:
 
 ### Hoverable rows
 
-Use `hover` property to enable a hover state on react table rows within a `<CTableBody>`.
+Use `hover` property to enable a hover state on React table rows within a `<CTableBody>`.
 
 <Example>
   <TableExample client:only="react" hover />
@@ -556,7 +556,7 @@ Add `bordered` property for borders on all sides of the table and cells.
 
 ### Tables without borders
 
-Add `borderless` property for a react table without borders.
+Add `borderless` property for a React table without borders.
 
 <Example>
   <TableExample client:only="react" borderless />
@@ -717,7 +717,7 @@ You can also put all table components together manually as hitherto.
 
 ## Nesting
 
-Border styles, active styles, and react table component variants are not inherited by nested tables.
+Border styles, active styles, and React table component variants are not inherited by nested tables.
 
 <Example>
   <TableNestingExample client:only="react" />
diff --git a/packages/docs/src/content/docs/forms/input-mask/index.mdx b/packages/docs/src/content/docs/forms/input-mask/index.mdx
index 23fc1549..b9542551 100644
--- a/packages/docs/src/content/docs/forms/input-mask/index.mdx
+++ b/packages/docs/src/content/docs/forms/input-mask/index.mdx
@@ -1,7 +1,7 @@
 ---
 title: "React Input Mask"
 name: "Input mask"
-description: "React input masks allow you to regulate the format of data entered. You can enhance data entry accuracy by implementing react input masks for fields with consistent formatting requirements. This ensures that users input data correctly, such as accurately formatted phone numbers in a designated phone number field."
+description: "React input masks allow you to regulate the format of data entered. You can enhance data entry accuracy by implementing React input masks for fields with consistent formatting requirements. This ensures that users input data correctly, such as accurately formatted phone numbers in a designated phone number field."
 ---
 
 import { InputMaskExample } from './examples/InputMaskExample'
@@ -52,7 +52,7 @@ Please take a moment to review some example masks you can use for reference. The
 
 ### Phone
 
-This example react input mask for a phone number follows the format commonly used in North America. It consists of three groups of numbers: the area code enclosed in parentheses, followed by a space, and then the seven-digit phone number separated by a hyphen.
+This example React input mask for a phone number follows the format commonly used in North America. It consists of three groups of numbers: the area code enclosed in parentheses, followed by a space, and then the seven-digit phone number separated by a hyphen.
 
 <Example code={InputMaskPhoneExampleRaw} name="InputMaskPhoneExample" componentName="React Form Input Mask">
   <InputMaskPhoneExample client:only="react" />
@@ -60,7 +60,7 @@ This example react input mask for a phone number follows the format commonly use
 
 ### Credit Card
 
-The provided code snippet demonstrates an implementation of an react input mask for a credit card number using the IMask library in JavaScript. The mask is set to "0000 0000 0000 0000", indicating that the input should consist of a 16-digit credit card number with spaces separating every four digits. The component renders an input field with the specified mask, allowing users to enter credit card numbers in the desired format.
+The provided code snippet demonstrates an implementation of a React input mask for a credit card number using the IMask library in JavaScript. The mask is set to "0000 0000 0000 0000", indicating that the input should consist of a 16-digit credit card number with spaces separating every four digits. The component renders an input field with the specified mask, allowing users to enter credit card numbers in the desired format.
 
 <Example code={InputMaskCreditCardExampleRaw} name="InputMaskCreditCardExample" componentName="React Form Input Mask">
   <InputMaskCreditCardExample client:only="react" />
diff --git a/packages/docs/src/content/docs/forms/switch/index.mdx b/packages/docs/src/content/docs/forms/switch/index.mdx
index 8ea4f787..5d943f76 100644
--- a/packages/docs/src/content/docs/forms/switch/index.mdx
+++ b/packages/docs/src/content/docs/forms/switch/index.mdx
@@ -27,7 +27,7 @@ When a user interacts with the component by clicking or tapping on it, the switc
 
 ## Sizing
 
-Larger or smaller react switches? Add `size="lg"` or `size="xl"` for additional sizes.
+Larger or smaller React switches? Add `size="lg"` or `size="xl"` for additional sizes.
 
 <Example code={FormSwitchSizingExampleRaw} name="FormSwitchSizingExample" componentName="React Switch Input">
   <FormSwitchSizingExample client:only="react" />
diff --git a/packages/docs/src/content/docs/templates/admin-dashboard.mdx b/packages/docs/src/content/docs/templates/admin-dashboard.mdx
index d2c26b5e..e956a495 100644
--- a/packages/docs/src/content/docs/templates/admin-dashboard.mdx
+++ b/packages/docs/src/content/docs/templates/admin-dashboard.mdx
@@ -1,7 +1,7 @@
 ---
 title: "React Templates"
 name: "React Templates"
-description: "Develop modern, beautiful, and responsive applications in half the time with high-performing and easy-to-customize react admin panels to cover any requirement."
+description: "Develop modern, beautiful, and responsive applications in half the time with high-performing and easy-to-customize React admin panels to cover any requirement."
 ---
 
 import { AdminDashboardDemo0 } from './examples/AdminDashboardDemo0'
diff --git a/packages/docs/src/content/docs/templates/customize.mdx b/packages/docs/src/content/docs/templates/customize.mdx
index 20535b09..059f4397 100644
--- a/packages/docs/src/content/docs/templates/customize.mdx
+++ b/packages/docs/src/content/docs/templates/customize.mdx
@@ -1,6 +1,6 @@
 ---
-title: "Customize react templates"
-name: "Customize react templates"
+title: "Customize React templates"
+name: "Customize React templates"
 description: "Learn how to theme, customize, and extend CoreUI React Templates with Sass, a boatload of global options."
 ---
 
diff --git a/packages/docs/src/content/docs/templates/download.mdx b/packages/docs/src/content/docs/templates/download.mdx
index a46f1a95..9adcdeb8 100644
--- a/packages/docs/src/content/docs/templates/download.mdx
+++ b/packages/docs/src/content/docs/templates/download.mdx
@@ -1,7 +1,7 @@
 ---
-title: "Download react templates"
-name: "Download react templates"
-description: "Download CoreUI React Admin Templates to get the source code that lets you customize and create your react-based application."
+title: "Download React templates"
+name: "Download React templates"
+description: "Download CoreUI React Admin Templates to get the source code that lets you customize and create your React-based application."
 ---
 
 ## Source files

From 818b97d923b70761f84b70a60cf3d2f308eb409b Mon Sep 17 00:00:00 2001
From: mrholek <lukasz@holeczek.pl>
Date: Sun, 26 Jul 2026 14:31:14 +0200
Subject: [PATCH 2/2] docs: move Floating Labels back into alphabetical order
 in the sidebar

---
 packages/docs/src/data/sidebar.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/docs/src/data/sidebar.yml b/packages/docs/src/data/sidebar.yml
index 786c4513..7334e559 100644
--- a/packages/docs/src/data/sidebar.yml
+++ b/packages/docs/src/data/sidebar.yml
@@ -44,6 +44,8 @@
       badge:
         color: success
         text: New
+    - title: Floating Labels
+      to: /forms/floating-labels/
     - title: Input
       to: /forms/input/
     - title: Input Mask
@@ -60,8 +62,6 @@
       to: /forms/switch/
     - title: Textarea
       to: /forms/textarea/
-    - title: Floating Labels
-      to: /forms/floating-labels/
     - title: Layout
       to: /forms/layout/
     - title: Validation