8000 docs: update API documentation · asmhasansarker/coreui-react@dedf2a1 · GitHub
[go: up one dir, main page]

Skip to content

Commit dedf2a1

Browse files
committed
docs: update API documentation
1 parent 792f86c commit dedf2a1

10 files changed

+69
-7
lines changed

packages/docs/content/4.1/api/CDropdownToggle.api.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,5 +19,5 @@ import CDropdownToggle from '@coreui/react/src/components/dropdown/CDropdownTogg
1919
| **shape** | Select the shape of the component. | `'rounded'` \| `'rounded-top'` \| `'rounded-end'` \| `'rounded-bottom'` \| `'rounded-start'` \| `'rounded-circle'` \| `'rounded-pill'` \| `'rounded-0'` \| `'rounded-1'` \| `'rounded-2'` \| `'rounded-3'` \| `string` | - |
2020
| **size** | Size the component small or large. | `'sm'` \| `'lg'` | - |
2121
| **split** | Similarly, create split button dropdowns with virtually the same markup as single button dropdowns, but with the addition of `.dropdown-toggle-split` className for proper spacing around the dropdown caret. | `boolean` | - |
22-
| **trigger** | Sets which event handlers you’d like provided to your toggle prop. You can specify one trigger or an array of them. | `'hover'` \| `'focus'` \| `'click'` \| `'click-init'` | click |
22+
| **trigger** | Sets which event handlers you’d like provided to your toggle prop. You can specify one trigger or an array of them. | `'hover'` \| `'focus'` \| `'click'` | click |
2323
| **variant** | Set the button variant to an outlined button or a ghost button. | `'outline'` \| `'ghost'` | - |

packages/docs/content/4.1/api/CFormCheck.api.mdx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,16 @@ import CFormCheck from '@coreui/react/src/components/form/CFormCheck'
99
| --- | --- | --- | --- |
1010
| **button** | Create button-like checkboxes and radio buttons. | `ButtonObject` | - |
1111
| **className** | A string of all className you want applied to the component. | `string` | - |
12+
| **feedback** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
13+
| **feedbackInvalid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
14+
| **feedbackValid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
15+
| **floatingLabel** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
1216
| **hitArea** | Sets hit area to the full area of the component. | `'full'` | - |
1317
| **id** | The id global attribute defines an identifier (ID) that must be unique in the whole document. | `string` | - |
1418
| **indeterminate** | Input Checkbox indeterminate Property. | `boolean` | - |
1519
| **inline** | Group checkboxes or radios on the same horizontal row by adding. | `boolean` | - |
1620
| **invalid** | Set component validation state to invalid. | `boolean` | - |
1721
| **label** | The element represents a caption for a component. | `ReactNode` | - |
22+
| **tooltipFeedback** <br/><div class="badge bg-primary">4.2.0+</div> | Display validation feedback in a styled tooltip. | `boolean` | - |
1823
| **type** | Specifies the type of component. | `'checkbox'` \| `'radio'` | checkbox |
1924
| **valid** | Set component validation state to valid. | `boolean` | - |
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
2+
```jsx
3+
import { CFormControlValidation } from '@coreui/react'
4+
// or
5+
import CFormControlValidation from '@coreui/react/src/components/form/CFormControlValidation'
6+
```
7+
8+
| Property | Description | Type | Default |
9+
| --- | --- | --- | --- |
10+
| **feedback** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
11+
| **feedbackInvalid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
12+
| **feedbackValid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
13+
| **floatingLabel** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
14+
| **invalid** | Set component validation state to invalid. | `boolean` | - |
15+
| **tooltipFeedback** <br/><div class="badge bg-primary">4.2.0+</div> | Display validation feedback in a styled tooltip. | `boolean` | - |
16+
| **valid** | Set component validation state to valid. | `boolean` | - |
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
2+
```jsx
3+
import { CFormControlWrapper } from '@coreui/react'
4+
// or
5+
import CFormControlWrapper from '@coreui/react/src/components/form/CFormControlWrapper'
6+
```
7+
8+
| Property | Description | Type | Default |
9+
| --- | --- | --- | --- |
10+
| **feedback** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
11+
| **feedbackInvalid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
12+
| **feedbackValid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
13+
| **floatingLabel** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
14+
| **invalid** | Set component validation state to invalid. | `boolean` | - |
15+
| **label** <br/><div class="badge bg-primary">4.2.0+</div> | Add a caption for a component. | `ReactNode` | - |
16+
| **text** <br/><div class="badge bg-primary">4.2.0+</div> | Add helper text to the component. | `ReactNode` | - |
17+
| **tooltipFeedback** <br/><div class="badge bg-primary">4.2.0+</div> | Display validation feedback in a styled tooltip. | `boolean` | - |
18+
| **valid** | Set component validation state to valid. | `boolean` | - |

packages/docs/content/4.1/api/CFormInput.api.mdx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,18 @@ import CFormInput from '@coreui/react/src/components/form/CFormInput'
99
| --- | --- | --- | --- |
1010
| **className** | A string of all className you want applied to the component. | `string` | - |
1111
| **disabled** | Toggle the disabled state for the component. | `boolean` | - |
12+
| **feedback** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
13+
| **feedbackInvalid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
14+
| **feedbackValid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
15+
| **floatingLabel** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
1216
| **invalid** | Set component validation state to invalid. | `boolean` | - |
17+
| **label** <br/><div class="badge bg-primary">4.2.0+</div> | Add a caption for a component. | `ReactNode` | - |
1318
| **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler<HTMLInputElement>` | - |
1419
| **pl 10000 ainText** | Render the component styled as plain text. Removes the default form field styling and preserve the correct margin and padding. Recommend to use only along side `readonly` | `boolean` | - |
1520
| **readOnly** | Toggle the readonly state for the component. | `boolean` | - |
1621
| **size** | Size the component small or large. | `'sm'` \| `'lg'` | - |
22+
| **text** <br/><div class="badge bg-primary">4.2.0+</div> | Add helper text to the component. | `ReactNode` | - |
23+
| **tooltipFeedback** <br/><div class="badge bg-primary">4.2.0+</div> | Display validation feedback in a styled tooltip. | `boolean` | - |
1724
| **type** | Specifies the type of component. | `string` | text |
1825
| **valid** | Set component validation state to valid. | `boolean` | - |
19-
| **value** | The `value` attribute of component.<br/>@controllable onChange | `string` \| `number` \| `string[]` | - |
26+
| **value** | The `value` attribute of component. | `string` \| `number` \| `string[]` | - |

packages/docs/content/4.1/api/CFormRange.api.mdx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,10 @@ import CFormRange from '@coreui/react/src/components/form/CFormRange'
99
| --- | --- | --- | --- |
1010
| **className** | A string of all className you want applied to the component. | `string` | - |
1111
| **disabled** | Toggle the disabled state for the component. | `boolean` | - |
12+
| **label** <br/><div class="badge bg-primary">4.2.0+</div> | Add a caption for a component. | `ReactNode` | - |
1213
| **max** | Specifies the maximum value for the component. | `number` | - |
1314
| **min** | Specifies the minimum value for the component. | `number` | - |
1415
| **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler<HTMLInputElement>` | - |
1516
| **readOnly** | Toggle the readonly state for the component. | `boolean` | - |
1617
| **steps** | Specifies the interval between legal numbers in the component. | `number` | - |
17-
| **value** | The `value` attribute of component.<br/>@controllable onChange | `string` \| `number` \| `string[]` | - |
18+
| **value** | The `value` attribute of component. | `string` \| `number` \| `string[]` | - |

packages/docs/content/4.1/api/CFormSelect.api.mdx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,17 @@ import CFormSelect from '@coreui/react/src/components/form/CFormSelect'
88
| Property | Description | Type | Default |
99
| --- | --- | --- | --- |
1010
| **className** | A string of all className you want applied to the component. | `string` | - |
11+
| **feedback** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
12+
| **feedbackInvalid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
13+
| **feedbackValid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
14+
| **floatingLabel** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
1115
| **htmlSize** | Specifies the number of visible options in a drop-down list. | `number` | - |
1216
| **invalid** | Set component validation state to invalid. | `boolean` | - |
17+
| **label** <br/><div class="badge bg-primary">4.2.0+</div> | Add a caption for a component. | `ReactNode` | - |
1318
| **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler<HTMLSelectElement>` | - |
1419
| **options** | Options list of the select component. Available keys: `label`, `value`, `disabled`.<br/>Examples:<br/>- `options={[{ value: 'js', label: 'JavaScript' }, { value: 'html', label: 'HTML', disabled: true }]}`<br/>- `options={['js', 'html']}` | `Option[]` \| `string[]` | - |
1520
| **size** | Size the component small or large. | `'sm'` \| `'lg'` | - |
21+
| **text** <br/><div class="badge bg-primary">4.2.0+</div> | Add helper text to the component. | `ReactNode` | - |
22+
| **tooltipFeedback** <br/><div class="badge bg-primary">4.2.0+</div> | Display validation feedback in a styled tooltip. | `boolean` | - |
1623
| **valid** | Set component validation state to valid. | `boolean` | - |
17-
| **value** | The `value` attribute of component.<br/>@controllable onChange | `string` \| `number` \| `string[]` | - |
24+
| **value** | The `value` attribute of component. | `string` \| `number` \| `string[]` | - |

packages/docs/content/4.1/api/CFormTextarea.api.mdx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,16 @@ import CFormTextarea from '@coreui/react/src/components/form/CFormTextarea'
99
| --- | --- | --- | --- |
1010
| **className** | A string of all className you want applied to the component. | `string` | - |
1111
| **disabled** | Toggle the disabled state for the component. | `boolean` | - |
12+
| **feedback** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
13+
| **feedbackInvalid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable feedback. | `ReactNode` | - |
14+
| **feedbackValid** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable invalid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
15+
| **floatingLabel** <br/><div class="badge bg-primary">4.2.0+</div> | Provide valuable, actionable valid feedback when using standard HTML form validation which applied two CSS pseudo-classes, `:invalid` and `:valid`. | `ReactNode` | - |
1216
| **invalid** | Set component validation state to invalid. | `boolean` | - |
17+
| **label** <br/><div class="badge bg-primary">4.2.0+</div> | Add a caption for a component. | `ReactNode` | - |
1318
| **onChange** | Method called immediately after the `value` prop changes. | `ChangeEventHandler<HTMLTextAreaElement>` | - |
1419
| **plainText** | Render the component styled as plain text. Removes the default form field styling and preserve the correct margin and padding. Recommend to use only along side `readonly`. | `boolean` | - |
1520
| **readOnly** | Toggle the readonly state for the component. | `boolean` | - |
21+
| **text** <br/><div class="badge bg-primary">4.2.0+</div> | Add helper text to the component. | `ReactNode` | - |
22+
| **tooltipFeedback** <br/><div class="badge bg-primary">4.2.0+</div> | Display validation feedback in a styled tooltip. | `boolean` | - |
1623
| **valid** | Set component validation state to valid. | `boolean` | - |
17-
| **value** | The `value` attribute of component.<br/>@controllable onChange | `string` \| `number` \| `string[]` | - |
24+
| **value** | The `value` attribute of component. | `string` \| `number` \| `string[]` | - |

packages/docs/content/4.1/api/CIcon.api.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ import CIcon from '@coreui/icons-react/src/CIcon'
88
| Property | Description | Type | Default |
99
| --- | --- | --- | --- |
1010
| **className** | A string of all className you want applied to the component. | `string` | - |
11-
| **content** | Use `icon={...}` instead of<br/>@deprecated since version 3.0 | `string` \| `string[]` | - |
11+
| **content** <br/><div class="badge bg-warning">Deprecated 3.0+</div> | Use `icon={...}` instead of | `string` \| `string[]` | - |
1212
| **customClassName** | Use for replacing default CIcon component classes. Prop is overriding the 'size' prop. | `string` \| `object` \| `string[]` | - |
1313
| **height** | The height attribute defines the vertical length of an icon. | `number` | - |
1414
| **icon** | Name of the icon placed in React object or SVG content. | `string` \| `string[]` | - |
15-
| **name** | Use `icon="..."` instead of<br/>@deprecated since version 3.0 | `string` | - |
15+
| **name** <br/><div class="badge bg-warning">Deprecated 3.0+</div> | Use `icon="..."` instead of | `string` | - |
1616
| **size** | Size of the icon. Available sizes: 'sm', 'lg', 'xl', 'xxl', '3xl...9xl', 'custom', 'custom-size'. | `'custom'` \| `'custom-size'` \| `'sm'` \| `'lg'` \| `'xl'` \| `'xxl'` \| `'3xl'` \| `'4xl'` \| `'5xl'` \| `'6xl'` \| `'7xl'` \| `'8xl'` \| `'9xl'` | - |
1717
| **title** | Title tag content. | `string` | - |
1818
| **use** | If defined component will be rendered using 'use' tag. | `string` | - |

packages/docs/content/4.1/api/CModal.api.mdx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,4 +19,5 @@ import CModal from '@coreui/react/src/components/modal/CModal'
1919
| **scrollable** | Create a scrollable modal that allows scrolling the modal body. | `boolean` | - |
2020
| **size** | Size the component small, large, or extra large. | `'sm'` \| `'lg'` \| `'xl'` | - |
2121
| **transition** | Remove animation to create modal that simply appear rather than fade in to view. | `boolean` | true |
22+
| **unmountOnClose** | By default the component is unmounted after close animation, if you want to keep the component mounted set this property to false. | `boolean` | true |
2223
| **visible** | Toggle the visibility of modal component. | `boolean` | - |

0 commit comments

Comments
 (0)
0