v3.9.0

CHANGELOG.JSON → CHANGELOG.json

@@ -1,5 +1,50 @@
 {
   "versions": [
+    {
+      "version": "3.9.0",
+      "changes": {
+        "new": [
+          "`EnhancedThemeProvider`: Added 'EnhancedThemeProvider' control [#1202](https://github.com/pnp/sp-dev-fx-controls-react/issues/1202)",
+          "`FieldPicker`: Added `FieldPicker` control [#1219](https://github.com/pnp/sp-dev-fx-controls-react/issues/1219)",
+          "`ContentTypePicler`: Added `ContentTypePicker` control [#1220](https://github.com/pnp/sp-dev-fx-controls-react/issues/1220)",
+          "`ModernAudio`: Added `ModernAudio` control [#1224](https://github.com/pnp/sp-dev-fx-controls-react/issues/1224)",
+          "`AdaptiveCardDesignerHost`: Added `AdaptiveCardDesignerHost` control [#1237](https://github.com/pnp/sp-dev-fx-controls-react/issues/1237)"
+        ],
+        "enhancements": [
+          "`DateTimePicker`: Added button to clear date [#1217](https://github.com/pnp/sp-dev-fx-controls-react/issues/1217)",
+          "`Toolbar`: Allow filters on a Toolbar to be controlled externally [#1222](https://github.com/pnp/sp-dev-fx-controls-react/issues/1222)",
+          "`PeoplePicker`: add new allowUnvalidated option to allow adding non-tenant users [#1232](https://github.com/pnp/sp-dev-fx-controls-react/pull/1232)",
+          "`DynamicForm`: Add support for `webAbsoluteUrl` [#1244](https://github.com/pnp/sp-dev-fx-controls-react/pull/1244)"
+        ],
+        "fixes": [
+          "`Localization`: Updates to English localizations [#1207](https://github.com/pnp/sp-dev-fx-controls-react/issues/1207)",
+          "`Localization`: Updates to Dutch localizations [#1209](https://github.com/pnp/sp-dev-fx-controls-react/issues/1209)",
+          "`Localization`: Updates to Danish localizations [#1233](https://github.com/pnp/sp-dev-fx-controls-react/pull/1233)",
+          "`TaxonomyPicker`: Check if cultureInfo is valid [#1226](https://github.com/pnp/sp-dev-fx-controls-react/issues/1226)",
+          "`FieldCollectionData`: Updated docs to fix duplicated property [#1236](https://github.com/pnp/sp-dev-fx-controls-react/pull/1236)",
+          "`Changelog`: Fix changelog script by setting CHANGELOG.JSON filename extension to lower case [#1242](https://github.com/pnp/sp-dev-fx-controls-react/pull/1242)",
+          "`PeoplePicker`: PeoplePicker validation on focus out [#1221](https://github.com/pnp/sp-dev-fx-controls-react/pull/1221)",
+          "`DynamicForm`: Cannot display lookup value when the source field is not Title [#1215](https://github.com/pnp/sp-dev-fx-controls-react/issues/1215)",
+          "`FilePicker`: the endPoint for webSearch do not work [#1256](https://github.com/pnp/sp-dev-fx-controls-react/issues/1256)"
+
+        ]
+      },
+      "contributions": [
+        "[Annie-Johnson](https://github.com/Annie-Johnson)",
+        "[Daniel Watford](https://github.com/danwatford)",
+        "[Dennis Kuhn](https://github.com/DennisKuhn)",
+        "[Fabio Franzini](https://github.com/fabiofranzini)",
+        "[Jake Stanger](https://github.com/JakeStanger)",
+        "[Joseph Halvey](https://github.com/HardluckHalvey)",
+        "[Markus Möller](https://github.com/mmsharepoint)",
+        "[Milan Holemans](https://github.com/milanholemans)",
+        "[Morten Andersen](https://github.com/spcph)",
+        "[Richard Gigan](https://github.com/PooLP)",
+        "[Rico van de Ven](https://github.com/RicoNL)",
+        "[ryanexner](https://github.com/ryanexner)",
+        "[Sergio Villalta](https://github.com/6gal6ler6)"
+      ]
+    },
     {
       "version": "3.8.1",
       "changes": {

CHANGELOG.md

@@ -1,5 +1,38 @@
 # Releases
 
+## 3.9.0
+
+### New control(s)
+
+- `EnhancedThemeProvider`: Added 'EnhancedThemeProvider' control [#1202](https://github.com/pnp/sp-dev-fx-controls-react/issues/1202)
+- `FieldPicker`: Added `FieldPicker` control [#1219](https://github.com/pnp/sp-dev-fx-controls-react/issues/1219)
+- `ContentTypePicler`: Added `ContentTypePicker` control [#1220](https://github.com/pnp/sp-dev-fx-controls-react/issues/1220)
+- `ModernAudio`: Added `ModernAudio` control [#1224](https://github.com/pnp/sp-dev-fx-controls-react/issues/1224)
+- `AdaptiveCardDesignerHost`: Added `AdaptiveCardDesignerHost` control [#1237](https://github.com/pnp/sp-dev-fx-controls-react/issues/1237)
+
+### Enhancements
+
+- `DateTimePicker`: Added button to clear date [#1217](https://github.com/pnp/sp-dev-fx-controls-react/issues/1217)
+- `Toolbar`: Allow filters on a Toolbar to be controlled externally [#1222](https://github.com/pnp/sp-dev-fx-controls-react/issues/1222)
+- `PeoplePicker`: add new allowUnvalidated option to allow adding non-tenant users [#1232](https://github.com/pnp/sp-dev-fx-controls-react/pull/1232)
+- `DynamicForm`: Add support for `webAbsoluteUrl` [#1244](https://github.com/pnp/sp-dev-fx-controls-react/pull/1244)
+
+### Fixes
+
+- `Localization`: Updates to English localizations [#1207](https://github.com/pnp/sp-dev-fx-controls-react/issues/1207)
+- `Localization`: Updates to Dutch localizations [#1209](https://github.com/pnp/sp-dev-fx-controls-react/issues/1209)
+- `Localization`: Updates to Danish localizations [#1233](https://github.com/pnp/sp-dev-fx-controls-react/pull/1233)
+- `TaxonomyPicker`: Check if cultureInfo is valid [#1226](https://github.com/pnp/sp-dev-fx-controls-react/issues/1226)
+- `FieldCollectionData`: Updated docs to fix duplicated property [#1236](https://github.com/pnp/sp-dev-fx-controls-react/pull/1236)
+- `Changelog`: Fix changelog script by setting CHANGELOG.JSON filename extension to lower case [#1242](https://github.com/pnp/sp-dev-fx-controls-react/pull/1242)
+- `PeoplePicker`: PeoplePicker validation on focus out [#1221](https://github.com/pnp/sp-dev-fx-controls-react/pull/1221)
+- `DynamicForm`: Cannot display lookup value when the source field is not Title [#1215](https://github.com/pnp/sp-dev-fx-controls-react/issues/1215)
+- `FilePicker`: the endPoint for webSearch do not work [#1256](https://github.com/pnp/sp-dev-fx-controls-react/issues/1256)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Annie-Johnson](https://github.com/Annie-Johnson), [Daniel Watford](https://github.com/danwatford), [Dennis Kuhn](https://github.com/DennisKuhn), [Fabio Franzini](https://github.com/fabiofranzini), [Jake Stanger](https://github.com/JakeStanger), [Joseph Halvey](https://github.com/HardluckHalvey), [Markus Möller](https://github.com/mmsharepoint), [Milan Holemans](https://github.com/milanholemans), [Morten Andersen](https://github.com/spcph), [Richard Gigan](https://github.com/PooLP), [Rico van de Ven](https://github.com/RicoNL), [ryanexner](https://github.com/ryanexner), [Sergio Villalta](https://github.com/6gal6ler6).
+
 ## 3.8.1
 
 ### Fixes

docs/documentation/docs/about/release-notes.md

@@ -1,5 +1,38 @@
 # Releases
 
+## 3.9.0
+
+### New control(s)
+
+- `EnhancedThemeProvider`: Added 'EnhancedThemeProvider' control [#1202](https://github.com/pnp/sp-dev-fx-controls-react/issues/1202)
+- `FieldPicker`: Added `FieldPicker` control [#1219](https://github.com/pnp/sp-dev-fx-controls-react/issues/1219)
+- `ContentTypePicler`: Added `ContentTypePicker` control [#1220](https://github.com/pnp/sp-dev-fx-controls-react/issues/1220)
+- `ModernAudio`: Added `ModernAudio` control [#1224](https://github.com/pnp/sp-dev-fx-controls-react/issues/1224)
+- `AdaptiveCardDesignerHost`: Added `AdaptiveCardDesignerHost` control [#1237](https://github.com/pnp/sp-dev-fx-controls-react/issues/1237)
+
+### Enhancements
+
+- `DateTimePicker`: Added button to clear date [#1217](https://github.com/pnp/sp-dev-fx-controls-react/issues/1217)
+- `Toolbar`: Allow filters on a Toolbar to be controlled externally [#1222](https://github.com/pnp/sp-dev-fx-controls-react/issues/1222)
+- `PeoplePicker`: add new allowUnvalidated option to allow adding non-tenant users [#1232](https://github.com/pnp/sp-dev-fx-controls-react/pull/1232)
+- `DynamicForm`: Add support for `webAbsoluteUrl` [#1244](https://github.com/pnp/sp-dev-fx-controls-react/pull/1244)
+
+### Fixes
+
+- `Localization`: Updates to English localizations [#1207](https://github.com/pnp/sp-dev-fx-controls-react/issues/1207)
+- `Localization`: Updates to Dutch localizations [#1209](https://github.com/pnp/sp-dev-fx-controls-react/issues/1209)
+- `Localization`: Updates to Danish localizations [#1233](https://github.com/pnp/sp-dev-fx-controls-react/pull/1233)
+- `TaxonomyPicker`: Check if cultureInfo is valid [#1226](https://github.com/pnp/sp-dev-fx-controls-react/issues/1226)
+- `FieldCollectionData`: Updated docs to fix duplicated property [#1236](https://github.com/pnp/sp-dev-fx-controls-react/pull/1236)
+- `Changelog`: Fix changelog script by setting CHANGELOG.JSON filename extension to lower case [#1242](https://github.com/pnp/sp-dev-fx-controls-react/pull/1242)
+- `PeoplePicker`: PeoplePicker validation on focus out [#1221](https://github.com/pnp/sp-dev-fx-controls-react/pull/1221)
+- `DynamicForm`: Cannot display lookup value when the source field is not Title [#1215](https://github.com/pnp/sp-dev-fx-controls-react/issues/1215)
+- `FilePicker`: the endPoint for webSearch do not work [#1256](https://github.com/pnp/sp-dev-fx-controls-react/issues/1256)
+
+### Contributors
+
+Special thanks to our contributors (in alphabetical order): [Annie-Johnson](https://github.com/Annie-Johnson), [Daniel Watford](https://github.com/danwatford), [Dennis Kuhn](https://github.com/DennisKuhn), [Fabio Franzini](https://github.com/fabiofranzini), [Jake Stanger](https://github.com/JakeStanger), [Joseph Halvey](https://github.com/HardluckHalvey), [Markus Möller](https://github.com/mmsharepoint), [Milan Holemans](https://github.com/milanholemans), [Morten Andersen](https://github.com/spcph), [Richard Gigan](https://github.com/PooLP), [Rico van de Ven](https://github.com/RicoNL), [ryanexner](https://github.com/ryanexner), [Sergio Villalta](https://github.com/6gal6ler6).
+
 ## 3.8.1
 
 ### Fixes

docs/documentation/docs/controls/AdaptiveCardDesignerHost.md

@@ -0,0 +1,104 @@
+# Adaptive Card Designer Host
+
+This control allows you to embed the official Adaptive Cards designer inside a React SPFx solution.
+
+The control consists of 2 components:
+
+* **AdaptiveCardDesigner**: implements all the logic to embed the designer control as a React component;
+* **AdaptiveCardDesignerHost**: main control to render the designer in a full page Fluent UI panel;
+
+**Due to the nature in which the original Adaptive Card Designer control was implemented**, it is not possible at this time to adapt it to the current theme applied to the site and especially to localize it to give multilingual support. **The designer, therefore, is only available in the English language**.
+
+This control shares a lot of code with another control in this library, the "AdaptiveCardHost" control. In this way you have a uniformity of display between the cards created with this designer and those rendered with "AdaptiveCardHost". The same thing goes for the various HostContainer objects, so that you can test the cards with the themes available for "AdaptiveCardHost".
+
+The Adaptive Cards version supported is 1.5, by using the 'adaptivecards' npm package version 2.10.0.
+
+All Inputs Elements and Actions of Adaptive Cards have been redefined using Fluent UI React, adding and improving features that are not managed in Microsoft's implementation of the "adaptivecards-fluentui" library (Theme support for example).
+
+Thanks to the "context" property that allows you to pass the SPFx context, whether the "data" property is passed or not, a new field called @context will be injected into the data object.
+
+This allows, using Adaptive Cards templating syntax and binding feature of the Designer, to access to the context informations.
+
+For more info please to refear tot he documentation of [AdaptiveCardHost ](http://www.google.com)control
+
+Here is an example of the control in action inside a Web Part:
+
+![Adaptive Card Host control](../assets/AdaptiveCardDesignerHost.gif)
+
+## 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.
+
+* In your component file, import the `AdaptiveCardDesignerHost` control as follows:
+```Typescript  
+import { AdaptiveCardDesignerHost, HostContainer, BindingPreviewMode, Versions } from "@pnp/spfx-controls-react/lib/AdaptiveCardDesignerHost";
+```
+
+- Example on use the `AdaptiveCardDesignerHost` control with only required properties:
+```Typescript
+<AdaptiveCardDesignerHost
+  headerText="Adaptive Card Designer"
+  buttonText="Open the Designer"
+  context={props.context}
+  onSave={(payload: object) => setCard(payload)}
+/>
+```
+
+- Example on use the `AdaptiveCardDesignerHost` control with all properties:
+```Typescript
+<AdaptiveCardDesignerHost
+  headerText="Adaptive Card Designer"
+  buttonText="Open the Designer"
+  context={props.context}
+  onSave={(payload: object) => setCard(payload)}
+  addDefaultAdaptiveCardHostContainer={true}
+  bindingPreviewMode={BindingPreviewMode.SampleData}
+  theme={props.theme}
+  card={card}
+  data={data}
+  enableDataBindingSupport={true}
+  hostConfig={hostConfig}
+  hostContainers={[]}
+  injectAdaptiveCardHostContextProperty={true}
+  newCardPayload={newCard}
+  selectedHostContainerControlsTargetVersion={false}
+  showCopyToJsonToolbarCommand={true}
+  showDataStructureToolbox={true}
+  showFluentBreakpointsPicker={true}
+  showSampleDataEditorToolbox={true}
+  showTargetVersionMismatchWarning={true}
+  showVersionPicker={true}
+  supportedTargetVersions={[Versions.v1_5]}
+  snippets={snippets}
+/>
+```
+## Implementation
+
+The `AdaptiveCardDesignerHost` control can be configured with the following properties:
+
+| Property | Type | Required | Description | Default Value |
+| ---- | ---- | ---- | ---- | ---- |
+| context | BaseComponentContext | true | Set the context from SPFx component | - |
+| theme | IPartialTheme or ITheme | false | Set Fluent UI Theme | - |
+| onSave | (payload: object) => void | true | Callback for saving the card | - |
+| card | object | false | Set Adaptive Card payload | - |
+| data | { "$root": object } | false | Set Data Source for template rendering | - |
+| newCardPayload | object | false | Set Adaptive Card payload for the New Card | - |
+| hostContainers | HostContainer[] | false | Set custom HostContainers | [] |
+| supportedTargetVersions | Version[] | false | Set the suported Versions | [Versions.v1_5] |
+| snippets | IToolboxSnippet[] | false | Set the Toolbox Snippets | [] |
+| bindingPreviewMode | BindingPreviewMode | false | Set the Binding preview mode | BindingPreviewMode.GeneratedData |
+| enableDataBindingSupport | boolean | false | Enable the support for Data Binding | true |
+| selectedHostContainerControlsTargetVersion | boolean | false | Enable the support for Data Binding | false |
+| showTargetVersionMismatchWarning | boolean | false | Show the target version mismatch warning | true |
+| showVersionPicker | boolean | false | Show the Version Picker | false |
+| showSampleDataEditorToolbox | boolean | false | Show the Sample Data Editor Toolbox | false |
+| showDataStructureToolbox | boolean | false | Show the Data Structure Toolbox | true |
+| showFluentBreakpointsPicker | boolean | false | Show the Fluent UI Breakpoint Picker | true |
+| showCopyToJsonToolbarCommand | boolean | false | Show the copy to json button | false |
+| addDefaultAdaptiveCardHostContainer | boolean | false | Add the default Host Containers to the Picker | true |
+| injectAdaptiveCardHostContextProperty | boolean | false | Inject the SPFx Context Property inside the Adaptive Card data object | true |
+| headerText | boolean | false | Set the Header text for the Adaptive Card Designer | - |
+| buttonText | boolean | false | Set the Button text for open the Adaptive Card Designer | - |
+
+![](https://telemetry.sharepointpnp.com/sp-dev-fx-controls-react/wiki/controls/AdaptiveCardDesignerHost)

docs/documentation/docs/controls/ContentTypePicker.md

@@ -0,0 +1,82 @@
+# ContentTypePicker control
+
+This control allows you to select one or multiple available site content types or list content types.
+
+Here is an example of the control:
+
+![ContentTypePicker initial](../assets/ContentTypePicker-initial.png)
+
+`ContentTypePicker` single selection mode:
+
+![ContentTypePicker single selection](../assets/ContentTypePicker-single.png)
+
+`ContentTypePicker` multi selection mode:
+
+![ContentTypePicker multi selection](../assets/ContentTypePicker-multi.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.
+- Import the control into your component:
+
+```TypeScript
+import { ContentTypePicker } from "@pnp/spfx-controls-react/lib/ContentTypePicker";
+```
+
+- Use the `ContentTypePicker` control in your code as follows:
+
+```TypeScript
+<ContentTypePicker
+  context={this.props.context}
+  group="Content Feedback"
+  includeHidden={false}
+  includeReadOnly={false}
+  label="Select your content type"
+  multiSelect={false}
+  orderBy={ContentTypesOrderBy.Name}
+  listId="00000000-0000-0000-0000-000000000000"
+  onSelectionChanged={this.onContentTypePickerChanged}
+  showBlankOption={true}
+/>
+```
+
+- The `onSelectionChanged` change event returns the content type(s) and can be implemented as follows:
+
+```TypeScript
+private onContentTypePickerChanged (contentTypes: ISPContentType | ISPContentType[]) {
+  console.log("Content types:", contentTypes);
+}
+```
+
+## Implementation
+
+The `ContentTypePicker` control can be configured with the following properties:
+
+| Property | Type | Required | Description |
+| --- | --- | --- | --- |
+| context | BaseComponentContext | yes | The context object of the SPFx loaded webpart or customizer. |
+| listId | string | no | The ID of the list or library you wish to select content type(s) from. When not specified, picker will be populated with site content types.|
+| className | string | no | If provided, additional class name to provide on the dropdown element. |
+disabled | boolean | no | Whether or not the control is disabled. |
+includeHidden | boolean | no | Whether or not to include hidden content types. Default is true. |
+includeReadOnly | boolean | no | Whether or not to include read-only content types. Default is true. |
+group | string | no | Only show content types of a certain group. |
+filter | string | no | Filter content types from OData query (takes the upperhand of `hidden`, `readOnly` and `group` Filters). |
+orderBy | ContentTypesOrderBy | no | How to order the content types. |
+selectedContentTypes | string \| string[] | no | IDs of the selected item(s). If you provide this, you must maintain selection state by observing `onSelectionChanged` events and passing a new value in when changed.
+multiSelect | boolean | no | Indicates if multi-choice selections is allowed. Default is false. |
+label | string | no | The label to display. |
+placeholder | string | no | Input placeholder text. Displayed until option is selected. |
+onSelectionChanged | (newValue: ISPContentType \| ISPContentType[]): void | no | Callback issued when the selected option changes. |
+filterItems | (contentTypes: ISPContentType[]): ISPContentType[] | no | This function is invoked after the filtering has been done. This allows you to add additional custom filtering.
+webAbsoluteUrl | string | no | Absolute Web Url of target site (user requires permissions). |
+showBlankOption | boolean | no | Whether or not to show a blank option. Default is false. Works only when `multiSelect` is false. |
+
+Enum `ContentTypesOrderBy`
+
+| Value |
+| ---- |
+| Name |
+| Id |
+
+![](https://telemetry.sharepointpnp.com/sp-dev-fx-controls-react/wiki/controls/ContentTypePicker)