Skip to content

Commit b1d90f2

Browse files
authored
fix(examples): updating example microcopy (#6196)
* fix(examples): updating example microcopy * updated remaining microcopy * updated date picker example for build * revert DatePicker date formatting changes
1 parent a2b793e commit b1d90f2

File tree

43 files changed

+389
-374
lines changed

Some content is hidden

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

43 files changed

+389
-374
lines changed

packages/react-code-editor/src/components/CodeEditor/examples/CodeEditor.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ class BasicCodeEditor extends React.Component {
9191
name="toggle-read-only"
9292
/>
9393
<Checkbox
94-
label="Display Minimap"
94+
label="Minimap"
9595
isChecked={isMinimapVisible}
9696
onChange={this.toggleMinimap}
9797
aria-label="display minimap checkbox"

packages/react-core/src/components/AboutModal/examples/AboutModal.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ class SimpleAboutModal extends React.Component {
3333
return (
3434
<React.Fragment>
3535
<Button variant="primary" onClick={this.handleModalToggle}>
36-
Show About Modal
36+
Show about modal
3737
</Button>
3838
<AboutModal
3939
isOpen={isModalOpen}
@@ -93,7 +93,7 @@ class SimpleAboutModal extends React.Component {
9393
return (
9494
<React.Fragment>
9595
<Button variant="primary" onClick={this.handleModalToggle}>
96-
Show About Modal
96+
Show about modal
9797
</Button>
9898
<AboutModal
9999
isOpen={isModalOpen}
@@ -152,7 +152,7 @@ class ContentRichAboutModal extends React.Component {
152152
return (
153153
<React.Fragment>
154154
<Button variant="primary" onClick={this.handleModalToggle}>
155-
Show About Modal
155+
Show about modal
156156
</Button>
157157
<AboutModal
158158
isOpen={isModalOpen}
@@ -219,7 +219,7 @@ class SimpleAboutModal extends React.Component {
219219
return (
220220
<React.Fragment>
221221
<Button variant="primary" onClick={this.handleModalToggle}>
222-
Show About Modal
222+
Show about modal
223223
</Button>
224224
<AboutModal
225225
isOpen={isModalOpen}

packages/react-core/src/components/Accordion/examples/Accordion.md

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ class SimpleAccordion extends React.Component {
4141
isExpanded={this.state.expanded === 'ex-toggle1'}
4242
id="ex-toggle1"
4343
>
44-
Item One
44+
Item one
4545
</AccordionToggle>
4646
<AccordionContent id="ex-expand1" isHidden={this.state.expanded !== 'ex-toggle1'}>
4747
<p>
@@ -59,7 +59,7 @@ class SimpleAccordion extends React.Component {
5959
isExpanded={this.state.expanded === 'ex-toggle2'}
6060
id="ex-toggle2"
6161
>
62-
Item Two
62+
Item two
6363
</AccordionToggle>
6464
<AccordionContent id="ex-expand2" isHidden={this.state.expanded !== 'ex-toggle2'}>
6565
<p>
@@ -77,7 +77,7 @@ class SimpleAccordion extends React.Component {
7777
isExpanded={this.state.expanded === 'ex-toggle3'}
7878
id="ex-toggle3"
7979
>
80-
Item Three
80+
Item three
8181
</AccordionToggle>
8282
<AccordionContent id="ex-expand3" isHidden={this.state.expanded !== 'ex-toggle3'}>
8383
<p>Morbi vitae urna quis nunc convallis hendrerit. Aliquam congue orci quis ultricies tempus.</p>
@@ -92,7 +92,7 @@ class SimpleAccordion extends React.Component {
9292
isExpanded={this.state.expanded === 'ex-toggle4'}
9393
id="ex-toggle4"
9494
>
95-
Item Four
95+
Item four
9696
</AccordionToggle>
9797
<AccordionContent id="ex-expand4" isHidden={this.state.expanded !== 'ex-toggle4'}>
9898
<p>
@@ -115,7 +115,7 @@ class SimpleAccordion extends React.Component {
115115
isExpanded={this.state.expanded === 'ex-toggle5'}
116116
id="ex-toggle5"
117117
>
118-
Item Five
118+
Item five
119119
</AccordionToggle>
120120
<AccordionContent id="ex-expand5" isHidden={this.state.expanded !== 'ex-toggle5'}>
121121
<p>Vivamus finibus dictum ex id ultrices. Mauris dictum neque a iaculis blandit.</p>
@@ -159,7 +159,7 @@ class SimpleAccordion extends React.Component {
159159
isExpanded={this.state.expanded === 'ex-toggle1'}
160160
id="ex-toggle1"
161161
>
162-
Item One
162+
Item one
163163
</AccordionToggle>
164164
<AccordionContent id="ex-expand1" isHidden={this.state.expanded !== 'ex-toggle1'}>
165165
<p>
@@ -177,7 +177,7 @@ class SimpleAccordion extends React.Component {
177177
isExpanded={this.state.expanded === 'ex-toggle2'}
178178
id="ex-toggle2"
179179
>
180-
Item Two
180+
Item two
181181
</AccordionToggle>
182182
<AccordionContent id="ex-expand2" isHidden={this.state.expanded !== 'ex-toggle2'}>
183183
<p>
@@ -195,7 +195,7 @@ class SimpleAccordion extends React.Component {
195195
isExpanded={this.state.expanded === 'ex-toggle3'}
196196
id="ex-toggle3"
197197
>
198-
Item Three
198+
Item three
199199
</AccordionToggle>
200200
<AccordionContent id="ex-expand3" isHidden={this.state.expanded !== 'ex-toggle3'}>
201201
<p>Morbi vitae urna quis nunc convallis hendrerit. Aliquam congue orci quis ultricies tempus.</p>
@@ -210,7 +210,7 @@ class SimpleAccordion extends React.Component {
210210
isExpanded={this.state.expanded === 'ex-toggle4'}
211211
id="ex-toggle4"
212212
>
213-
Item Four
213+
Item four
214214
</AccordionToggle>
215215
<AccordionContent id="ex-expand4" isHidden={this.state.expanded !== 'ex-toggle4'}>
216216
<p>
@@ -233,7 +233,7 @@ class SimpleAccordion extends React.Component {
233233
isExpanded={this.state.expanded === 'ex-toggle5'}
234234
id="ex-toggle5"
235235
>
236-
Item Five
236+
Item five
237237
</AccordionToggle>
238238
<AccordionContent id="ex-expand5" isHidden={this.state.expanded !== 'ex-toggle5'}>
239239
<p>Vivamus finibus dictum ex id ultrices. Mauris dictum neque a iaculis blandit.</p>
@@ -276,7 +276,7 @@ class FixedAccordion extends React.Component {
276276
isExpanded={this.state.expanded.includes('ex2-toggle1')}
277277
id="ex2-toggle1"
278278
>
279-
Item One
279+
Item one
280280
</AccordionToggle>
281281
<AccordionContent id="ex2-expand1" isHidden={!this.state.expanded.includes('ex2-toggle1')} isFixed>
282282
<p>
@@ -291,7 +291,7 @@ class FixedAccordion extends React.Component {
291291
isExpanded={this.state.expanded.includes('ex2-toggle2')}
292292
id="ex2-toggle2"
293293
>
294-
Item Two
294+
Item two
295295
</AccordionToggle>
296296
<AccordionContent id="ex2-expand2" isHidden={!this.state.expanded.includes('ex2-toggle2')} isFixed>
297297
<p>
@@ -306,7 +306,7 @@ class FixedAccordion extends React.Component {
306306
isExpanded={this.state.expanded.includes('ex2-toggle3')}
307307
id="ex2-toggle3"
308308
>
309-
Item Three
309+
Item three
310310
</AccordionToggle>
311311
<AccordionContent id="ex2-expand3" isHidden={!this.state.expanded.includes('ex2-toggle3')} isFixed>
312312
<p>Morbi vitae urna quis nunc convallis hendrerit. Aliquam congue orci quis ultricies tempus.</p>
@@ -318,7 +318,7 @@ class FixedAccordion extends React.Component {
318318
isExpanded={this.state.expanded.includes('ex2-toggle4')}
319319
id="ex2-toggle4"
320320
>
321-
Item Four
321+
Item four
322322
</AccordionToggle>
323323
<AccordionContent id="ex2-expand4" isHidden={!this.state.expanded.includes('ex2-toggle4')} isFixed>
324324
<p>
@@ -338,7 +338,7 @@ class FixedAccordion extends React.Component {
338338
isExpanded={this.state.expanded.includes('ex2-toggle5')}
339339
id="ex2-toggle5"
340340
>
341-
Item Five
341+
Item five
342342
</AccordionToggle>
343343
<AccordionContent id="ex2-expand5" isHidden={!this.state.expanded.includes('ex2-toggle5')} isFixed>
344344
<p>Vivamus finibus dictum ex id ultrices. Mauris dictum neque a iaculis blandit.</p>
@@ -393,7 +393,7 @@ class BorderedAccordion extends React.Component {
393393
isExpanded={expanded === 'ex-toggle1'}
394394
id="ex-toggle1"
395395
>
396-
Item One
396+
Item one
397397
</AccordionToggle>
398398
<AccordionContent id="ex-expand1" isHidden={expanded !== 'ex-toggle1'}>
399399
<p>
@@ -411,7 +411,7 @@ class BorderedAccordion extends React.Component {
411411
isExpanded={expanded === 'ex-toggle2'}
412412
id="ex-toggle2"
413413
>
414-
Item Two
414+
Item two
415415
</AccordionToggle>
416416
<AccordionContent id="ex-expand2" isHidden={expanded !== 'ex-toggle2'}>
417417
<p>
@@ -429,7 +429,7 @@ class BorderedAccordion extends React.Component {
429429
isExpanded={expanded === 'ex-toggle3'}
430430
id="ex-toggle3"
431431
>
432-
Item Three
432+
Item three
433433
</AccordionToggle>
434434
<AccordionContent id="ex-expand3" isHidden={expanded !== 'ex-toggle3'}>
435435
<p>Morbi vitae urna quis nunc convallis hendrerit. Aliquam congue orci quis ultricies tempus.</p>
@@ -444,7 +444,7 @@ class BorderedAccordion extends React.Component {
444444
isExpanded={expanded === 'ex-toggle4'}
445445
id="ex-toggle4"
446446
>
447-
Item Four
447+
Item four
448448
</AccordionToggle>
449449
<AccordionContent id="ex-expand4" isHidden={expanded !== 'ex-toggle4'} isCustomContent>
450450
<AccordionExpandedContentBody>
@@ -471,7 +471,7 @@ class BorderedAccordion extends React.Component {
471471
isExpanded={expanded === 'ex-toggle5'}
472472
id="ex-toggle5"
473473
>
474-
Item Five
474+
Item five
475475
</AccordionToggle>
476476
<AccordionContent id="ex-expand5" isHidden={expanded !== 'ex-toggle5'}>
477477
<p>Vivamus finibus dictum ex id ultrices. Mauris dictum neque a iaculis blandit.</p>

packages/react-core/src/components/Alert/examples/Alert.md

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -171,8 +171,7 @@ class StaticLiveRegionAlert extends React.Component {
171171
title="Default live region configuration"
172172
actionClose={<AlertActionCloseButton onClose={() => alert('Clicked the close button')} />}
173173
>
174-
This Alert uses the recommended <code>isLiveRegion</code> prop to automatically sets ARIA attributes and CSS
175-
classes.
174+
This alert uses the recommended <code>isLiveRegion</code> prop to automatically set ARIA attributes and CSS classes.
176175
</Alert>
177176
<Alert
178177
aria-live="assertive"
@@ -212,21 +211,21 @@ class DynamicLiveRegionAlert extends React.Component {
212211
const getUniqueId = () => new Date().getTime();
213212
const addSuccessAlert = () => {
214213
addAlert({
215-
title: 'Single Success Alert',
214+
title: 'Single success alert',
216215
variant: 'success',
217216
key: getUniqueId()
218217
});
219218
};
220219
const addInfoAlert = () => {
221220
addAlert({
222-
title: 'Single Info Alert',
221+
title: 'Single info alert',
223222
variant: 'info',
224223
key: getUniqueId()
225224
});
226225
};
227226
const addDangerAlert = () => {
228227
addAlert({
229-
title: 'Single Danger Alert',
228+
title: 'Single danger alert',
230229
variant: 'danger',
231230
key: getUniqueId()
232231
});
@@ -236,13 +235,13 @@ class DynamicLiveRegionAlert extends React.Component {
236235
<React.Fragment>
237236
<InputGroup style={{ marginBottom: '16px' }}>
238237
<button onClick={addSuccessAlert} type="button" className={btnClasses}>
239-
Add Single Success Alert
238+
Add single success alert
240239
</button>
241240
<button onClick={addInfoAlert} type="button" className={btnClasses}>
242-
Add Single Info Alert
241+
Add single info alert
243242
</button>
244243
<button onClick={addDangerAlert} type="button" className={btnClasses}>
245-
Add Single Danger Alert
244+
Add single danger alert
246245
</button>
247246
</InputGroup>
248247
<AlertGroup isLiveRegion aria-live="polite" aria-relevant="additions text" aria-atomic="false">
@@ -288,7 +287,7 @@ class AsyncLiveRegionAlert extends React.Component {
288287
const startAsyncAlerts = () => {
289288
let timerValue = setInterval(() => {
290289
addAlert({
291-
title: `This is a async alert number ${this.state.alerts.length + 1}`,
290+
title: `Async alert number ${this.state.alerts.length + 1}`,
292291
variant: 'info',
293292
key: getUniqueId()
294293
});
@@ -300,10 +299,10 @@ class AsyncLiveRegionAlert extends React.Component {
300299
<React.Fragment>
301300
<InputGroup style={{ marginBottom: '16px' }}>
302301
<button onClick={startAsyncAlerts} type="button" className={btnClasses}>
303-
Start Async Info Alerts
302+
Start async info alerts
304303
</button>
305304
<button onClick={this.stopAsyncAlerts} type="button" className={btnClasses}>
306-
Stop Async Info Alerts
305+
Stop async info alerts
307306
</button>
308307
</InputGroup>
309308
<AlertGroup isLiveRegion>

packages/react-core/src/components/AlertGroup/examples/AlertGroup.md

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@ class StaticAlertGroup extends React.Component {
1717
return (
1818
<React.Fragment>
1919
<AlertGroup>
20-
<Alert title="Success Alert" variant="success" isInline />
21-
<Alert title="Info Alert" variant="info" isInline/>
20+
<Alert title="Success alert" variant="success" isInline />
21+
<Alert title="Info alert" variant="info" isInline/>
2222
</AlertGroup>
2323
</React.Fragment>
2424
);
@@ -47,15 +47,15 @@ class ToastAlertGroup extends React.Component {
4747
render() {
4848
const btnClasses = ['pf-c-button', 'pf-m-secondary'].join(' ');
4949
const getUniqueId = () => (new Date().getTime());
50-
const addSuccessAlert = () => { this.addAlert('Toast Success Alert', 'success', getUniqueId()) };
51-
const addDangerAlert = () => { this.addAlert('Toast Danger Alert', 'danger', getUniqueId()) };
52-
const addInfoAlert = () => { this.addAlert('Toast Info Alert', 'info', getUniqueId()) };
50+
const addSuccessAlert = () => { this.addAlert('Toast success alert', 'success', getUniqueId()) };
51+
const addDangerAlert = () => { this.addAlert('Toast danger alert', 'danger', getUniqueId()) };
52+
const addInfoAlert = () => { this.addAlert('Toast info alert', 'info', getUniqueId()) };
5353
return (
5454
<React.Fragment>
5555
<InputGroup style={{ marginBottom: '16px' }}>
56-
<button onClick={addSuccessAlert} type="button" className={btnClasses}>Add Toast Success Alert</button>
57-
<button onClick={addDangerAlert} type="button" className={btnClasses}>Add Toast Danger Alert</button>
58-
<button onClick={addInfoAlert} type="button" className={btnClasses}>Add Toast Info Alert</button>
56+
<button onClick={addSuccessAlert} type="button" className={btnClasses}>Add toast success alert</button>
57+
<button onClick={addDangerAlert} type="button" className={btnClasses}>Add toast danger alert</button>
58+
<button onClick={addInfoAlert} type="button" className={btnClasses}>Add toast info alert</button>
5959
</InputGroup>
6060
<AlertGroup isToast isLiveRegion>
6161
{this.state.alerts.map(({key, variant, title}) => (
@@ -96,18 +96,18 @@ class SingularAdditiveAlertGroup extends React.Component {
9696
};
9797
const btnClasses = ['pf-c-button', 'pf-m-secondary'].join(' ');
9898
const getUniqueId = () => (new Date().getTime());
99-
const addSuccessAlert = () => { addAlert('Single Success Alert', 'success', getUniqueId()) };
100-
const addDangerAlert = () => { addAlert('Single Danger Alert', 'danger', getUniqueId()) };
101-
const addInfoAlert = () => { addAlert('Single Info Alert', 'info', getUniqueId()) };
99+
const addSuccessAlert = () => { addAlert('Single success alert', 'success', getUniqueId()) };
100+
const addDangerAlert = () => { addAlert('Single danger alert', 'danger', getUniqueId()) };
101+
const addInfoAlert = () => { addAlert('Single info alert', 'info', getUniqueId()) };
102102
this.removeAlert = key => {
103103
this.setState({ alerts: [...this.state.alerts.filter(el => el.key !== key)] });
104104
};
105105
return (
106106
<React.Fragment>
107107
<InputGroup style={{ marginBottom: '16px' }}>
108-
<button onClick={addSuccessAlert} type="button" className={btnClasses}>Add Single Success Alert</button>
109-
<button onClick={addDangerAlert} type="button" className={btnClasses}>Add Single Danger Alert</button>
110-
<button onClick={addInfoAlert} type="button" className={btnClasses}>Add Single Info Alert</button>
108+
<button onClick={addSuccessAlert} type="button" className={btnClasses}>Add single success alert</button>
109+
<button onClick={addDangerAlert} type="button" className={btnClasses}>Add single danger alert</button>
110+
<button onClick={addInfoAlert} type="button" className={btnClasses}>Add single info alert</button>
111111
</InputGroup>
112112
<AlertGroup isLiveRegion>
113113
{this.state.alerts.map(({ title, variant, key }) => (
@@ -153,9 +153,9 @@ class MultipleAdditiveAlertGroup extends React.Component {
153153
const btnClasses = ['pf-c-button', 'pf-m-secondary'].join(' ');
154154
const addAlertCollection = () => {
155155
addAlerts([
156-
{ title: 'First Alert Notification.', variant: 'success', key: getUniqueId() },
157-
{ title: 'Second Alert Notification.', variant: 'warning', key: getUniqueId() },
158-
{ title: 'Third Alert Notification.', variant: 'danger', key: getUniqueId() }
156+
{ title: 'First alert notification.', variant: 'success', key: getUniqueId() },
157+
{ title: 'Second alert notification.', variant: 'warning', key: getUniqueId() },
158+
{ title: 'Third alert notification.', variant: 'danger', key: getUniqueId() }
159159
])
160160
};
161161
this.removeAlert = key => {
@@ -164,7 +164,7 @@ class MultipleAdditiveAlertGroup extends React.Component {
164164
return (
165165
<React.Fragment>
166166
<InputGroup style={{ marginBottom: '16px' }}>
167-
<button onClick={addAlertCollection} type="button" className={btnClasses}>Add Alert Collection</button>
167+
<button onClick={addAlertCollection} type="button" className={btnClasses}>Add alert collection</button>
168168
</InputGroup>
169169
<AlertGroup isToast isLiveRegion>
170170
{this.state.alerts.map(({ title, variant, key, action }) => (
@@ -213,7 +213,7 @@ class AsyncAdditiveAlertGroup extends React.Component {
213213
let timerValue = setInterval(() => {
214214
addAlerts([
215215
{
216-
title: `Async Notification ${this.state.alerts.length + 1} was added to the queue.`,
216+
title: `Async notification ${this.state.alerts.length + 1} was added to the queue.`,
217217
variant: 'danger',
218218
key: getUniqueId()
219219
}
@@ -224,8 +224,8 @@ class AsyncAdditiveAlertGroup extends React.Component {
224224
return (
225225
<React.Fragment>
226226
<InputGroup style={{ marginBottom: '16px' }}>
227-
<button onClick={startAsyncAlerts} type="button" className={btnClasses}>Start Async Alerts</button>
228-
<button onClick={this.stopAsyncAlerts} type="button" className={btnClasses}>Stop Async Alerts</button>
227+
<button onClick={startAsyncAlerts} type="button" className={btnClasses}>Start async alerts</button>
228+
<button onClick={this.stopAsyncAlerts} type="button" className={btnClasses}>Stop async alerts</button>
229229
</InputGroup>
230230
<AlertGroup isToast isLiveRegion aria-live="assertive">
231231
{this.state.alerts.map(({ title, variant, key }) => (

0 commit comments

Comments
 (0)