Fixing merge conflict in script editor web part
This commit is contained in:
parent
ffdbbfd3e5
commit
e7db64e016
|
@ -2283,15 +2283,6 @@
|
|||
"@types/q": "0.0.32"
|
||||
}
|
||||
},
|
||||
"@types/prop-types": {
|
||||
"version": "15.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.5.tgz",
|
||||
"integrity": "sha512-mOrlCEdwX3seT3n0AXNt4KNPAZZxcsABUHwBgFXOt+nvFUXkxCAO6UBJHPrDxWEa2KDMil86355fjo8jbZ+K0Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/react": "15.6.6"
|
||||
}
|
||||
},
|
||||
"@types/q": {
|
||||
"version": "0.0.32",
|
||||
"resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz",
|
||||
|
@ -2462,33 +2453,17 @@
|
|||
}
|
||||
},
|
||||
"@uifabric/merge-styles": {
|
||||
<<<<<<< .mine
|
||||
"version": "5.17.1",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.17.1.tgz",
|
||||
"integrity": "sha512-4/EtO6Ns7kNtKxC+6InShwVQeNQEDT5H8Ex7m/i4OrT9i7csje4YwBQPkkpm31qJwEZEyD7bbAwyLezI63sLhg==",
|
||||
"dev": true,
|
||||
=======
|
||||
"version": "5.17.1",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.17.1.tgz",
|
||||
"integrity": "sha512-4/EtO6Ns7kNtKxC+6InShwVQeNQEDT5H8Ex7m/i4OrT9i7csje4YwBQPkkpm31qJwEZEyD7bbAwyLezI63sLhg==",
|
||||
|
||||
>>>>>>> .theirs
|
||||
"requires": {
|
||||
"tslib": "1.8.1"
|
||||
}
|
||||
},
|
||||
"@uifabric/styling": {
|
||||
<<<<<<< .mine
|
||||
"version": "5.31.2",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.31.2.tgz",
|
||||
"integrity": "sha512-G7grRENxdB4NcUEtQmSisRDnIeQHQmAfcpIe5AWmVQxnB/e8U/jT+SzYqK6V12SnLf4ufN5nepZkdOjgbtuA1Q==",
|
||||
"dev": true,
|
||||
=======
|
||||
"version": "5.31.2",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.31.2.tgz",
|
||||
"integrity": "sha512-G7grRENxdB4NcUEtQmSisRDnIeQHQmAfcpIe5AWmVQxnB/e8U/jT+SzYqK6V12SnLf4ufN5nepZkdOjgbtuA1Q==",
|
||||
|
||||
>>>>>>> .theirs
|
||||
"requires": {
|
||||
"@microsoft/load-themed-styles": "1.7.53",
|
||||
"@uifabric/merge-styles": "5.17.1",
|
||||
|
@ -2497,17 +2472,9 @@
|
|||
}
|
||||
},
|
||||
"@uifabric/utilities": {
|
||||
<<<<<<< .mine
|
||||
"version": "5.34.1",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.34.1.tgz",
|
||||
"integrity": "sha512-xUZ+KlCxmA9PCEOtutfeyYnPmySkEVA/ak3fb8Uj54684GlbrnlqrfNEencVG5YgQDcNEaztTwxW3I7jSCrYJQ==",
|
||||
"dev": true,
|
||||
=======
|
||||
"version": "5.34.1",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.34.1.tgz",
|
||||
"integrity": "sha512-xUZ+KlCxmA9PCEOtutfeyYnPmySkEVA/ak3fb8Uj54684GlbrnlqrfNEencVG5YgQDcNEaztTwxW3I7jSCrYJQ==",
|
||||
|
||||
>>>>>>> .theirs
|
||||
"requires": {
|
||||
"@uifabric/merge-styles": "5.17.1",
|
||||
"prop-types": "15.6.0",
|
||||
|
@ -13681,29 +13648,15 @@
|
|||
"resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.118.3.tgz",
|
||||
"integrity": "sha512-MYRah+boLs75UXkTjh1gYORitjtt7ixrfl5BFtFWkX8AGSau2ulZT4XQ0gOyKumvPfCqLzlNKXv//84tptUm0g==",
|
||||
"requires": {
|
||||
<<<<<<< .mine
|
||||
"@microsoft/load-themed-styles": "1.7.74",
|
||||
"@uifabric/icons": "5.8.0",
|
||||
"@uifabric/merge-styles": "5.17.1",
|
||||
"@uifabric/styling": "5.31.2",
|
||||
"@uifabric/utilities": "5.34.1",
|
||||
=======
|
||||
"@microsoft/load-themed-styles": "1.7.53",
|
||||
"@uifabric/icons": "5.8.0",
|
||||
"@uifabric/merge-styles": "5.17.1",
|
||||
"@uifabric/styling": "5.31.2",
|
||||
"@uifabric/utilities": "5.34.1",
|
||||
>>>>>>> .theirs
|
||||
"prop-types": "15.6.0",
|
||||
"tslib": "1.8.1"
|
||||
},
|
||||
"dependencies": {
|
||||
<<<<<<< .mine
|
||||
"@microsoft/load-themed-styles": {
|
||||
"version": "1.7.74",
|
||||
"resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.74.tgz",
|
||||
"integrity": "sha512-zBCIhD3ETnNpPQuLRVFjCUoiLZp7H4BVXR9GDnFwkCP+Q0tBlGya1Q0Gw4iG5ngBUE8+cs3r3zZGDYvezJqJUg=="
|
||||
},
|
||||
"@uifabric/icons": {
|
||||
"version": "5.8.0",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.8.0.tgz",
|
||||
|
@ -13712,82 +13665,6 @@
|
|||
"@uifabric/styling": "5.31.2",
|
||||
"tslib": "1.8.1"
|
||||
}
|
||||
},
|
||||
"@uifabric/merge-styles": {
|
||||
"version": "5.17.1",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.17.1.tgz",
|
||||
"integrity": "sha512-4/EtO6Ns7kNtKxC+6InShwVQeNQEDT5H8Ex7m/i4OrT9i7csje4YwBQPkkpm31qJwEZEyD7bbAwyLezI63sLhg==",
|
||||
"requires": {
|
||||
"tslib": "1.8.1"
|
||||
}
|
||||
},
|
||||
"@uifabric/styling": {
|
||||
"version": "5.31.2",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.31.2.tgz",
|
||||
"integrity": "sha512-G7grRENxdB4NcUEtQmSisRDnIeQHQmAfcpIe5AWmVQxnB/e8U/jT+SzYqK6V12SnLf4ufN5nepZkdOjgbtuA1Q==",
|
||||
=======
|
||||
"@uifabric/icons": {
|
||||
"version": "5.8.0",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.8.0.tgz",
|
||||
"integrity": "sha512-EUhKxYlIPJshg4fQvCNTYSk0p7RhzEWeEAJBV4sao1SKmN0/pZBnkLbDqWjU5VUfdwZZYiIdaLRpM+pyzhniZw==",
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
>>>>>>> .theirs
|
||||
"requires": {
|
||||
<<<<<<< .mine
|
||||
"@microsoft/load-themed-styles": "1.7.74",
|
||||
"@uifabric/merge-styles": "5.17.1",
|
||||
"@uifabric/utilities": "5.34.1",
|
||||
=======
|
||||
"@uifabric/styling": "5.31.2",
|
||||
|
||||
|
||||
>>>>>>> .theirs
|
||||
"tslib": "1.8.1"
|
||||
}
|
||||
<<<<<<< .mine
|
||||
},
|
||||
"@uifabric/utilities": {
|
||||
"version": "5.34.1",
|
||||
"resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.34.1.tgz",
|
||||
"integrity": "sha512-xUZ+KlCxmA9PCEOtutfeyYnPmySkEVA/ak3fb8Uj54684GlbrnlqrfNEencVG5YgQDcNEaztTwxW3I7jSCrYJQ==",
|
||||
"requires": {
|
||||
"@uifabric/merge-styles": "5.17.1",
|
||||
"prop-types": "15.6.0",
|
||||
"tslib": "1.8.1"
|
||||
}
|
||||
=======
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
>>>>>>> .theirs
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -16632,20 +16509,6 @@
|
|||
"safe-buffer": "5.1.1"
|
||||
}
|
||||
},
|
||||
"sharepoint-modern-script-editor-propertypane": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/sharepoint-modern-script-editor-propertypane/-/sharepoint-modern-script-editor-propertypane-1.0.5.tgz",
|
||||
"integrity": "sha512-CcLKJSHaf5hyCHB6O2bloahgfN9WZVp7CH/ROFhZ3d19KxhuoTS91HzPsn8bIB+qaKdimfva+f9ucxhF6AuMvg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/prop-types": "15.5.5",
|
||||
"@types/react": "15.6.6",
|
||||
"@types/react-dom": "15.5.6",
|
||||
"office-ui-fabric-react": "5.118.3",
|
||||
"react": "15.6.2",
|
||||
"react-dom": "15.6.2"
|
||||
}
|
||||
},
|
||||
"shebang-command": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
|
||||
|
|
|
@ -6,27 +6,15 @@
|
|||
"node": ">=0.10.0"
|
||||
},
|
||||
"dependencies": {
|
||||
<<<<<<< .mine
|
||||
"@microsoft/sp-core-library": "1.5.1",
|
||||
"@microsoft/sp-webpart-base": "1.5.1",
|
||||
|
||||
=======
|
||||
"@microsoft/sp-core-library": "1.5.1",
|
||||
"@microsoft/sp-webpart-base": "1.5.1",
|
||||
"@types/es6-promise": "0.0.33",
|
||||
>>>>>>> .theirs
|
||||
"@types/react": "15.6.6",
|
||||
"@types/react-dom": "15.5.6",
|
||||
<<<<<<< .mine
|
||||
"@types/webpack-env": "1.13.1",
|
||||
|
||||
=======
|
||||
"@types/webpack-env": "1.13.1",
|
||||
"office-ui-fabric-react": "^5.118.3",
|
||||
>>>>>>> .theirs
|
||||
"react": "15.6.2",
|
||||
"react-dom": "15.6.2",
|
||||
"@types/es6-promise": "0.0.33"
|
||||
"react-dom": "15.6.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@microsoft/sp-build-web": "1.5.1",
|
||||
|
@ -36,13 +24,7 @@
|
|||
"@types/mocha": "2.2.38",
|
||||
"ajv": "~5.2.2",
|
||||
"gulp": "~3.9.1",
|
||||
<<<<<<< .mine
|
||||
"sharepoint-modern-script-editor-propertypane": "^1.0.5",
|
||||
"webpack-bundle-analyzer": "^2.13.1"
|
||||
=======
|
||||
"webpack-bundle-analyzer": "^2.13.1"
|
||||
|
||||
>>>>>>> .theirs
|
||||
},
|
||||
"scripts": {
|
||||
"build": "gulp bundle",
|
||||
|
|
|
@ -35,7 +35,7 @@ export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEd
|
|||
this.domElement.innerHTML = this.properties.script;
|
||||
this.executeScript(this.domElement);
|
||||
} else {
|
||||
// Dynamically load the editor pane to reduce overall bundle size
|
||||
// Dynamically load the editor pane to reduce overall bundle size
|
||||
const editorPopUp = await import(
|
||||
/* webpackChunkName: 'scripteditor' */
|
||||
'./components/ScriptEditor'
|
||||
|
@ -183,4 +183,4 @@ export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEd
|
|||
onLoads[i]();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,13 @@
|
|||
@import '~office-ui-fabric-react/dist/sass/References.scss';
|
||||
|
||||
.scriptEditor {
|
||||
.container {
|
||||
max-width: 700px;
|
||||
margin: 0px auto;
|
||||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.row {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,85 @@
|
|||
import * as React from 'react';
|
||||
import styles from './ScriptEditor.module.scss';
|
||||
import { IScriptEditorProps } from './IScriptEditorProps';
|
||||
import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
|
||||
import { DefaultButton, PrimaryButton } from 'office-ui-fabric-react/lib/Button';
|
||||
import { TextField } from 'office-ui-fabric-react/lib/TextField';
|
||||
import { loadStyles } from '@microsoft/load-themed-styles';
|
||||
require('./overrides.css');
|
||||
|
||||
export default class ScriptEditor extends React.Component<IScriptEditorProps, any> {
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
this._showDialog = this._showDialog.bind(this);
|
||||
this._closeDialog = this._closeDialog.bind(this);
|
||||
this._cancelDialog = this._cancelDialog.bind(this);
|
||||
this._onScriptEditorTextChanged = this._onScriptEditorTextChanged.bind(this);
|
||||
|
||||
const uiFabricCSS: string = `
|
||||
.pzl-bgColor-themeDark, .pzl-bgColor-themeDark--hover:hover {
|
||||
background-color: "[theme:themeDark, default:#005a9e]";
|
||||
}
|
||||
`;
|
||||
loadStyles(uiFabricCSS);
|
||||
this.state = {
|
||||
showDialog: false
|
||||
};
|
||||
}
|
||||
|
||||
public componentDidMount(): void {
|
||||
this.setState({ script: this.props.script, loaded: this.props.script });
|
||||
}
|
||||
private _showDialog() {
|
||||
this.setState({ showDialog: true });
|
||||
}
|
||||
|
||||
private _closeDialog() {
|
||||
this.setState({ showDialog: false });
|
||||
this.props.save(this.state.script);
|
||||
}
|
||||
|
||||
private _cancelDialog() {
|
||||
this.props.save(this.state.loaded);
|
||||
this.setState({ showDialog: false, script: this.state.loaded });
|
||||
}
|
||||
|
||||
private _onScriptEditorTextChanged(text: string) {
|
||||
this.setState({ script: text });
|
||||
}
|
||||
|
||||
public render(): React.ReactElement<IScriptEditorProps> {
|
||||
const viewMode = <span dangerouslySetInnerHTML={{ __html: this.state.script }}></span>;
|
||||
|
||||
return (
|
||||
<div >
|
||||
<div className={styles.scriptEditor}>
|
||||
<div className={styles.container}>
|
||||
<div className={`ms-Grid-row pzl-bgColor-themeDark ms-fontColor-white ${styles.row}`}>
|
||||
<div className="ms-Grid-col ms-lg10 ms-xl8 ms-xlPush2 ms-lgPush1">
|
||||
<span className="ms-font-xl ms-fontColor-white">{this.props.title}</span>
|
||||
<p className="ms-font-l ms-fontColor-white"></p>
|
||||
<DefaultButton description='Opens the snippet dialog' onClick={this._showDialog}>Edit snippet</DefaultButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Dialog
|
||||
isOpen={this.state.showDialog}
|
||||
type={DialogType.normal}
|
||||
onDismiss={this._closeDialog}
|
||||
title='Embed'
|
||||
subText='Paste your script, markup or embed code below. Note that scripts will only run in view mode.'
|
||||
isBlocking={true}
|
||||
className={'ScriptPart'}
|
||||
>
|
||||
<TextField multiline rows={15} onChanged={this._onScriptEditorTextChanged} value={this.state.script} />
|
||||
<DialogFooter>
|
||||
<PrimaryButton onClick={this._closeDialog}>Save</PrimaryButton>
|
||||
<DefaultButton onClick={this._cancelDialog}>Cancel</DefaultButton>
|
||||
</DialogFooter>
|
||||
{viewMode}
|
||||
</Dialog>
|
||||
</div >);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,4 @@
|
|||
.ScriptPart .ms-Dialog-main {
|
||||
width: 65%;
|
||||
max-width: 65%;
|
||||
}
|
Loading…
Reference in New Issue