Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 2bf2466

Browse files
committed
docs: update API documentation
1 parent c0d5b2c commit 2bf2466

File tree

8 files changed

+66
-14
lines changed

8 files changed

+66
-14
lines changed

‎packages/docs/content/api/CDropdown.api.mdx

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,13 @@ import CDropdown from '@coreui/react/src/components/dropdown/CDropdown'
5050
</tr>
5151
<tr>
5252
<td colSpan="3">
53-
<p>Configures automatic closing behavior for the React Dropdown: - <code>{`true`}</code> - Close on clicks inside or outside of the React Dropdown Menu. - <code>{`false`}</code> - Disable auto-close; manually call <code>{`hide`}</code> or <code>{`toggle`}</code> (also not closed by <code>{`Escape`}</code>). - <code>{`'inside'`}</code> - Close only when clicking inside the React Dropdown Menu. - <code>{`'outside'`}</code> - Close only when clicking outside the React Dropdown Menu.</p>
53+
<p>Configures automatic closing behavior for the React Dropdown:</p>
54+
<ul>
55+
<li><code>{`true`}</code> - Close on clicks inside or outside of the React Dropdown Menu.</li>
56+
<li><code>{`false`}</code> - Disable auto-close; manually call <code>{`hide`}</code> or <code>{`toggle`}</code> (also not closed by <code>{`Escape`}</code>).</li>
57+
<li><code>{`'inside'`}</code> - Close only when clicking inside the React Dropdown Menu.</li>
58+
<li><code>{`'outside'`}</code> - Close only when clicking outside the React Dropdown Menu.</li>
59+
</ul>
5460
<JSXDocs code={`// Close only when user clicks outside of the menu
5561
<CDropdown autoClose="outside" />`} />
5662
</td>
@@ -201,7 +207,11 @@ const myContainer = document.getElementById('my-container')
201207
</tr>
202208
<tr>
203209
<td colSpan="3">
204-
<p>Controls the visibility of the React Dropdown Menu: - <code>{`true`}</code> - Visible - <code>{`false`}</code> - Hidden</p>
210+
<p>Controls the visibility of the React Dropdown Menu:</p>
211+
<ul>
212+
<li><code>{`true`}</code> - Visible</li>
213+
<li><code>{`false`}</code> - Hidden</li>
214+
</ul>
205215
<JSXDocs code={`// Programmatically manage the dropdown visibility
206216
const [visible, setVisible] = useState(false)
207217

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -152,7 +152,7 @@ import CDropdownToggle from '@coreui/react/src/components/dropdown/CDropdownTogg
152152
</tr>
153153
<tr>
154154
<td colSpan="3">
155-
<p>Sets which event handlers you’d like provided to your toggle prop. You can specify one trigger or an array of them.</p>
155+
<p>Sets which event handlers you'd like provided to your toggle prop. You can specify one trigger or an array of them.</p>
156156
</td>
157157
</tr>
158158
<tr id="cdropdowntoggle-variant">

‎packages/docs/content/api/CFocusTrap.api.mdx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,12 @@ import CFocusTrap from '@coreui/react/src/components/focus-trap/CFocusTrap'
4343
<tr>
4444
<td colSpan="3">
4545
<p>Single React element that renders a DOM node and forwards refs properly. The focus trap will be applied to this element and all its focusable descendants.<br />
46-
Requirements: - Must be a single ReactElement (not an array or fragment) - Must forward the ref to a DOM element - Should contain focusable elements for proper trap behavior</p>
46+
Requirements:</p>
47+
<ul>
48+
<li>Must be a single ReactElement (not an array or fragment)</li>
49+
<li>Must forward the ref to a DOM element</li>
50+
<li>Should contain focusable elements for proper trap behavior</li>
51+
</ul>
4752
</td>
4853
</tr>
4954
<tr id="cfocustrap-focus-first-element">

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

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,7 +122,11 @@ import CFormSelect from '@coreui/react/src/components/form/CFormSelect'
122122
</tr>
123123
<tr>
124124
<td colSpan="3">
125-
<p>Options list of the select component. Available keys: <code>{`label`}</code>, <code>{`value`}</code>, <code>{`disabled`}</code>. Examples: - <code>{`options={[{ value: 'js', label: 'JavaScript' }, { value: 'html', label: 'HTML', disabled: true }]}`}</code> - <code>{`options={['js', 'html']}`}</code></p>
125+
<p>Options list of the select component. Available keys: <code>{`label`}</code>, <code>{`value`}</code>, <code>{`disabled`}</code>. Examples:</p>
126+
<ul>
127+
<li><code>{`options={[{ value: 'js', label: 'JavaScript' }, { value: 'html', label: 'HTML', disabled: true }]}`}</code></li>
128+
<li><code>{`options={['js', 'html']}`}</code></li>
129+
</ul>
126130
</td>
127131
</tr>
128132
<tr id="cformselect-size">

‎packages/docs/content/api/CPopover.api.mdx

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,12 @@ import CPopover from '@coreui/react/src/components/popover/CPopover'
4242
</tr>
4343
<tr>
4444
<td colSpan="3">
45-
<p>Defines the container element to which the React Popover is appended. Accepts: - A DOM element (<code>{`HTMLElement`}</code> or <code>{`DocumentFragment`}</code>) - A function that returns a single element - <code>{`null`}</code> (defaults to <code>{`document.body`}</code>)</p>
45+
<p>Defines the container element to which the React Popover is appended. Accepts:</p>
46+
<ul>
47+
<li>A DOM element (<code>{`HTMLElement`}</code> or <code>{`DocumentFragment`}</code>)</li>
48+
<li>A function that returns a single element</li>
49+
<li><code>{`null`}</code> (defaults to <code>{`document.body`}</code>)</li>
50+
</ul>
4651
<JSXDocs code={`<CPopover container={document.getElementById('my-container')}>...</CPopover>`} />
4752
</td>
4853
</tr>
@@ -63,7 +68,11 @@ import CPopover from '@coreui/react/src/components/popover/CPopover'
6368
</tr>
6469
<tr>
6570
<td colSpan="3">
66-
<p>Delay (in milliseconds) before showing or hiding the React Popover. - If a number is provided, that delay applies to both "show" and "hide". - If an object is provided, use separate values for "show" and "hide".</p>
71+
<p>Delay (in milliseconds) before showing or hiding the React Popover.</p>
72+
<ul>
73+
<li>If a number is provided, that delay applies to both "show" and "hide".</li>
74+
<li>If an object is provided, use separate values for "show" and "hide".</li>
75+
</ul>
6776
<JSXDocs code={`// Delays 300ms on both show and hide
6877
<CPopover delay={300}>...</CPopover>
6978
@@ -178,7 +187,11 @@ import CPopover from '@coreui/react/src/components/popover/CPopover'
178187
</tr>
179188
<tr>
180189
<td colSpan="3">
181-
<p>Controls the visibility of the React Popover. - <code>{`true`}</code> shows the popover. - <code>{`false`}</code> hides the popover.</p>
190+
<p>Controls the visibility of the React Popover.</p>
191+
<ul>
192+
<li><code>{`true`}</code> shows the popover.</li>
193+
<li><code>{`false`}</code> hides the popover.</li>
194+
</ul>
182195
</td>
183196
</tr>
184197
</tbody>

‎packages/docs/content/api/CTable.api.mdx

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -102,8 +102,14 @@ import CTable from '@coreui/react/src/components/table/CTable'
102102
</tr>
103103
<tr>
104104
<td colSpan="3">
105-
<p>Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '<em>props')
106-
In columns prop each array item represents one column. Item might be specified in two ways: String: each item define column name equal to item value. Object: item is object with following keys available as column configuration: - key (required)(String) - define column name equal to item key. - label (String) - define visible label of column. If not defined, label will be generated automatically based on column name, by converting kebab-case and snake</em>case to individual words and capitalization of each word. - _props (Object) - adds classes to all cels in column, ex. <code>{`_props: { scope: 'col', className: 'custom-class' }`}</code>, - _style (Object) - adds styles to the column header (useful for defining widths)</p>
105+
<p>Prop for table columns configuration. If prop is not defined, table will display columns based on the first item keys, omitting keys that begins with underscore (e.g. '_props')<br />
106+
In columns prop each array item represents one column. Item might be specified in two ways: String: each item define column name equal to item value. Object: item is object with following keys available as column configuration:</p>
107+
<ul>
108+
<li>key (required)(String) - define column name equal to item key.</li>
109+
<li>label (String) - define visible label of column. If not defined, label will be generated automatically based on column name, by converting kebab-case and snake_case to individual words and capitalization of each word.</li>
110+
<li>_props (Object) - adds classes to all cels in column, ex. <code>{`_props: { scope: 'col', className: 'custom-class' }`}</code>,</li>
111+
<li>_style (Object) - adds styles to the column header (useful for defining widths)</li>
112+
</ul>
107113
</td>
108114
</tr>
109115
<tr id="ctable-footer">

‎packages/docs/content/api/CTabs.api.mdx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,8 @@ import CTabs from '@coreui/react/src/components/tabs/CTabs'
6060
<td colSpan="3">
6161
<p>Callback fired when the active tab changes.</p>
6262
<ul>
63-
<li>In controlled mode (<code>{`activeItemKey`}</code> provided), you must update <code>{`activeItemKey`}</code> yourself based on the value received. - In uncontrolled mode, this callback is called after internal state updates.</li>
63+
<li>In controlled mode (<code>{`activeItemKey`}</code> provided), you must update <code>{`activeItemKey`}</code> yourself based on the value received.</li>
64+
<li>In uncontrolled mode, this callback is called after internal state updates.</li>
6465
</ul>
6566
<JSXDocs code={`<CTabs onChange={(key) => console.log('Tab changed to', key)} />`} />
6667
</td>

‎packages/docs/content/api/CTooltip.api.mdx

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,12 @@ import CTooltip from '@coreui/react/src/components/tooltip/CTooltip'
4242
</tr>
4343
<tr>
4444
<td colSpan="3">
45-
<p>Appends the React Tooltip to a specific element instead of the default <code>{`document.body`}</code>. You may pass: - A DOM element (<code>{`HTMLElement`}</code> or <code>{`DocumentFragment`}</code>) - A function that returns a single element - <code>{`null`}</code></p>
45+
<p>Appends the React Tooltip to a specific element instead of the default <code>{`document.body`}</code>. You may pass:</p>
46+
<ul>
47+
<li>A DOM element (<code>{`HTMLElement`}</code> or <code>{`DocumentFragment`}</code>)</li>
48+
<li>A function that returns a single element</li>
49+
<li><code>{`null`}</code></li>
50+
</ul>
4651
<JSXDocs code={`<CTooltip container={document.getElementById('my-container')}>...</CTooltip>`} />
4752
</td>
4853
</tr>
@@ -63,7 +68,11 @@ import CTooltip from '@coreui/react/src/components/tooltip/CTooltip'
6368
</tr>
6469
<tr>
6570
<td colSpan="3">
66-
<p>The delay (in milliseconds) before showing or hiding the React Tooltip. - If provided as a number, the delay is applied to both "show" and "hide". - If provided as an object, it should have distinct "show" and "hide" values.</p>
71+
<p>The delay (in milliseconds) before showing or hiding the React Tooltip.</p>
72+
<ul>
73+
<li>If provided as a number, the delay is applied to both "show" and "hide".</li>
74+
<li>If provided as an object, it should have distinct "show" and "hide" values.</li>
75+
</ul>
6776
<JSXDocs code={`// Delays 300ms on both show and hide
6877
<CTooltip delay={300}>...</CTooltip>
6978
@@ -168,7 +177,11 @@ import CTooltip from '@coreui/react/src/components/tooltip/CTooltip'
168177
</tr>
169178
<tr>
170179
<td colSpan="3">
171-
<p>Controls the visibility of the React Tooltip. - <code>{`true`}</code> to show the tooltip. - <code>{`false`}</code> to hide the tooltip.</p>
180+
<p>Controls the visibility of the React Tooltip.</p>
181+
<ul>
182+
<li><code>{`true`}</code> to show the tooltip.</li>
183+
<li><code>{`false`}</code> to hide the tooltip.</li>
184+
</ul>
172185
</td>
173186
</tr>
174187
</tbody>

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /