Skip to content

Commit d42db42

Browse files
author
Tom German
committed
Amended ControlsTest config propertyPane
1 parent 5db10f8 commit d42db42

14 files changed

+558
-319
lines changed

src/webparts/controlsTest/ControlsTestWebPart.manifest.json

Lines changed: 70 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -7,21 +7,74 @@
77
"manifestVersion": 2,
88
"requiresCustomScript": false,
99
"supportsThemeVariants": true,
10-
"supportedHosts": ["SharePointWebPart", "TeamsTab"],
11-
"preconfiguredEntries": [{
12-
"groupId": "45165954-80f9-44c1-9967-cd38ae92a33b",
13-
"group": {
14-
"default": "Under Development"
15-
},
16-
"title": {
17-
"default": "ControlsTest"
18-
},
19-
"description": {
20-
"default": "ControlsTest description"
21-
},
22-
"officeFabricIconFontName": "Share",
23-
"properties": {
24-
"description": "ControlsTest"
10+
"supportedHosts": [
11+
"SharePointWebPart",
12+
"TeamsTab"
13+
],
14+
"preconfiguredEntries": [
15+
{
16+
"groupId": "45165954-80f9-44c1-9967-cd38ae92a33b",
17+
"group": {
18+
"default": "Under Development"
19+
},
20+
"title": {
21+
"default": "Controls Test"
22+
},
23+
"description": {
24+
"default": "Web Part to test controls"
25+
},
26+
"officeFabricIconFontName": "Share",
27+
"properties": {
28+
"description": "Controls Test",
29+
"controlVisibility": {
30+
"all": false,
31+
"accessibleAccordion": false,
32+
"adaptiveCardDesignerHost": false,
33+
"adaptiveCardHost": false,
34+
"animatedDialog": false,
35+
"Carousel": false,
36+
"ChartControl": false,
37+
"ComboBoxListItemPicker": false,
38+
"Dashboard": false,
39+
"DateTimePicker": false,
40+
"DragDropFiles": false,
41+
"DynamicForm": false,
42+
"EnhancedThemeProvider": false,
43+
"FieldCollectionData": false,
44+
"FieldPicker": false,
45+
"FilePicker": false,
46+
"FileTypeIcon": false,
47+
"FolderExplorer": false,
48+
"FolderPicker": false,
49+
"GridLayout": false,
50+
"IconPicker": false,
51+
"IFrameDialog": false,
52+
"IFramePanel": false,
53+
"ListPicker": false,
54+
"ListView": false,
55+
"LocationPicker": false,
56+
"Map": false,
57+
"ModernAudio": false,
58+
"ModernTaxonomyPicker": false,
59+
"Pagination": false,
60+
"PeoplePicker": false,
61+
"Placeholder": false,
62+
"Progress": false,
63+
"RichText": false,
64+
"SecurityTrimmedControl": false,
65+
"SiteBreadcrumb": false,
66+
"SitePicker": false,
67+
"TaxonomyPicker": false,
68+
"TaxonomyTree": false,
69+
"Teams": false,
70+
"TestControl": false,
71+
"Toolbar": false,
72+
"TreeView": false,
73+
"UploadFiles": false,
74+
"VariantThemeProvider": false,
75+
"WebPartTitle": false
76+
}
77+
}
2578
}
26-
}]
27-
}
79+
]
80+
}

src/webparts/controlsTest/ControlsTestWebPart.ts

Lines changed: 41 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,9 @@ import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base';
1717

1818
import ControlsTest from './components/ControlsTest';
1919
import { IControlsTestProps } from './components/IControlsTestProps';
20-
import { IControlsTestWebPartProps } from './IControlsTestWebPartProps';
20+
import { ControlVisibility, IControlsTestWebPartProps } from './IControlsTestWebPartProps';
21+
import { PropertyPaneListPicker } from './propertyPane/PropertyPaneListPicker';
22+
import { PropertyPaneControlToggles } from './propertyPane/PropertyPaneControlToggles';
2123

2224
/**
2325
* Web part to test the React controls
@@ -86,13 +88,21 @@ export default class ControlsTestWebPart extends BaseClientSideWebPart<IControls
8688

8789
themeVariant: this._themeVariant,
8890
context: this.context,
91+
controlVisibility: this.properties.controlVisibility,
8992
description: this.properties.description,
9093
title: this.properties.title ?? "Sample title",
9194
displayMode: this.displayMode,
95+
dynamicFormListId: this.properties.dynamicFormListId,
96+
onOpenPropertyPane: () => {
97+
this.context.propertyPane.open();
98+
},
9299
updateProperty: (value: string) => {
93100
this.properties.title = value;
101+
if (this.context.propertyPane.isPropertyPaneOpen()) {
102+
this.context.propertyPane.refresh();
103+
}
94104
},
95-
totalPages: this.properties.totalPages
105+
totalPages: this.properties.paginationTotalPages
96106
}
97107
);
98108

@@ -117,13 +127,38 @@ export default class ControlsTestWebPart extends BaseClientSideWebPart<IControls
117127
},
118128
groups: [
119129
{
120-
groupName: strings.BasicGroupName,
130+
groupName: strings.ControlSettingsGroupName,
121131
groupFields: [
122-
PropertyPaneTextField('description', {
123-
label: strings.DescriptionFieldLabel
132+
PropertyPaneTextField('title', {
133+
label: 'Web Part Title',
124134
}),
125-
PropertyPaneTextField('totalPages', {
135+
PropertyPaneTextField('paginationTotalPages', {
126136
label: 'Total pages in pagination'
137+
}),
138+
new PropertyPaneListPicker('dynamicFormListId', {
139+
label: 'List for Dynamic Form',
140+
wpContext: this.context,
141+
selectedKey: this.properties.dynamicFormListId,
142+
disabled: false,
143+
onPropertyChange: (propertyPath: string, newValue: string) => {
144+
this.properties.dynamicFormListId = newValue;
145+
this.render();
146+
this.context.propertyPane.refresh();
147+
}
148+
})
149+
]
150+
},
151+
{
152+
groupName: strings.ControlsGroupName,
153+
groupFields: [
154+
new PropertyPaneControlToggles('controlVisibility', {
155+
controlVisibility: this.properties.controlVisibility,
156+
label: 'Toggle controls',
157+
onPropertyChange: (newValue: ControlVisibility) => {
158+
this.properties.controlVisibility = newValue;
159+
this.render();
160+
this.context.propertyPane.refresh();
161+
}
127162
})
128163
]
129164
}
Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,28 @@
1+
export type ValidControls = "all" |
2+
"accessibleAccordion" | "adaptiveCardDesignerHost" | "adaptiveCardHost" |
3+
"animatedDialog" | "Carousel" | "ChartControl" |
4+
"ComboBoxListItemPicker" | "Dashboard" | "DateTimePicker" |
5+
"DragDropFiles" | "DynamicForm" | "EnhancedThemeProvider" |
6+
"FieldCollectionData" | "FieldPicker" | "FilePicker" |
7+
"FileTypeIcon" | "FolderExplorer" | "FolderPicker" |
8+
"GridLayout" | "IconPicker" | "IFrameDialog" |
9+
"IFramePanel" | "ListPicker" | "ListView" |
10+
"LocationPicker" | "Map" | "ModernAudio" |
11+
"ModernTaxonomyPicker" | "Pagination" | "PeoplePicker" |
12+
"Placeholder" | "Progress" | "RichText" |
13+
"SecurityTrimmedControl" | "SiteBreadcrumb" | "SitePicker" |
14+
"TaxonomyPicker" | "TaxonomyTree" | "Teams" |
15+
"TestControl" | "Toolbar" | "TreeView" |
16+
"UploadFiles" | "VariantThemeProvider" | "WebPartTitle";
17+
18+
export type ControlVisibility = {
19+
[K in ValidControls]: boolean;
20+
}
21+
122
export interface IControlsTestWebPartProps {
223
title: string;
324
description: string;
4-
totalPages: number;
25+
paginationTotalPages: number;
26+
dynamicFormListId: string;
27+
controlVisibility: ControlVisibility
528
}

0 commit comments

Comments
 (0)