-
Notifications
You must be signed in to change notification settings - Fork 2.7k
/
ControlsPage.tsx
60 lines (55 loc) · 2.28 KB
/
ControlsPage.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
import * as React from 'react';
import { css, Link } from 'office-ui-fabric-react';
import { Page, PlatformContext, INavPage, IPageSectionProps, IPageProps } from '@uifabric/example-app-base/lib/index2';
import * as PageStyles from '@uifabric/example-app-base/lib/components/Page/Page.module.scss';
import { SiteDefinition } from '../../../SiteDefinition/index';
import { getSubTitle } from '../../../utilities/index';
import { ControlsPageProps } from './ControlsPage.doc';
import { Platforms } from '../../../interfaces/Platforms';
const ControlsPageBase: React.StatelessComponent<IPageProps<Platforms>> = props => {
const { platform } = props;
return (
<Page
{...props}
title="Controls"
platform={platform}
subTitle={getSubTitle(platform)}
otherSections={_otherSections(platform) as IPageSectionProps[]}
showSideRail={false}
{...ControlsPageProps[platform]}
/>
);
};
function _otherSections(platform: Platforms): IPageSectionProps<Platforms>[] {
const controls = SiteDefinition.pages.filter(page => page.title === 'Controls')[0].platforms;
const platformControls: INavPage[] = controls[platform];
if (platformControls) {
let sections: IPageSectionProps<Platforms>[] = platformControls
.filter(page => !page.isHiddenFromMainNav && page.isCategory)
.map(
category =>
category.pages && {
sectionName: category.title,
content: (
<ul className={PageStyles.uListFlex}>
{category.pages.map(page => (
<li key={page.url} className={css(PageStyles.uThird)}>
<Link href={page.url}>{page.title}</Link>
</li>
))}
</ul>
)
}
);
if (platform === 'web') {
sections.push({
sectionName: 'Need a control Fabric React doesn’t have?',
content: require('!raw-loader!@uifabric/fabric-website/src/pages/Overviews/ControlsPage/docs/web/ControlsRequest.md') as string
});
}
return sections;
}
}
export const ControlsPage: React.StatelessComponent<IPageProps<Platforms>> = (props: IPageProps<Platforms>) => (
<PlatformContext.Consumer>{(platform: Platforms) => <ControlsPageBase platform={platform} {...props} />}</PlatformContext.Consumer>
);