Skip to content

Commit ae3a7a6

Browse files
committed
docs: update content
1 parent dea7fc2 commit ae3a7a6

File tree

663 files changed

+18073
-15206
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

663 files changed

+18073
-15206
lines changed

packages/docs/content/api/CAccordion.api.mdx

Lines changed: 29 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -21,43 +21,66 @@ import CAccordion from '@coreui/react/src/components/accordion/CAccordion'
2121
<td><code>{`string`}</code>, <code>{`number`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">Determines which accordion item is currently active (expanded) by default.<br/>Accepts a number or string corresponding to the <code>{`itemKey`}</code> of the desired accordion item.<br /><JSXDocs code={`<CAccordion activeItemKey="1">...</CAccordion>`} /></td>
24+
<td colSpan="3">
25+
<p>Determines which accordion item is currently active (expanded) by default.<br />
26+
Accepts a number or string corresponding to the <code>{`itemKey`}</code> of the desired accordion item.</p>
27+
<JSXDocs code={`<CAccordion activeItemKey="1">...</CAccordion>`} />
28+
</td>
2529
</tr>
2630
<tr id="caccordion-alwaysOpen">
2731
<td className="text-primary fw-semibold">alwaysOpen<a href="#caccordion-alwaysOpen" aria-label="CAccordion alwaysOpen permalink" className="anchor-link after">#</a></td>
2832
<td><code>{`false`}</code></td>
2933
<td><code>{`boolean`}</code></td>
3034
</tr>
3135
<tr>
32-
<td colSpan="3">When set to <code>{`true`}</code>, multiple accordion items within the React Accordion can be open simultaneously.<br/>This is ideal for scenarios where users need to view multiple sections at once without collapsing others.<br /><JSXDocs code={`<CAccordion alwaysOpen>...</CAccordion>`} /></td>
36+
<td colSpan="3">
37+
<p>When set to <code>{`true`}</code>, multiple accordion items within the React Accordion can be open simultaneously.<br />
38+
This is ideal for scenarios where users need to view multiple sections at once without collapsing others.</p>
39+
<JSXDocs code={`<CAccordion alwaysOpen>...</CAccordion>`} />
40+
</td>
3341
</tr>
3442
<tr id="caccordion-className">
3543
<td className="text-primary fw-semibold">className<a href="#caccordion-className" aria-label="CAccordion className permalink" className="anchor-link after">#</a></td>
3644
<td>undefined</td>
3745
<td><code>{`string`}</code></td>
3846
</tr>
3947
<tr>
40-
<td colSpan="3">Allows you to apply custom CSS classes to the React Accordion for enhanced styling and theming.<br /><JSXDocs code={`<CAccordion className="my-custom-accordion">...</CAccordion>`} /></td>
48+
<td colSpan="3">
49+
<p>Allows you to apply custom CSS classes to the React Accordion for enhanced styling and theming.</p>
50+
<JSXDocs code={`<CAccordion className="my-custom-accordion">...</CAccordion>`} />
51+
</td>
4152
</tr>
4253
<tr id="caccordion-customClassNames">
4354
<td className="text-primary fw-semibold">customClassNames<a href="#caccordion-customClassNames" aria-label="CAccordion customClassNames permalink" className="anchor-link after">#</a></td>
4455
<td>undefined</td>
4556
<td><code>{`Partial\<{ ACCORDION: string; ACCORDION_FLUSH: string; }>`}</code></td>
4657
</tr>
4758
<tr>
48-
<td colSpan="3">Allows overriding or extending the default CSS class names used in the component.<br/><br/>- <code>{`ACCORDION`}</code>: Base class for the accordion component.<br/>- <code>{`ACCORDION_FLUSH`}</code>: Class applied when the <code>{`flush`}</code> prop is set to true, ensuring an edge-to-edge layout.<br/><br/>Use this prop to customize the styles of specific parts of the accordion.<br /><JSXDocs code={`const customClasses = {
59+
<td colSpan="3">
60+
<p>Allows overriding or extending the default CSS class names used in the component.</p>
61+
<ul>
62+
<li><code>{`ACCORDION`}</code>: Base class for the accordion component.</li>
63+
<li><code>{`ACCORDION_FLUSH`}</code>: Class applied when the <code>{`flush`}</code> prop is set to true, ensuring an edge-to-edge layout.</li>
64+
</ul>
65+
<p>Use this prop to customize the styles of specific parts of the accordion.</p>
66+
<JSXDocs code={`const customClasses = {
4967
ACCORDION: 'custom-accordion',
5068
ACCORDION_FLUSH: 'custom-accordion-flush'
5169
}
52-
<CAccordion customClassNames={customClasses}>...</CAccordion>`} /></td>
70+
<CAccordion customClassNames={customClasses}>...</CAccordion>`} />
71+
</td>
5372
</tr>
5473
<tr id="caccordion-flush">
5574
<td className="text-primary fw-semibold">flush<a href="#caccordion-flush" aria-label="CAccordion flush permalink" className="anchor-link after">#</a></td>
5675
<td><code>{`false`}</code></td>
5776
<td><code>{`boolean`}</code></td>
5877
</tr>
5978
<tr>
60-
<td colSpan="3">When <code>{`flush`}</code> is set to <code>{`true`}</code>, the React Accordion renders edge-to-edge with its parent container,<br/>creating a seamless and modern look ideal for minimalist designs.<br /><JSXDocs code={`<CAccordion flush>...</CAccordion>`} /></td>
79+
<td colSpan="3">
80+
<p>When <code>{`flush`}</code> is set to <code>{`true`}</code>, the React Accordion renders edge-to-edge with its parent container,<br />
81+
creating a seamless and modern look ideal for minimalist designs.</p>
82+
<JSXDocs code={`<CAccordion flush>...</CAccordion>`} />
83+
</td>
6184
</tr>
6285
</tbody>
6386
</table>

packages/docs/content/api/CAccordionBody.api.mdx

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,19 +21,31 @@ import CAccordionBody from '@coreui/react/src/components/accordion/CAccordionBod
2121
<td><code>{`string`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">Allows you to apply custom CSS classes to the React Accordion Body for enhanced styling and theming.<br /><JSXDocs code={`<CAccordionBody className="custom-accordion-body">...</CAccordionBody>`} /></td>
24+
<td colSpan="3">
25+
<p>Allows you to apply custom CSS classes to the React Accordion Body for enhanced styling and theming.</p>
26+
<JSXDocs code={`<CAccordionBody className="custom-accordion-body">...</CAccordionBody>`} />
27+
</td>
2528
</tr>
2629
<tr id="caccordionbody-customClassNames">
2730
<td className="text-primary fw-semibold">customClassNames<a href="#caccordionbody-customClassNames" aria-label="CAccordionBody customClassNames permalink" className="anchor-link after">#</a></td>
2831
<td>undefined</td>
2932
<td><code>{`Partial\<{ ACCORDION_COLLAPSE: string; ACCORDION_BODY: string; }>`}</code></td>
3033
</tr>
3134
<tr>
32-
<td colSpan="3">Allows overriding or extending the default CSS class names used in the accordion body component.<br/>Accepts a partial object matching the shape of <code>{`ACCORDION_BODY_CLASS_NAMES`}</code>, which includes:<br/><br/>- <code>{`ACCORDION_COLLAPSE`}</code>: Base class for the collapse container in the accordion body.<br/>- <code>{`ACCORDION_BODY`}</code>: Base class for the main content container inside the accordion body.<br/><br/>Use this prop to customize the styles of specific parts of the accordion body.<br /><JSXDocs code={`const customClasses = {
35+
<td colSpan="3">
36+
<p>Allows overriding or extending the default CSS class names used in the accordion body component.<br />
37+
Accepts a partial object matching the shape of <code>{`ACCORDION_BODY_CLASS_NAMES`}</code>, which includes:</p>
38+
<ul>
39+
<li><code>{`ACCORDION_COLLAPSE`}</code>: Base class for the collapse container in the accordion body.</li>
40+
<li><code>{`ACCORDION_BODY`}</code>: Base class for the main content container inside the accordion body.</li>
41+
</ul>
42+
<p>Use this prop to customize the styles of specific parts of the accordion body.</p>
43+
<JSXDocs code={`const customClasses = {
3344
ACCORDION_COLLAPSE: 'custom-collapse-class',
3445
ACCORDION_BODY: 'custom-body-class',
3546
}
36-
<CAccordionBody customClassNames={customClasses}>...</CAccordionBody>`} /></td>
47+
<CAccordionBody customClassNames={customClasses}>...</CAccordionBody>`} />
48+
</td>
3749
</tr>
3850
</tbody>
3951
</table>

packages/docs/content/api/CAccordionButton.api.mdx

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,18 +21,28 @@ import CAccordionButton from '@coreui/react/src/components/accordion/CAccordionB
2121
<td><code>{`string`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">Styles the clickable element in the accordion header.</td>
24+
<td colSpan="3">
25+
<p>Styles the clickable element in the accordion header.</p>
26+
</td>
2527
</tr>
2628
<tr id="caccordionbutton-customClassNames">
2729
<td className="text-primary fw-semibold">customClassNames<a href="#caccordionbutton-customClassNames" aria-label="CAccordionButton customClassNames permalink" className="anchor-link after">#</a></td>
2830
<td>undefined</td>
2931
<td><code>{`Partial\<{ ACCORDION_BUTTON: string; }>`}</code></td>
3032
</tr>
3133
<tr>
32-
<td colSpan="3">Allows overriding or extending the default CSS class names used in the accordion button component.<br/>Accepts a partial object matching the shape of <code>{`CLASS_NAMES`}</code>, which includes:<br/><br/>- <code>{`ACCORDION_BUTTON`}</code>: Base class for the accordion button.<br/><br/>Use this prop to customize the styles of the accordion button.<br /><JSXDocs code={`const customClasses = {
34+
<td colSpan="3">
35+
<p>Allows overriding or extending the default CSS class names used in the accordion button component.<br />
36+
Accepts a partial object matching the shape of <code>{`CLASS_NAMES`}</code>, which includes:</p>
37+
<ul>
38+
<li><code>{`ACCORDION_BUTTON`}</code>: Base class for the accordion button.</li>
39+
</ul>
40+
<p>Use this prop to customize the styles of the accordion button.</p>
41+
<JSXDocs code={`const customClasses = {
3342
ACCORDION_BUTTON: 'custom-button-class',
3443
}
35-
<CAccordionButton customClassNames={customClasses}>...</CAccordionButton>`} /></td>
44+
<CAccordionButton customClassNames={customClasses}>...</CAccordionButton>`} />
45+
</td>
3646
</tr>
3747
</tbody>
3848
</table>

packages/docs/content/api/CAccordionHeader.api.mdx

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,19 +21,30 @@ import CAccordionHeader from '@coreui/react/src/components/accordion/CAccordionH
2121
<td><code>{`string`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">A string of all className you want applied to the base component.</td>
24+
<td colSpan="3">
25+
<p>A string of all className you want applied to the base component.</p>
26+
</td>
2527
</tr>
2628
<tr id="caccordionheader-customClassNames">
2729
<td className="text-primary fw-semibold">customClassNames<a href="#caccordionheader-customClassNames" aria-label="CAccordionHeader customClassNames permalink" className="anchor-link after">#</a></td>
2830
<td>undefined</td>
2931
<td><code>{`Partial\<{ ACCORDION_HEADER: string; ACCORDION_BUTTON: string; }>`}</code></td>
3032
</tr>
3133
<tr>
32-
<td colSpan="3">Allows overriding or extending the default CSS class names used in the accordion header component.<br/>Accepts a partial object matching the shape of <code>{`ACCORDION_HEADER_CLASS_NAMES`}</code>, which includes:<br/><br/>- <code>{`ACCORDION_HEADER`}</code>: Base class for the accordion header container.<br/>- <code>{`ACCORDION_BUTTON`}</code>: Class applied to the button within the accordion header.<br/><br/>Use this prop to customize the styles of specific parts of the accordion header.<br /><JSXDocs code={`const customClasses = {
34+
<td colSpan="3">
35+
<p>Allows overriding or extending the default CSS class names used in the accordion header component.<br />
36+
Accepts a partial object matching the shape of <code>{`ACCORDION_HEADER_CLASS_NAMES`}</code>, which includes:</p>
37+
<ul>
38+
<li><code>{`ACCORDION_HEADER`}</code>: Base class for the accordion header container.</li>
39+
<li><code>{`ACCORDION_BUTTON`}</code>: Class applied to the button within the accordion header.</li>
40+
</ul>
41+
<p>Use this prop to customize the styles of specific parts of the accordion header.</p>
42+
<JSXDocs code={`const customClasses = {
3343
ACCORDION_HEADER: 'custom-header-class',
3444
ACCORDION_BUTTON: 'custom-button-class',
3545
}
36-
<CAccordionHeader customClassNames={customClasses}>...</CAccordionHeader>`} /></td>
46+
<CAccordionHeader customClassNames={customClasses}>...</CAccordionHeader>`} />
47+
</td>
3748
</tr>
3849
</tbody>
3950
</table>

packages/docs/content/api/CAccordionItem.api.mdx

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,26 +21,38 @@ import CAccordionItem from '@coreui/react/src/components/accordion/CAccordionIte
2121
<td><code>{`string`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">A string of all className you want applied to the base component.</td>
24+
<td colSpan="3">
25+
<p>A string of all className you want applied to the base component.</p>
26+
</td>
2527
</tr>
2628
<tr id="caccordionitem-customClassNames">
2729
<td className="text-primary fw-semibold">customClassNames<a href="#caccordionitem-customClassNames" aria-label="CAccordionItem customClassNames permalink" className="anchor-link after">#</a></td>
2830
<td>undefined</td>
2931
<td><code>{`Partial\<{ ACCORDION_ITEM: string; }>`}</code></td>
3032
</tr>
3133
<tr>
32-
<td colSpan="3">Allows overriding or extending the default CSS class names used in the accordion item component.<br/>Accepts a partial object matching the shape of <code>{`ACCORDION_ITEM_CLASS_NAMES`}</code>, which includes:<br/><br/>- <code>{`ACCORDION_ITEM`}</code>: Base class for an individual accordion item.<br/><br/>Use this prop to customize the styles of specific parts of the accordion item.<br /><JSXDocs code={`const customClasses = {
34+
<td colSpan="3">
35+
<p>Allows overriding or extending the default CSS class names used in the accordion item component.<br />
36+
Accepts a partial object matching the shape of <code>{`ACCORDION_ITEM_CLASS_NAMES`}</code>, which includes:</p>
37+
<ul>
38+
<li><code>{`ACCORDION_ITEM`}</code>: Base class for an individual accordion item.</li>
39+
</ul>
40+
<p>Use this prop to customize the styles of specific parts of the accordion item.</p>
41+
<JSXDocs code={`const customClasses = {
3342
ACCORDION_ITEM: 'custom-item-class',
3443
}
35-
<CAccordionItem customClassNames={customClasses}>...</CAccordionItem>`} /></td>
44+
<CAccordionItem customClassNames={customClasses}>...</CAccordionItem>`} />
45+
</td>
3646
</tr>
3747
<tr id="caccordionitem-itemKey">
3848
<td className="text-primary fw-semibold">itemKey<a href="#caccordionitem-itemKey" aria-label="CAccordionItem itemKey permalink" className="anchor-link after">#</a></td>
3949
<td>undefined</td>
4050
<td><code>{`string`}</code>, <code>{`number`}</code></td>
4151
</tr>
4252
<tr>
43-
<td colSpan="3">Item key.</td>
53+
<td colSpan="3">
54+
<p>Item key.</p>
55+
</td>
4456
</tr>
4557
</tbody>
4658
</table>

packages/docs/content/api/CAlert.api.mdx

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -21,47 +21,59 @@ import CAlert from '@coreui/react/src/components/alert/CAlert'
2121
<td><code>{`string`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">A string of all className you want applied to the component.</td>
24+
<td colSpan="3">
25+
<p>A string of all className you want applied to the component.</p>
26+
</td>
2527
</tr>
2628
<tr id="calert-color">
2729
<td className="text-primary fw-semibold">color<a href="#calert-color" aria-label="CAlert color permalink" className="anchor-link after">#</a></td>
2830
<td><code>{`primary`}</code></td>
2931
<td><code>{`'primary'`}</code>, <code>{`'secondary'`}</code>, <code>{`'success'`}</code>, <code>{`'danger'`}</code>, <code>{`'warning'`}</code>, <code>{`'info'`}</code>, <code>{`'dark'`}</code>, <code>{`'light'`}</code>, <code>{`string`}</code></td>
3032
</tr>
3133
<tr>
32-
<td colSpan="3">Sets the color context of the component to one of CoreUI’s themed colors.</td>
34+
<td colSpan="3">
35+
<p>Sets the color context of the component to one of CoreUI’s themed colors.</p>
36+
</td>
3337
</tr>
3438
<tr id="calert-dismissible">
3539
<td className="text-primary fw-semibold">dismissible<a href="#calert-dismissible" aria-label="CAlert dismissible permalink" className="anchor-link after">#</a></td>
3640
<td>undefined</td>
3741
<td><code>{`boolean`}</code></td>
3842
</tr>
3943
<tr>
40-
<td colSpan="3">Optionally add a close button to alert and allow it to self dismiss.</td>
44+
<td colSpan="3">
45+
<p>Optionally add a close button to alert and allow it to self dismiss.</p>
46+
</td>
4147
</tr>
4248
<tr id="calert-onClose">
4349
<td className="text-primary fw-semibold">onClose<a href="#calert-onClose" aria-label="CAlert onClose permalink" className="anchor-link after">#</a></td>
4450
<td>undefined</td>
4551
<td><code>{`() => void`}</code></td>
4652
</tr>
4753
<tr>
48-
<td colSpan="3">Callback fired when the component requests to be closed.</td>
54+
<td colSpan="3">
55+
<p>Callback fired when the component requests to be closed.</p>
56+
</td>
4957
</tr>
5058
<tr id="calert-variant">
5159
<td className="text-primary fw-semibold">variant<a href="#calert-variant" aria-label="CAlert variant permalink" className="anchor-link after">#</a></td>
5260
<td>undefined</td>
5361
<td><code>{`string`}</code></td>
5462
</tr>
5563
<tr>
56-
<td colSpan="3">Set the alert variant to a solid.</td>
64+
<td colSpan="3">
65+
<p>Set the alert variant to a solid.</p>
66+
</td>
5767
</tr>
5868
<tr id="calert-visible">
5969
<td className="text-primary fw-semibold">visible<a href="#calert-visible" aria-label="CAlert visible permalink" className="anchor-link after">#</a></td>
6070
<td><code>{`true`}</code></td>
6171
<td><code>{`boolean`}</code></td>
6272
</tr>
6373
<tr>
64-
<td colSpan="3">Toggle the visibility of component.</td>
74+
<td colSpan="3">
75+
<p>Toggle the visibility of component.</p>
76+
</td>
6577
</tr>
6678
</tbody>
6779
</table>

packages/docs/content/api/CAlertHeading.api.mdx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,19 @@ import CAlertHeading from '@coreui/react/src/components/alert/CAlertHeading'
2121
<td><code>{`(ElementType & "symbol")`}</code>, <code>{`(ElementType & "object")`}</code>, <code>{`(ElementType & "h4")`}</code>, <code>{`(ElementType & "slot")`}</code>, <code>{`(ElementType & "style")`}</code>, <code>{`... 174 more ...`}</code>, <code>{`(ElementType & FunctionComponent\<...>)`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">Component used for the root node. Either a string to use a HTML element or a component.</td>
24+
<td colSpan="3">
25+
<p>Component used for the root node. Either a string to use a HTML element or a component.</p>
26+
</td>
2527
</tr>
2628
<tr id="calertheading-className">
2729
<td className="text-primary fw-semibold">className<a href="#calertheading-className" aria-label="CAlertHeading className permalink" className="anchor-link after">#</a></td>
2830
<td>undefined</td>
2931
<td><code>{`string`}</code></td>
3032
</tr>
3133
<tr>
32-
<td colSpan="3">A string of all className you want applied to the base component.</td>
34+
<td colSpan="3">
35+
<p>A string of all className you want applied to the base component.</p>
36+
</td>
3337
</tr>
3438
</tbody>
3539
</table>

packages/docs/content/api/CAlertLink.api.mdx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,9 @@ import CAlertLink from '@coreui/react/src/components/alert/CAlertLink'
2121
<td><code>{`string`}</code></td>
2222
</tr>
2323
<tr>
24-
<td colSpan="3">A string of all className you want applied to the base component.</td>
24+
<td colSpan="3">
25+
<p>A string of all className you want applied to the base component.</p>
26+
</td>
2527
</tr>
2628
</tbody>
2729
</table>

0 commit comments

Comments
 (0)