Merge branch 'v1-dev' into v1

pnp · Dec 16, 2020 · 8e0f441 · 8e0f441
2 parents e0cae23 + eacb4ed
commit 8e0f441
Show file tree

Hide file tree

Showing 21 changed files with 355 additions and 34 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -1,7 +1,7 @@
 defaults: &defaults
   working_directory: ~/sp-dev-fx-controls-react
   docker:
-    - image: circleci/node:8.9.1
+    - image: circleci/node:8.9.4
 
 version: 2
 jobs:
@@ -126,25 +126,34 @@ workflows:
       - build:
           filters:
             branches:
-              ignore: /^(dev|master)/
+              ignore: /^(dev|master|v2|v1-dev)/
   release_next:
     jobs:
       - build:
           filters:
             branches:
-              only: dev
+              only:
+                - dev
+                - v2
+                - v1-dev
       - build_next:
           requires:
             - build
           filters:
             branches:
-              only: dev
+              only:
+                - dev
+                - v2
+                - v1-dev
       - publish_next:
           requires:
             - build_next
           filters:
             branches:
-              only: dev
+              only:
+                - dev
+                - v2
+                - v1-dev
   release:
     jobs:
       - build:

diff --git a/CHANGELOG.JSON b/CHANGELOG.JSON
@@ -1,5 +1,32 @@
 {
   "versions": [
+    {
+      "version": "1.21.1",
+      "changes": {
+        "new": [],
+        "enhancements": [
+          "`ListView`: drag and drop [#711](https://github.com/pnp/sp-dev-fx-controls-react/pull/711)",
+          "`TaxonomyPicker`: control does not show an error message for an invalid/unresolved input [#728](https://github.com/pnp/sp-dev-fx-controls-react/issues/728)"
+        ],
+        "fixes": [
+          "`RichText`: Fixing hyperlink issues [#708](https://github.com/pnp/sp-dev-fx-controls-react/pull/708)"
+        ]
+      },
+      "contributions": [
+        "[Abderahman Moujahid](https://github.com/Abderahman88)",
+        "[André Lage](https://github.com/aaclage)"
+      ]
+    },
+    {
+      "version": "1.21.0",
+      "changes": {
+        "new": [],
+        "enhancements": [],
+        "fixes": [
+          "`TaxonomyPicker`: Ability to reset the TaxonomyPicker (Remove all selected Terms) [#367](https://github.com/pnp/sp-dev-fx-controls-react/issues/367)"
+        ]
+      }
+    },
     {
       "version": "1.20.0",
       "changes": {

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,26 @@
 # Releases
 
+## 1.21.1
+
+### Enhancements
+
+- `ListView`: drag and drop [#711](https://github.com/pnp/sp-dev-fx-controls-react/pull/711)
+- `TaxonomyPicker`: control does not show an error message for an invalid/unresolved input [#728](https://github.com/pnp/sp-dev-fx-controls-react/issues/728)
+
+### Fixes
+
+- `RichText`: Fixing hyperlink issues [#708](https://github.com/pnp/sp-dev-fx-controls-react/pull/708)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Abderahman Moujahid](https://github.com/Abderahman88), [André Lage](https://github.com/aaclage).
+
+## 1.21.0
+
+### Fixes
+
+- `TaxonomyPicker`: Ability to reset the TaxonomyPicker (Remove all selected Terms) [#367](https://github.com/pnp/sp-dev-fx-controls-react/issues/367)
+
 ## 1.20.0
 
 ### New control(s)

diff --git a/docs/documentation/docs/about/release-notes.md b/docs/documentation/docs/about/release-notes.md
@@ -1,5 +1,26 @@
 # Releases
 
+## 1.21.1
+
+### Enhancements
+
+- `ListView`: drag and drop [#711](https://github.com/pnp/sp-dev-fx-controls-react/pull/711)
+- `TaxonomyPicker`: control does not show an error message for an invalid/unresolved input [#728](https://github.com/pnp/sp-dev-fx-controls-react/issues/728)
+
+### Fixes
+
+- `RichText`: Fixing hyperlink issues [#708](https://github.com/pnp/sp-dev-fx-controls-react/pull/708)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Abderahman Moujahid](https://github.com/Abderahman88), [André Lage](https://github.com/aaclage).
+
+## 1.21.0
+
+### Fixes
+
+- `TaxonomyPicker`: Ability to reset the TaxonomyPicker (Remove all selected Terms) [#367](https://github.com/pnp/sp-dev-fx-controls-react/issues/367)
+
 ## 1.20.0
 
 ### New control(s)

diff --git a/docs/documentation/docs/assets/ListView-DragDrop.png b/docs/documentation/docs/assets/ListView-DragDrop.png
diff --git a/docs/documentation/docs/controls/ListView.md b/docs/documentation/docs/controls/ListView.md
@@ -8,6 +8,10 @@ This control renders a list view for the given set of items.
 
 ![ListView control with grouping](../assets/ListView-grouping.png)
 
+**List view control with drag and drop applied**
+
+![ListView control with grouping](../assets/ListView-DragDrop.png)
+
 ## How to use this control in your solutions
 
 - Check that you installed the `@pnp/spfx-controls-react` dependency. Check out the [getting started](../../#getting-started) page for more information about installing the dependency.
@@ -30,7 +34,9 @@ import { ListView, IViewField, SelectionMode, GroupOrder, IGrouping } from "@pnp
   showFilter={true}
   defaultFilter="John"
   filterPlaceHolder="Search..."
-  groupByFields={groupByFields} />
+  groupByFields={groupByFields}
+  dragDropFiles={true}
+  onDrop={this._getDropFiles} />
 ```
 - The control provides full text filtering through all the columns. If you want to exectue filtering on the specified columns, you can use syntax : `<ColumndName>`:`<FilterValue>`. Use `':'` as a separator between column name and value. Control support both `'fieldName'` and `'name'` properties of IColumn interface.
 
@@ -61,6 +67,16 @@ const groupByFields: IGrouping[] = [
 !!! note "Extend ListView with a ContextualMenu"
     To extend the `ListView` control with a [ContextualMenu](https://developer.microsoft.com/en-us/fabric#/components/contextualmenu) refer to [ListView.ContextualMenu](./ListView.ContextualMenu.md).
 
+- With the `onDrop` handler you can define a method that returns files that where drag and drop by user in the list view:
+
+```typescript
+private _getDropFiles = (files) => {
+    for (var i = 0; i < files.length; i++) {
+      console.log(files[i].name);
+    }
+  }
+```
+
 ## Implementation
 
 The ListView control can be configured with the following properties:
@@ -78,6 +94,7 @@ The ListView control can be configured with the following properties:
 | filterPlaceHolder | string | no | Specify the placeholder for the filter text box. Default 'Search' |
 | showFilter | boolean | no | Specify if the filter text box should be rendered. |
 | defaultFilter | string | no | Specify the initial filter to be applied to the list. |
+| onDrop | file | no | Event handler returns files from drag and drop. |
 
 The `IViewField` has the following implementation:
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@pnp/spfx-controls-react",
   "description": "Reusable React controls for SharePoint Framework solutions",
-  "version": "1.20.0",
+  "version": "1.21.1",
   "engines": {
     "node": ">=0.10.0"
   },

diff --git a/src/common/telemetry/version.ts b/src/common/telemetry/version.ts
@@ -1 +1 @@
-export const version: string = "1.20.0";
+export const version: string = "1.21.1";
diff --git a/src/controls/filePicker/FilePicker.tsx b/src/controls/filePicker/FilePicker.tsx
@@ -46,7 +46,7 @@ export class FilePicker extends React.Component<IFilePickerProps, IFilePickerSta
     this.fileSearchService = new FilesSearchService(props.context, this.props.bingAPIKey);
 
     this.state = {
-      panelOpen: false,
+      panelOpen: this.props.isPanelOpen || false,
       organisationAssetsEnabled: false,
       showFullNav: true
     };
@@ -206,6 +206,9 @@ export class FilePicker extends React.Component<IFilePickerProps, IFilePickerSta
    * Closes the panel
    */
   private _handleClosePanel = () => {
+    if (this.props.onCancel) {
+      this.props.onCancel();
+    }
     this.setState({
       panelOpen: false
     });

diff --git a/src/controls/filePicker/IFilePickerProps.ts b/src/controls/filePicker/IFilePickerProps.ts
@@ -113,4 +113,12 @@ export interface IFilePickerProps {
    * @default true
    */
   storeLastActiveTab?: boolean;
+  /**
+   * Specifies if the file picker panel is open by default or not
+   */
+  isPanelOpen?: boolean;
+  /**
+   * Handler when file picker has been cancelled.
+   */
+  onCancel?: () => void;
 }
diff --git a/src/controls/listView/IListView.ts b/src/controls/listView/IListView.ts
@@ -9,6 +9,15 @@ export enum GroupOrder {
 }
 
 export interface IListViewProps {
+
+  /**  
+   * Specify if drag and drop option is selected. 
+   **/
+  dragDropFiles?: boolean;
+  /**  
+  * Handler to return the files from drag and drop. 
+  **/
+  onDrop?: any;
   /**
    * Specify the name of the file URL path which will be used to show the file icon.
    */
@@ -73,6 +82,8 @@ export interface IListViewState {
   columns?: IColumn[];
 
   groups?: IGroup[];
+
+  dragStatus?: boolean;
 }
 
 export interface IGrouping {

diff --git a/src/controls/listView/ListView.DragDrop.module.scss b/src/controls/listView/ListView.DragDrop.module.scss
@@ -0,0 +1,25 @@
+.DragDropArea {
+  position: relative;
+  min-height: 150px;
+}
+
+.DragDropAreaBorder {
+  border: dashed grey 1px;
+  background-color: rgba(255,255,255,.6);
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 1;
+}
+
+.DragDropAreaZone {
+  position: absolute;
+  top: 35%;
+  right: 0;
+  left: 0;
+  text-align: center;
+  color: grey;
+  font-size: 34px;
+}