Skip to content

Commit 843de4b

Browse files
authored
Merge pull request #83 from aafvstam/master
Update packages and updated web pages to look a little better.
2 parents 6b06cfb + 19b150f commit 843de4b

File tree

8 files changed

+733
-398
lines changed

8 files changed

+733
-398
lines changed

Samples/Office.ASP.NETCoreReactAddins/excel-js/ClientApp/package-lock.json

Lines changed: 325 additions & 163 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Samples/Office.ASP.NETCoreReactAddins/excel-js/ClientApp/package.json

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,33 +7,33 @@
77
"core-js": "^3.6.5",
88
"es6-promise": "^4.2.8",
99
"jquery": "^3.5.1",
10-
"office-ui-fabric-react": "^7.113.2",
10+
"office-ui-fabric-react": "^7.121.8",
1111
"react": "^16.13.1",
1212
"react-bootstrap": "^1.0.1",
1313
"react-dom": "^16.13.1",
1414
"react-router-bootstrap": "^0.25.0",
1515
"react-router-dom": "^5.2.0",
1616
"react-scripts": "^3.4.1",
17-
"reactstrap": "^8.4.1",
17+
"reactstrap": "^8.5.1",
1818
"rimraf": "^3.0.2"
1919
},
2020
"devDependencies": {
2121
"@types/core-js": "^2.5.3",
22-
"@types/es6-collections": "^0.5.31",
23-
"@types/office-js": "^1.0.99",
22+
"@types/es6-collections": "^0.5.32",
23+
"@types/office-js": "^1.0.116",
2424
"@types/office-runtime": "^1.0.14",
25-
"@types/react": "^16.9.35",
25+
"@types/react": "^16.9.41",
2626
"@types/react-dom": "^16.9.8",
2727
"@types/react-hot-loader": "^4.1.1",
2828
"ajv": "^6.12.2",
2929
"babel-eslint": "10.1.0",
3030
"cross-env": "^7.0.2",
3131
"eslint": "^6.8.0",
3232
"eslint-config-react-app": "^5.2.1",
33-
"eslint-plugin-flowtype": "^4.7.0",
34-
"eslint-plugin-import": "^2.20.2",
35-
"eslint-plugin-jsx-a11y": "^6.2.3",
36-
"eslint-plugin-react": "^7.20.0",
33+
"eslint-plugin-flowtype": "^5.2.0",
34+
"eslint-plugin-import": "^2.22.0",
35+
"eslint-plugin-jsx-a11y": "^6.3.1",
36+
"eslint-plugin-react": "^7.20.3",
3737
"react-hot-loader": "^4.12.21"
3838
},
3939
"eslintConfig": {

Samples/Office.ASP.NETCoreReactAddins/excel-js/ClientApp/src/components/App.js

Lines changed: 75 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -9,84 +9,93 @@
99
import * as React from 'react';
1010
import { Button, ButtonType } from 'office-ui-fabric-react';
1111
import Header from './Header';
12-
import HeroList, { HeroListItem } from './HeroList';
12+
import HeroList from './HeroList';
1313
import Progress from './Progress';
1414

1515
const logo = require('../assets/logo-filled.png');
1616

1717
export default class App extends React.Component {
18-
constructor(props, context) {
19-
super(props, context);
20-
this.state = {
21-
listItems: []
22-
};
23-
}
18+
constructor(props, context) {
19+
super(props, context);
20+
this.state = {
21+
listItems: [],
22+
};
23+
}
2424

25-
componentDidMount() {
26-
this.setState({
27-
listItems: [
28-
{
29-
icon: 'Ribbon',
30-
primaryText: 'Achieve more with Office integration'
31-
},
32-
{
33-
icon: 'Unlock',
34-
primaryText: 'Unlock features and functionality'
35-
},
36-
{
37-
icon: 'Design',
38-
primaryText: 'Create and visualize like a pro'
39-
}
40-
]
41-
});
42-
}
25+
componentDidMount() {
26+
this.setState({
27+
listItems: [
28+
{
29+
icon: 'Ribbon',
30+
primaryText: 'Achieve more with Office integration',
31+
},
32+
{
33+
icon: 'Unlock',
34+
primaryText: 'Unlock features and functionality',
35+
},
36+
{
37+
icon: 'Design',
38+
primaryText: 'Create and visualize like a pro',
39+
},
40+
],
41+
});
42+
}
4343

44-
click = async () => {
45-
try {
46-
await Excel.run(async context => {
47-
/**
48-
* Insert your Excel code here
49-
*/
50-
const range = context.workbook.getSelectedRange();
44+
click = async () => {
45+
try {
46+
await Excel.run(async (context) => {
47+
/**
48+
* Insert your Excel code here
49+
*/
50+
const range = context.workbook.getSelectedRange();
5151

52-
// Read the range address
53-
range.load("address");
52+
// Read the range address
53+
range.load('address');
5454

55-
// Update the fill color
56-
range.format.fill.color = "yellow";
55+
// Update the fill color
56+
range.format.fill.color = 'yellow';
5757

58-
await context.sync();
59-
console.log(`The range address was ${range.address}.`);
60-
});
61-
} catch (error) {
62-
console.error(error);
63-
}
58+
await context.sync();
59+
console.log(`The range address was ${range.address}.`);
60+
});
61+
} catch (error) {
62+
console.error(error);
6463
}
64+
};
6565

66-
render() {
67-
const {
68-
title,
69-
isOfficeInitialized,
70-
} = this.props;
66+
render() {
67+
const { title, isOfficeInitialized } = this.props;
7168

72-
if (!isOfficeInitialized) {
73-
return (
74-
<Progress
75-
title={title}
76-
logo={logo}
77-
message='Please sideload your addin to see app body.'
78-
/>
79-
);
80-
}
81-
82-
return (
83-
<div className='ms-welcome'>
84-
<Header logo={logo} title={this.props.title} message='Welcome' />
85-
<HeroList message='Discover what Office .NET Core 3.1 Add-ins can do for you today!' items={this.state.listItems}>
86-
<p className='ms-font-l'>Modify the source files, then click <b>Run</b>.</p>
87-
<Button className='ms-welcome__action' buttonType={ButtonType.hero} iconProps={{ iconName: 'ChevronRight' }} onClick={this.click}>Run</Button>
88-
</HeroList>
89-
</div>
90-
);
69+
if (!isOfficeInitialized) {
70+
return (
71+
<Progress
72+
title={title}
73+
logo={logo}
74+
message="Please sideload your addin to see app body."
75+
/>
76+
);
9177
}
78+
79+
return (
80+
<div className="ms-welcome">
81+
<Header logo={logo} title={this.props.title} message="Welcome JavaScript" />
82+
<HeroList
83+
message="Discover what Office .NET Core 3.1 Add-ins can do for you today!"
84+
items={this.state.listItems}
85+
>
86+
<p className="ms-font-l">
87+
Modify the source files, then click <b>Run</b>.
88+
</p>
89+
<Button
90+
className="ms-welcome__action"
91+
buttonType={ButtonType.hero}
92+
iconProps={{ iconName: 'ChevronRight' }}
93+
onClick={this.click}
94+
>
95+
Run
96+
</Button>
97+
</HeroList>
98+
</div>
99+
);
100+
}
92101
}

Samples/Office.ASP.NETCoreReactAddins/excel-js/ClientApp/src/components/Progress.js

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,22 +4,24 @@
44
*/
55

66
import * as React from 'react';
7+
import Header from './Header';
8+
import HeroList from './HeroList';
79
import { Spinner, SpinnerType } from 'office-ui-fabric-react';
810

911
export default class Progress extends React.Component {
10-
render() {
11-
const {
12-
logo,
13-
message,
14-
title,
15-
} = this.props;
12+
render() {
13+
const { logo, message, title } = this.props;
1614

17-
return (
18-
<section className='ms-welcome__progress ms-u-fadeIn500'>
19-
<img width='90' height='90' src={logo} alt={title} title={title} />
20-
<h1 className='ms-fontSize-su ms-fontWeight-light ms-fontColor-neutralPrimary'>{title}</h1>
15+
return (
16+
<section className="ms-welcome__progress ms-u-fadeIn500">
17+
<Header logo={logo} title={title} message="Welcome JavaScript" />
18+
<HeroList
19+
message="Discover what Office .NET Core 3.1 Add-ins can do for you today!"
20+
items={[]}
21+
>
2122
<Spinner type={SpinnerType.large} label={message} />
22-
</section>
23-
);
24-
}
23+
</HeroList>
24+
</section>
25+
);
26+
}
2527
}

0 commit comments

Comments
 (0)