Skip to content

Commit 576c401

Browse files
committed
Add carbon files to documentation
1 parent 342902c commit 576c401

File tree

7 files changed

+410
-11
lines changed

7 files changed

+410
-11
lines changed
Lines changed: 142 additions & 0 deletions
Loading

packages/react-renderer-demo/src/components/component-example.js

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import { pf3Code, pf3WizardCode, pf3Html, pf3Dependencies } from '../stackblitz-
2525
import { blueprintCode, blueprintWizardCode, blueprintHtml, blueprintDependencies } from '../stackblitz-templates/blueprint-templates';
2626
import { suirCode, suirWizardCode, suirHtml, suirDependencies } from '../stackblitz-templates/suir-template';
2727
import { antCode, antWizardCode, antHtml, antDependencies } from '../stackblitz-templates/ant-templates';
28+
import { carbonCode, carbonWizardCode, carbonHtml, carbonDependencies } from '../stackblitz-templates/carbon-templates';
2829
import avalableMappers from '../helpers/available-mappers';
2930

3031
const project = {
@@ -125,6 +126,10 @@ const blitzFiles = {
125126
ant: {
126127
'index.html': antHtml,
127128
'index.js': antCode
129+
},
130+
carbon: {
131+
'index.html': carbonHtml,
132+
'index.js': carbonCode
128133
}
129134
};
130135

@@ -134,7 +139,8 @@ const blitzWizards = {
134139
pf3: pf3WizardCode,
135140
blueprint: blueprintWizardCode,
136141
suir: suirWizardCode,
137-
ant: antWizardCode
142+
ant: antWizardCode,
143+
carbon: carbonWizardCode
138144
};
139145

140146
const blitzDependencies = {
@@ -143,7 +149,8 @@ const blitzDependencies = {
143149
pf3: pf3Dependencies,
144150
blueprint: blueprintDependencies,
145151
suir: suirDependencies,
146-
ant: antDependencies
152+
ant: antDependencies,
153+
carbon: carbonDependencies
147154
};
148155

149156
const mapperTab = {
@@ -152,7 +159,8 @@ const mapperTab = {
152159
pf3: 2,
153160
blueprint: 3,
154161
suir: 4,
155-
ant: 5
162+
ant: 5,
163+
carbon: 6
156164
};
157165

158166
const ComponentExample = ({ variants, schema, activeMapper, component }) => {

packages/react-renderer-demo/src/components/landing-page/landing-page-cards.js

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -245,7 +245,7 @@ const LandingPageCards = () => {
245245
Available mappers
246246
</Typography>
247247
<Grid container direction="row" justify="space-evenly">
248-
<Grid item xs={12} md={4} xl={2}>
248+
<Grid item xs={6} md={4} xl={2}>
249249
<Typography variant="h6" className={classes.textBottom}>
250250
MaterialUI
251251
</Typography>
@@ -255,7 +255,7 @@ const LandingPageCards = () => {
255255
</a>
256256
</RouterLink>
257257
</Grid>
258-
<Grid item xs={12} md={4} xl={2}>
258+
<Grid item xs={6} md={4} xl={2}>
259259
<Typography variant="h6" className={classes.textBottom}>
260260
PatternFly 4
261261
</Typography>
@@ -265,7 +265,7 @@ const LandingPageCards = () => {
265265
</a>
266266
</RouterLink>
267267
</Grid>
268-
<Grid item xs={12} md={4} xl={2}>
268+
<Grid item xs={6} md={4} xl={2}>
269269
<Typography variant="h6" className={classes.textBottom}>
270270
PatternFly 3
271271
</Typography>
@@ -275,7 +275,7 @@ const LandingPageCards = () => {
275275
</a>
276276
</RouterLink>
277277
</Grid>
278-
<Grid item xs={12} md={4} xl={2}>
278+
<Grid item xs={6} md={3} xl={2}>
279279
<Typography variant="h6" className={classes.textBottom}>
280280
BlueprintJS
281281
</Typography>
@@ -285,7 +285,7 @@ const LandingPageCards = () => {
285285
</a>
286286
</RouterLink>
287287
</Grid>
288-
<Grid item xs={12} md={4} xl={2}>
288+
<Grid item xs={6} md={3} xl={2}>
289289
<Typography variant="h6" className={classes.textBottom}>
290290
Semantic UI
291291
</Typography>
@@ -295,7 +295,7 @@ const LandingPageCards = () => {
295295
</a>
296296
</RouterLink>
297297
</Grid>
298-
<Grid item xs={12} md={4} xl={2}>
298+
<Grid item xs={6} md={3} xl={2}>
299299
<Typography variant="h6" className={classes.textBottom}>
300300
Ant Design
301301
</Typography>
@@ -305,6 +305,16 @@ const LandingPageCards = () => {
305305
</a>
306306
</RouterLink>
307307
</Grid>
308+
<Grid item xs={12} md={3} xl={12}>
309+
<Typography variant="h6" className={classes.textBottom}>
310+
Carbon Design System
311+
</Typography>
312+
<RouterLink href="/mappers/carbon-component-mapper">
313+
<a href="/mappers/carbon-component-mapper">
314+
<img className={classes.logo} alt="ant logo" src="/carbon-logo.svg" />
315+
</a>
316+
</RouterLink>
317+
</Grid>
308318
<Grid item xs={12} md={8}>
309319
<Typography variant="body2" gutterBottom className={classes.mappersText}>
310320
This list represents a set of provided mappers. Each mapper brings all basic form components from its design system. You can

packages/react-renderer-demo/src/helpers/available-mappers.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@ const avalableMappers = [
44
{ title: 'PF3', mapper: 'pf3' },
55
{ title: 'BJS', mapper: 'blueprint' },
66
{ title: 'SUIR', mapper: 'suir' },
7-
{ title: 'ANT', mapper: 'ant' }
7+
{ title: 'ANT', mapper: 'ant' },
8+
{ title: 'Carbon', mapper: 'carbon' }
89
];
910

1011
export default avalableMappers;

packages/react-renderer-demo/src/helpers/generic-mui-component.js

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,8 @@ export const docsLinks = {
1111
pf3: 'https://patternfly-react-pf3.surge.sh/?path=/story/*',
1212
blueprint: 'https://blueprintjs.com/docs/',
1313
suir: 'https://react.semantic-ui.com/',
14-
ant: 'https://ant.design/components/'
14+
ant: 'https://ant.design/components/',
15+
carbon: 'https://react.carbondesignsystem.com/?path=/story/'
1516
};
1617

1718
const mapperLinks = {
@@ -62,6 +63,23 @@ const mapperLinks = {
6263
[componentTypes.BUTTON]: 'button',
6364
[componentTypes.DUAL_LIST_SELECT]: 'transfer',
6465
[componentTypes.SLIDER]: 'slider'
66+
},
67+
carbon: {
68+
[componentTypes.TEXT_FIELD]: 'textinput',
69+
[componentTypes.CHECKBOX]: 'checkbox',
70+
[componentTypes.SUB_FORM]: '',
71+
[componentTypes.RADIO]: 'radiobutton',
72+
[componentTypes.TABS]: 'tabs',
73+
[componentTypes.DATE_PICKER]: 'datepicker',
74+
[componentTypes.TIME_PICKER]: 'timepicker',
75+
[componentTypes.WIZARD]: 'progressindicator',
76+
[componentTypes.SWITCH]: 'toggle',
77+
[componentTypes.TEXTAREA]: 'textarea',
78+
[componentTypes.SELECT]: 'select',
79+
[componentTypes.PLAIN_TEXT]: '',
80+
[componentTypes.BUTTON]: 'button',
81+
[componentTypes.DUAL_LIST_SELECT]: 'transfer',
82+
[componentTypes.SLIDER]: 'slider'
6583
}
6684
};
6785

0 commit comments

Comments
 (0)