Merge branch 'dev'

This commit is contained in:
VesaJuvonen 2018-02-16 10:44:08 +02:00
commit ef2e9c693d
7 changed files with 30 additions and 4 deletions

View File

@ -69,6 +69,7 @@ Version|Date|Comments
1.0.0.1|August 8th, 2017|Updated SPFx version and CSS loading
1.0.0.2|October 4th, 2017|Updated SPFx version, bundle Office UI Fabric and CSS in webpart
1.0.0.3|January 10th, 2018|Updated SPFx version, added remove padding property and refactoring
1.0.0.4|February 14th, 2018|Added title property for edit mode and documentation for enabling the web part on Group sites / tenant wide
## Disclaimer
**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.**
@ -93,6 +94,22 @@ Version|Date|Comments
* E.g.: https://<tenant>.sharepoint.com/sites/AppCatalog/AppCatalog
* Add the web part to a site collection, and test it on a page
### Deploy to non-script sites / modern team sites
By default this web part is not allowed on no-script sites, as it allows execution of arbitrary script. This is by design as from a security and governance perspective you might not want arbitrary script added to your pages. This is typically something you want control over.
If you however want to allow the web part for non-script sites like Office 365 Group modern team sites you have to edit `ScriptEditorWebPart.manifest.json` with the following change:
```
"requiresCustomScript": false
```
### Deploy tenant wide
By default you have to install this web part per site collection where you want it availble. If you want it enabled by default on all sites you have to edit `package-solution.json` with the following change:
```
"skipFeatureDeployment": true
```
In order to make it availble to absolutely all sites you need apply the _Deploy to non-script sites / modern team site_ change as well.
## Features
This web part illustrates the following concepts on top of the SharePoint Framework:

View File

@ -2,7 +2,7 @@
"solution": {
"name": "Modern Script Editor web part by Puzzlepart",
"id": "1425175f-3ed8-44d2-8fc4-dd1497191294",
"version": "1.0.0.3",
"version": "1.0.0.4",
"includeClientSideAssets": true,
"skipFeatureDeployment": false
},

View File

@ -1,4 +1,5 @@
export interface IScriptEditorWebPartProps {
script: string;
title: string;
removePadding: boolean;
}

View File

@ -21,6 +21,7 @@
"officeFabricIconFontName": "JS",
"properties": {
"script": "",
"title" : "The Modern Script Editor web part!",
"removePadding": false
}
}

View File

@ -5,12 +5,13 @@ import { SPComponentLoader } from '@microsoft/sp-loader';
import {
BaseClientSideWebPart,
IPropertyPaneConfiguration,
PropertyPaneCustomField
PropertyPaneCustomField,
PropertyPaneToggle,
PropertyPaneTextField
} from '@microsoft/sp-webpart-base';
import ScriptEditor from './components/ScriptEditor';
import { IScriptEditorProps } from './components/IScriptEditorProps';
import { IScriptEditorWebPartProps } from './IScriptEditorWebPartProps';
import { PropertyPaneToggle } from '@microsoft/sp-webpart-base/lib/propertyPane/propertyPaneFields/propertyPaneToggle/PropertyPaneToggle';
export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEditorWebPartProps> {
public save: (script: string) => void = (script: string) => {
@ -23,6 +24,7 @@ export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEd
ScriptEditor,
{
script: this.properties.script,
title: this.properties.title,
save: this.save
}
);
@ -61,6 +63,10 @@ export default class ScriptEditorWebPart extends BaseClientSideWebPart<IScriptEd
groups: [
{
groupFields: [
PropertyPaneTextField("title",{
label: "Title to show in edit mode",
value: this.properties.title
}),
PropertyPaneToggle("removePadding", {
label: "Remove top/bottom padding of web part container",
checked: this.properties.removePadding,

View File

@ -1,4 +1,5 @@
export interface IScriptEditorProps {
script: string;
title: string;
save(script: string): void;
}

View File

@ -57,7 +57,7 @@ export default class ScriptEditor extends React.Component<IScriptEditorProps, an
<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">The Modern Script Editor web part!</span>
<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>