honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add files via upload

This commit is contained in:
Jerry Yasir 2020-09-20 20:12:36 -04:00 committed by GitHub
parent 030e6c70da
commit 988267635e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
27 changed files with 746 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

134
samples/react-accordion-dynamic-section/dist/061da2cd-f680-4da5-ab30-40a8ba1aafd8.manifest.json vendored Normal file
View File

@ -0,0 +1,134 @@
{
"id": "061da2cd-f680-4da5-ab30-40a8ba1aafd8",
"alias": "ReactAccordionWebPart",
"componentType": "WebPart",
"version": "1.6.0",
"manifestVersion": 2,
"requiresCustomScript": false,
"supportedHosts": [
"SharePointWebPart",
"TeamsTab"
],
"loadLegacyFabricCss": true,
"preconfiguredEntries": [
{
"groupId": "5c03119e-3074-46fd-976b-c60198311f70",
"group": {
"default": "Other"
},
"title": {
"default": "Dynamic Accordion Section"
},
"description": {
"default": "Collapsible accordion section for displaying list data based on Category and Dynamic selection"
},
"officeFabricIconFontName": "MusicInCollectionFill",
"properties": {
"description": "Dynamic React Accordion",
"listId": "",
"columnTitle": "",
"selectedChoice": "",
"accordianTitleColumn": "",
"accordianContentColumn": "",
"allowZeroExpanded": true
}
}
],
"loaderConfig": {
"entryModuleId": "react-accordion-web-part",
"internalModuleBaseUrls": [
"https://localhost:4321/"
],
"scriptResources": {
"react-accordion-web-part": {
"type": "path",
"path": "dist/react-accordion-web-part.js"
},
"ReactAccordionWebPartStrings": {
"defaultPath": "lib/webparts/reactAccordion/loc/en-us.js",
"type": "localizedPath",
"paths": {}
},
"ControlStrings": {
"defaultPath": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"type": "localizedPath",
"paths": {
"de-DE": "node_modules/@pnp/spfx-controls-react/lib/loc/de-de.js",
"de": "node_modules/@pnp/spfx-controls-react/lib/loc/de-de.js",
"dsb": "node_modules/@pnp/spfx-controls-react/lib/loc/de-de.js",
"rm": "node_modules/@pnp/spfx-controls-react/lib/loc/de-de.js",
"hsb": "node_modules/@pnp/spfx-controls-react/lib/loc/de-de.js",
"en-US": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"bn": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"chr": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"dv": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"div": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"en": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"fil": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"haw": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"iu": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"lo": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"moh": "node_modules/@pnp/spfx-controls-react/lib/loc/en-us.js",
"fr-FR": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"gsw": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"br": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"tzm-Tfng": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"co": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"fr": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"ff": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"lb": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"mg": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"oc": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"zgh": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"wo": "node_modules/@pnp/spfx-controls-react/lib/loc/fr-fr.js",
"lt-LT": "node_modules/@pnp/spfx-controls-react/lib/loc/lt-lt.js",
"nl-NL": "node_modules/@pnp/spfx-controls-react/lib/loc/nl-nl.js",
"nl": "node_modules/@pnp/spfx-controls-react/lib/loc/nl-nl.js",
"fy": "node_modules/@pnp/spfx-controls-react/lib/loc/nl-nl.js",
"ru-RU": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"ru": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"ba": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"be": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"ky": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"mn": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"sah": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"tg": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"tt": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js",
"tk": "node_modules/@pnp/spfx-controls-react/lib/loc/ru-ru.js"
}
},
"@microsoft/sp-property-pane": {
"type": "component",
"version": "1.10.0",
"id": "f9e737b7-f0df-4597-ba8c-3060f82380db"
},
"@microsoft/sp-core-library": {
"type": "component",
"version": "1.10.0",
"id": "7263c7d0-1d6a-45ec-8d85-d4d1d234171b"
},
"@microsoft/sp-webpart-base": {
"type": "component",
"version": "1.10.0",
"id": "974a7777-0990-4136-8fa6-95d80114c2e0"
},
"react": {
"type": "component",
"version": "16.8.5",
"id": "0d910c1c-13b9-4e1c-9aa4-b008c5e42d7d",
"failoverPath": "node_modules/react/dist/react.js"
},
"react-dom": {
"type": "component",
"version": "16.8.5",
"id": "aa0a46ec-1505-43cd-a44a-93f3a5aa460a",
"failoverPath": "node_modules/react-dom/dist/react-dom.js"
},
"@microsoft/sp-http": {
"type": "component",
"version": "1.10.0",
"id": "c07208f0-ea3b-4c1a-9965-ac1b825211a6"
}
}
}
}

1
samples/react-accordion-dynamic-section/dist/react-accordion-web-part.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
samples/react-accordion-dynamic-section/dist/react-accordion-web-part.js.map vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
samples/react-accordion-dynamic-section/lib/index.d.ts vendored Normal file
View File

@ -0,0 +1 @@
//# sourceMappingURL=index.d.ts.map

1
samples/react-accordion-dynamic-section/lib/index.d.ts.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":""}

2
samples/react-accordion-dynamic-section/lib/index.js vendored Normal file
View File

@ -0,0 +1,2 @@
// A file is required to be in the root of the /src directory by the TypeScript compiler
//# sourceMappingURL=index.js.map

1
samples/react-accordion-dynamic-section/lib/index.js.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,wFAAwF"}

35
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/ReactAccordionWebPart.d.ts vendored Normal file
View File

@ -0,0 +1,35 @@
import { Version } from "@microsoft/sp-core-library";
import { BaseClientSideWebPart } from "@microsoft/sp-webpart-base";
import { IPropertyPaneConfiguration } from "@microsoft/sp-property-pane";
import "core-js/es6/array";
import "es6-map/implement";
import "core-js/modules/es6.array.find";
export interface IReactAccordionWebPartProps {
listId: string;
accordionTitle: string;
columnTitle: string;
selectedChoice: string;
allowZeroExpanded: boolean;
allowMultipleExpanded: boolean;
accordianTitleColumn: string;
accordianContentColumn: string;
}
export default class ReactAccordionWebPart extends BaseClientSideWebPart<IReactAccordionWebPartProps> {
private listColumns;
private allListColumns;
private columnChoices;
private columnsDropdownDisabled;
private choicesDropdownDisabled;
onInit(): Promise<void>;
render(): void;
protected onDispose(): void;
protected readonly disableReactivePropertyChanges: boolean;
protected readonly dataVersion: Version;
private loadColumns;
private loadAllColumns;
private loadCateogryChoices;
protected onPropertyPaneConfigurationStart(): void;
protected onPropertyPaneFieldChanged(propertyPath: string, oldValue: any, newValue: any): void;
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration;
}
//# sourceMappingURL=ReactAccordionWebPart.d.ts.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/ReactAccordionWebPart.d.ts.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"ReactAccordionWebPart.d.ts","sourceRoot":"","sources":["../../../src/webparts/reactAccordion/ReactAccordionWebPart.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EACL,0BAA0B,EAK3B,MAAM,6BAA6B,CAAC;AAErC,OAAO,mBAAmB,CAAC;AAC3B,OAAO,mBAAmB,CAAC;AAC3B,OAAO,gCAAgC,CAAC;AAcxC,MAAM,WAAW,2BAA2B;IAC1C,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,qBAAqB,EAAE,OAAO,CAAC;IAC/B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,sBAAsB,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,CAAC,OAAO,OAAO,qBAAsB,SAAQ,qBAAqB,CACtE,2BAA2B,CAC5B;IACC,OAAO,CAAC,WAAW,CAAgC;IACnD,OAAO,CAAC,cAAc,CAAgC;IACtD,OAAO,CAAC,aAAa,CAAgC;IAErD,OAAO,CAAC,uBAAuB,CAAiB;IAChD,OAAO,CAAC,uBAAuB,CAAiB;IAEzC,MAAM,IAAI,OAAO,CAAC,IAAI,CAAC;IAQvB,MAAM,IAAI,IAAI;IAyBrB,SAAS,CAAC,SAAS,IAAI,IAAI;uBAIb,8BAA8B,EAAI,OAAO;uBAGzC,WAAW,EAAI,OAAO;IAIpC,OAAO,CAAC,WAAW;IA8BnB,OAAO,CAAC,cAAc;IA6BtB,OAAO,CAAC,mBAAmB;IA+B3B,SAAS,CAAC,gCAAgC,IAAI,IAAI;IA6ClD,SAAS,CAAC,0BAA0B,CAClC,YAAY,EAAE,MAAM,EACpB,QAAQ,EAAE,GAAG,EACb,QAAQ,EAAE,GAAG,GACZ,IAAI;IAoEP,SAAS,CAAC,4BAA4B,IAAI,0BAA0B;CA6DrE"}

297
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/ReactAccordionWebPart.js vendored Normal file
View File

@ -0,0 +1,297 @@
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import * as React from "react";
import * as ReactDom from "react-dom";
import { Version } from "@microsoft/sp-core-library";
import { BaseClientSideWebPart } from "@microsoft/sp-webpart-base";
import { PropertyPaneToggle, PropertyPaneDropdown, } from "@microsoft/sp-property-pane";
import { sp } from "@pnp/sp/presets/all";
import "core-js/es6/array";
import "es6-map/implement";
import "core-js/modules/es6.array.find";
import { PropertyFieldListPicker, PropertyFieldListPickerOrderBy, } from "@pnp/spfx-property-controls/lib/PropertyFieldListPicker";
import * as strings from "ReactAccordionWebPartStrings";
import ReactAccordion from "./components/ReactAccordion";
var ReactAccordionWebPart = /** @class */ (function (_super) {
__extends(ReactAccordionWebPart, _super);
function ReactAccordionWebPart() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.columnsDropdownDisabled = true;
_this.choicesDropdownDisabled = true;
return _this;
}
ReactAccordionWebPart.prototype.onInit = function () {
var _this = this;
return _super.prototype.onInit.call(this).then(function (_) {
sp.setup({
spfxContext: _this.context,
});
});
};
ReactAccordionWebPart.prototype.render = function () {
var _this = this;
var element = React.createElement(ReactAccordion, {
listId: this.properties.listId,
columnTitle: this.properties.columnTitle,
selectedChoice: this.properties.selectedChoice,
accordionTitle: this.properties.accordionTitle,
accordianTitleColumn: this.properties.accordianTitleColumn,
accordianContentColumn: this.properties.accordianContentColumn,
allowZeroExpanded: this.properties.allowZeroExpanded,
allowMultipleExpanded: this.properties.allowMultipleExpanded,
displayMode: this.displayMode,
updateProperty: function (value) {
_this.properties.accordionTitle = value;
},
onConfigure: function () {
_this.context.propertyPane.open();
},
});
ReactDom.render(element, this.domElement);
};
ReactAccordionWebPart.prototype.onDispose = function () {
ReactDom.unmountComponentAtNode(this.domElement);
};
Object.defineProperty(ReactAccordionWebPart.prototype, "disableReactivePropertyChanges", {
get: function () {
return true;
},
enumerable: true,
configurable: true
});
Object.defineProperty(ReactAccordionWebPart.prototype, "dataVersion", {
get: function () {
return Version.parse("1.0");
},
enumerable: true,
configurable: true
});
ReactAccordionWebPart.prototype.loadColumns = function () {
var _this = this;
return new Promise(function (resolve, reject) {
if (!_this.properties.listId) {
console.log("No List Selected");
return null;
}
var spListColumns = sp.web.lists
.getById(_this.properties.listId)
.fields.filter("ReadOnlyField eq false and Hidden eq false and TypeAsString eq 'Choice'")
.get();
spListColumns.then(function (columnResult) {
var listColumns = [];
columnResult.forEach(function (column) {
listColumns.push({
key: column.Title,
text: column.Title,
});
});
resolve(listColumns);
});
});
};
ReactAccordionWebPart.prototype.loadAllColumns = function () {
var _this = this;
return new Promise(function (resolve, reject) {
if (!_this.properties.listId) {
console.log("No List Selected");
return null;
}
var spListColumns = sp.web.lists
.getById(_this.properties.listId)
.fields.filter("ReadOnlyField eq false and Hidden eq false")
.get();
spListColumns.then(function (columnResult) {
var listColumns = [];
columnResult.forEach(function (column) {
listColumns.push({
key: column.InternalName,
text: column.Title + " - [" + column.InternalName + "]",
});
});
resolve(listColumns);
});
});
};
ReactAccordionWebPart.prototype.loadCateogryChoices = function () {
var _this = this;
return new Promise(function (resolve, reject) {
if (!_this.properties.columnTitle) {
console.log("No Columns Selected");
return null;
}
var categoryField = sp.web.lists
.getById(_this.properties.listId)
.fields.getByInternalNameOrTitle(_this.properties.columnTitle);
var choices = categoryField.select("Choices")();
choices.then(function (result) {
//console.clear();
//console.log(result.Choices);
var columnChoices = [];
result.Choices.forEach(function (choice) {
columnChoices.push({
key: choice,
text: choice,
});
});
resolve(columnChoices);
});
});
};
ReactAccordionWebPart.prototype.onPropertyPaneConfigurationStart = function () {
var _this = this;
this.columnsDropdownDisabled = !this.properties.listId;
this.choicesDropdownDisabled = !this.properties.columnTitle;
//if (this.lists) {
// return;
//}
this.context.statusRenderer.displayLoadingIndicator(this.domElement, "lists, column and choices");
if (this.properties.listId) {
this.loadColumns().then(function (columnOptions) {
_this.listColumns = columnOptions;
_this.columnsDropdownDisabled = !_this.properties.listId;
_this.context.propertyPane.refresh();
_this.context.statusRenderer.clearLoadingIndicator(_this.domElement);
_this.render();
});
this.loadAllColumns().then(function (allcolumnOptions) {
_this.allListColumns = allcolumnOptions;
_this.columnsDropdownDisabled = !_this.properties.listId;
_this.context.propertyPane.refresh();
_this.context.statusRenderer.clearLoadingIndicator(_this.domElement);
_this.render();
});
}
if (this.properties.columnTitle) {
this.loadCateogryChoices().then(function (choiceOptions) {
_this.columnChoices = choiceOptions;
_this.choicesDropdownDisabled = !_this.properties.columnTitle;
_this.context.propertyPane.refresh();
_this.context.statusRenderer.clearLoadingIndicator(_this.domElement);
_this.render();
});
}
};
ReactAccordionWebPart.prototype.onPropertyPaneFieldChanged = function (propertyPath, oldValue, newValue) {
// push new list value
var _this = this;
// communicate loading items
if (this.properties.listId) {
this.context.statusRenderer.displayLoadingIndicator(this.domElement, "Columns");
this.loadColumns().then(function (columnOptions) {
// store items
_this.listColumns = columnOptions;
// enable item selector
_this.columnsDropdownDisabled = false;
// clear status indicator
_this.context.statusRenderer.clearLoadingIndicator(_this.domElement);
// re-render the web part as clearing the loading indicator removes the web part body
_this.render();
// refresh the item selector control by repainting the property pane
_this.context.propertyPane.refresh();
});
this.loadAllColumns().then(function (allcolumnOptions) {
_this.allListColumns = allcolumnOptions;
_this.columnsDropdownDisabled = !_this.properties.listId;
_this.context.propertyPane.refresh();
_this.context.statusRenderer.clearLoadingIndicator(_this.domElement);
_this.render();
});
}
if (this.properties.columnTitle) {
this.context.statusRenderer.displayLoadingIndicator(this.domElement, "Choices");
this.loadCateogryChoices().then(function (choiceOption) {
// store items
_this.columnChoices = choiceOption;
// enable item selector
_this.choicesDropdownDisabled = false;
// clear status indicator
_this.context.statusRenderer.clearLoadingIndicator(_this.domElement);
// re-render the web part as clearing the loading indicator removes the web part body
_this.render();
// refresh the item selector control by repainting the property pane
_this.context.propertyPane.refresh();
});
}
if (this.properties.selectedChoice) {
this.context.statusRenderer.displayLoadingIndicator(this.domElement, "Data");
this.context.statusRenderer.clearLoadingIndicator(this.domElement);
this.render();
this.context.propertyPane.refresh();
}
};
ReactAccordionWebPart.prototype.getPropertyPaneConfiguration = function () {
return {
pages: [
{
header: {
description: strings.PropertyPaneDescription,
},
groups: [
{
groupName: strings.BasicGroupName,
groupFields: [
PropertyFieldListPicker("listId", {
label: "Select a list",
selectedList: this.properties.listId,
includeHidden: false,
orderBy: PropertyFieldListPickerOrderBy.Title,
disabled: false,
onPropertyChange: this.onPropertyPaneFieldChanged.bind(this),
properties: this.properties,
context: this.context,
onGetErrorMessage: null,
deferredValidationTime: 0,
key: "listPickerFieldId",
}),
PropertyPaneDropdown("columnTitle", {
label: "Select the (Choice) Column for Categories.",
options: this.listColumns,
disabled: this.columnsDropdownDisabled,
}),
PropertyPaneDropdown("selectedChoice", {
label: "Select the Choice value for filter.",
options: this.columnChoices,
disabled: this.choicesDropdownDisabled,
}),
PropertyPaneDropdown("accordianTitleColumn", {
label: "Select the Column for Accordian Title Rows.",
options: this.allListColumns,
disabled: this.choicesDropdownDisabled,
}),
PropertyPaneDropdown("accordianContentColumn", {
label: "Select the Column for Accordian Content.",
options: this.allListColumns,
disabled: this.choicesDropdownDisabled,
}),
PropertyPaneToggle("allowZeroExpanded", {
label: "Allow zero expanded",
checked: this.properties.allowZeroExpanded,
key: "allowZeroExpanded",
}),
PropertyPaneToggle("allowMultipleExpanded", {
label: "Allow multi expand",
checked: this.properties.allowMultipleExpanded,
key: "allowMultipleExpanded",
}),
],
},
],
},
],
};
};
return ReactAccordionWebPart;
}(BaseClientSideWebPart));
export default ReactAccordionWebPart;
//# sourceMappingURL=ReactAccordionWebPart.js.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/ReactAccordionWebPart.js.map Normal file
View File

File diff suppressed because one or more lines are too long

40
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/ReactAccordionWebPart.manifest.json Normal file
View File

@ -0,0 +1,40 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx/client-side-web-part-manifest.schema.json",
"id": "061da2cd-f680-4da5-ab30-40a8ba1aafd8",
"alias": "ReactAccordionWebPart",
"componentType": "WebPart",
// The "*" signifies that the version should be taken from the package.json
"version": "*",
"manifestVersion": 2,
// If true, the component can only be installed on sites where Custom Script is allowed.
// Components that allow authors to embed arbitrary script code should set this to true.
// https://support.office.com/en-us/article/Turn-scripting-capabilities-on-or-off-1f2c515f-5d7e-448a-9fd7-835da935584f
"requiresCustomScript": false,
"supportedHosts": ["SharePointWebPart", "TeamsTab"],
"loadLegacyFabricCss": true,
"preconfiguredEntries": [{
"groupId": "5c03119e-3074-46fd-976b-c60198311f70", // Other
"group": {
"default": "Other"
},
"title": {
"default": "Dynamic Accordion Section"
},
"description": {
"default": "Collapsible accordion section for displaying list data based on Category and Dynamic selection"
},
"officeFabricIconFontName": "MusicInCollectionFill",
"properties": {
"description": "Dynamic React Accordion",
"listId": "",
"columnTitle": "",
"selectedChoice": "",
"accordianTitleColumn": "",
"accordianContentColumn": "",
"allowZeroExpanded": true
}
}]
}

15
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/IReactAccordionProps.d.ts vendored Normal file
View File

@ -0,0 +1,15 @@
import { DisplayMode } from "@microsoft/sp-core-library";
export interface IReactAccordionProps {
listId: string;
accordionTitle: string;
columnTitle: string;
selectedChoice: string;
accordianTitleColumn: string;
accordianContentColumn: string;
allowZeroExpanded: boolean;
allowMultipleExpanded: boolean;
displayMode: DisplayMode;
updateProperty: (value: string) => void;
onConfigure: () => void;
}
//# sourceMappingURL=IReactAccordionProps.d.ts.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/IReactAccordionProps.d.ts.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"IReactAccordionProps.d.ts","sourceRoot":"","sources":["../../../../src/webparts/reactAccordion/components/IReactAccordionProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAEzD,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;IACvB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,qBAAqB,EAAE,OAAO,CAAC;IAC/B,WAAW,EAAE,WAAW,CAAC;IACzB,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB"}

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/IReactAccordionProps.js vendored Normal file
View File

@ -0,0 +1 @@
//# sourceMappingURL=IReactAccordionProps.js.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/IReactAccordionProps.js.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"IReactAccordionProps.js","sourceRoot":"","sources":["../../../../src/webparts/reactAccordion/components/IReactAccordionProps.ts"],"names":[],"mappings":""}

16
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.d.ts vendored Normal file
View File

@ -0,0 +1,16 @@
import * as React from "react";
import { IReactAccordionProps } from "./IReactAccordionProps";
import "./reactAccordion.css";
export interface IReactAccordionState {
items: Array<any>;
choices: Array<any>;
allowMultipleExpanded: boolean;
allowZeroExpanded: boolean;
}
export default class ReactAccordion extends React.Component<IReactAccordionProps, IReactAccordionState> {
constructor(props: IReactAccordionProps);
private getListItems;
componentDidUpdate(prevProps: IReactAccordionProps): void;
render(): React.ReactElement<IReactAccordionProps>;
}
//# sourceMappingURL=ReactAccordion.d.ts.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.d.ts.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"ReactAccordion.d.ts","sourceRoot":"","sources":["../../../../src/webparts/reactAccordion/components/ReactAccordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAI9D,OAAO,sBAAsB,CAAC;AAU9B,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IAClB,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACpB,qBAAqB,EAAE,OAAO,CAAC;IAC/B,iBAAiB,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,KAAK,CAAC,SAAS,CACzD,oBAAoB,EACpB,oBAAoB,CACrB;gBACa,KAAK,EAAE,oBAAoB;IAYvC,OAAO,CAAC,YAAY;IAiCb,kBAAkB,CAAC,SAAS,EAAE,oBAAoB,GAAG,IAAI;IAgBzD,MAAM,IAAI,KAAK,CAAC,YAAY,CAAC,oBAAoB,CAAC;CAoD1D"}

96
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.js vendored Normal file
View File

@ -0,0 +1,96 @@
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import * as React from "react";
import styles from "./ReactAccordion.module.scss";
import { sp } from "@pnp/sp/presets/all";
import { Placeholder } from "@pnp/spfx-controls-react/lib/Placeholder";
import { WebPartTitle } from "@pnp/spfx-controls-react/lib/WebPartTitle";
import "./reactAccordion.css";
import { Accordion, AccordionItem, AccordionItemHeading, AccordionItemButton, AccordionItemPanel, } from "react-accessible-accordion";
var ReactAccordion = /** @class */ (function (_super) {
__extends(ReactAccordion, _super);
function ReactAccordion(props) {
var _this = _super.call(this, props) || this;
_this.state = {
items: new Array(),
choices: new Array(),
allowMultipleExpanded: _this.props.allowMultipleExpanded,
allowZeroExpanded: _this.props.allowZeroExpanded,
};
_this.getListItems();
return _this;
}
ReactAccordion.prototype.getListItems = function () {
var _this = this;
if (typeof this.props.listId !== "undefined" &&
this.props.listId.length > 0 &&
typeof this.props.columnTitle !== "undefined" &&
this.props.columnTitle.length > 0 &&
typeof this.props.selectedChoice !== "undefined" &&
this.props.selectedChoice.length > 0) {
var query = "<View><Query><Where><Eq><FieldRef Name='" +
this.props.columnTitle +
"'/><Value Type='Text'>" +
this.props.selectedChoice +
"</Value></Eq></Where></Query></View>";
var theAccordianList = sp.web.lists.getById(this.props.listId);
theAccordianList
.getItemsByCAMLQuery({
ViewXml: query,
}) //.select("Title", "Answer", "Category")
.then(function (results) {
_this.setState({
items: results,
});
})
.catch(function (error) {
console.log("Failed to get list items!");
console.log(error);
});
}
};
ReactAccordion.prototype.componentDidUpdate = function (prevProps) {
if (prevProps.listId !== this.props.listId) {
this.getListItems();
}
if (prevProps.allowMultipleExpanded !== this.props.allowMultipleExpanded ||
prevProps.allowZeroExpanded !== this.props.allowZeroExpanded) {
this.setState({
allowMultipleExpanded: this.props.allowMultipleExpanded,
allowZeroExpanded: this.props.allowZeroExpanded,
});
}
};
ReactAccordion.prototype.render = function () {
var _this = this;
var listSelected = typeof this.props.listId !== "undefined" && this.props.listId.length > 0;
var _a = this.state, allowMultipleExpanded = _a.allowMultipleExpanded, allowZeroExpanded = _a.allowZeroExpanded;
return (React.createElement("div", { className: styles.reactAccordion },
!listSelected && (React.createElement(Placeholder, { iconName: "MusicInCollectionFill", iconText: "Configure your web part", description: "Select a list with a Title field and Content field to have its items rendered in a collapsible accordion format", buttonLabel: "Choose a List", onConfigure: this.props.onConfigure })),
listSelected && (React.createElement("div", null,
React.createElement(WebPartTitle, { displayMode: this.props.displayMode, title: this.props.selectedChoice, updateProperty: this.props.updateProperty }),
React.createElement(Accordion, { allowZeroExpanded: allowZeroExpanded, allowMultipleExpanded: allowMultipleExpanded }, this.state.items.map(function (item) {
return (React.createElement(AccordionItem, null,
React.createElement(AccordionItemHeading, null,
React.createElement(AccordionItemButton, { title: item[_this.props.accordianTitleColumn] }, item[_this.props.accordianTitleColumn])),
React.createElement(AccordionItemPanel, null,
React.createElement("p", { dangerouslySetInnerHTML: {
__html: item[_this.props.accordianContentColumn],
} }))));
}))))));
};
return ReactAccordion;
}(React.Component));
export default ReactAccordion;
//# sourceMappingURL=ReactAccordion.js.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.js.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"ReactAccordion.js","sourceRoot":"","sources":["../../../../src/webparts/reactAccordion/components/ReactAccordion.tsx"],"names":[],"mappings":"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"}

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.module.css Normal file
View File

@ -0,0 +1 @@
.reactAccordion_b579c085 .container_b579c085{max-width:700px;margin:0 auto;-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.2),0 25px 50px 0 rgba(0,0,0,.1);box-shadow:0 2px 4px 0 rgba(0,0,0,.2),0 25px 50px 0 rgba(0,0,0,.1)}.reactAccordion_b579c085 .row_b579c085{margin:0 -8px;-webkit-box-sizing:border-box;box-sizing:border-box;color:"[theme:white, default: #ffffff]";background-color:"[theme:themeDark, default: #005a9e]";padding:20px}.reactAccordion_b579c085 .row_b579c085::after,.reactAccordion_b579c085 .row_b579c085::before{display:table;content:'';line-height:0}.reactAccordion_b579c085 .row_b579c085::after{clear:both}.reactAccordion_b579c085 .column_b579c085{position:relative;min-height:1px;padding-left:8px;padding-right:8px;-webkit-box-sizing:border-box;box-sizing:border-box}[dir=ltr] .reactAccordion_b579c085 .column_b579c085{float:left}[dir=rtl] .reactAccordion_b579c085 .column_b579c085{float:right}.reactAccordion_b579c085 .column_b579c085 .ms-Grid_b579c085{padding:0}@media (min-width:640px){.reactAccordion_b579c085 .column_b579c085{width:83.33333333333334%}}@media (min-width:1024px){.reactAccordion_b579c085 .column_b579c085{width:66.66666666666666%}}@media (min-width:1024px){[dir=ltr] .reactAccordion_b579c085 .column_b579c085{left:16.66667%}[dir=rtl] .reactAccordion_b579c085 .column_b579c085{right:16.66667%}}@media (min-width:640px){[dir=ltr] .reactAccordion_b579c085 .column_b579c085{left:8.33333%}[dir=rtl] .reactAccordion_b579c085 .column_b579c085{right:8.33333%}}.reactAccordion_b579c085 .title_b579c085{font-size:21px;font-weight:100;color:"[theme:white, default: #ffffff]"}.reactAccordion_b579c085 .subTitle_b579c085{font-size:17px;font-weight:300;color:"[theme:white, default: #ffffff]"}.reactAccordion_b579c085 .description_b579c085{font-size:17px;font-weight:300;color:"[theme:white, default: #ffffff]"}.reactAccordion_b579c085 .button_b579c085{text-decoration:none;height:32px;min-width:80px;background-color:"[theme:themePrimary, default: #0078d4]";border-color:"[theme:themePrimary, default: #0078d4]";color:"[theme:white, default: #ffffff]";outline:transparent;position:relative;font-family:"Segoe UI WestEuropean","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;font-size:14px;font-weight:400;border-width:0;text-align:center;cursor:pointer;display:inline-block;padding:0 16px}.reactAccordion_b579c085 .button_b579c085 .label_b579c085{font-weight:600;font-size:14px;height:32px;line-height:32px;margin:0 4px;vertical-align:top;display:inline-block}

14
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.module.scss.d.ts vendored Normal file
View File

@ -0,0 +1,14 @@
declare const styles: {
reactAccordion: string;
container: string;
row: string;
column: string;
'ms-Grid': string;
title: string;
subTitle: string;
description: string;
button: string;
label: string;
};
export default styles;
//# sourceMappingURL=ReactAccordion.module.scss.d.ts.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.module.scss.d.ts.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"ReactAccordion.module.scss.d.ts","sourceRoot":"","sources":["../../../../src/webparts/reactAccordion/components/ReactAccordion.module.scss.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;CAWX,CAAC;AAEF,eAAe,MAAM,CAAC"}

17
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.module.scss.js Normal file
View File

@ -0,0 +1,17 @@
/* tslint:disable */
require("./ReactAccordion.module.css");
var styles = {
reactAccordion: 'reactAccordion_b579c085',
container: 'container_b579c085',
row: 'row_b579c085',
column: 'column_b579c085',
'ms-Grid': 'ms-Grid_b579c085',
title: 'title_b579c085',
subTitle: 'subTitle_b579c085',
description: 'description_b579c085',
button: 'button_b579c085',
label: 'label_b579c085'
};
export default styles;
/* tslint:enable */
//# sourceMappingURL=ReactAccordion.module.scss.js.map

1
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/ReactAccordion.module.scss.js.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"ReactAccordion.module.scss.js","sourceRoot":"","sources":["../../../../src/webparts/reactAccordion/components/ReactAccordion.module.scss.ts"],"names":[],"mappings":"AAAA,oBAAoB;AACpB,OAAO,CAAC,6BAA6B,CAAC,CAAC;AACvC,IAAM,MAAM,GAAG;IACb,cAAc,EAAE,yBAAyB;IACzC,SAAS,EAAE,oBAAoB;IAC/B,GAAG,EAAE,cAAc;IACnB,MAAM,EAAE,iBAAiB;IACzB,SAAS,EAAE,kBAAkB;IAC7B,KAAK,EAAE,gBAAgB;IACvB,QAAQ,EAAE,mBAAmB;IAC7B,WAAW,EAAE,sBAAsB;IACnC,MAAM,EAAE,iBAAiB;IACzB,KAAK,EAAE,gBAAgB;CACxB,CAAC;AAEF,eAAe,MAAM,CAAC;AACtB,mBAAmB"}

58
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/components/reactAccordion.css Normal file
View File

@ -0,0 +1,58 @@
.accordion {
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 2px;
}
.accordion__item+.accordion__item {
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.accordion__button {
background-color: #f4f4f4;
color: #444;
cursor: pointer;
padding: 18px;
text-align: left;
border: none;
}
.accordion__button:hover {
background-color: #ddd;
}
.accordion__button:before {
display: inline-block;
content: '';
height: 10px;
width: 10px;
margin-right: 12px;
border-bottom: 2px solid currentColor;
border-right: 2px solid currentColor;
transform: rotate(-45deg);
}
.accordion__button[aria-expanded='true']::before,
.accordion__button[aria-selected='true']::before {
transform: rotate(45deg);
}
.accordion__panel {
padding: 20px;
width: 95%;
animation: fadein 0.35s ease-in;
}
h2 {
text-align: center;
color: #444;
}
@keyframes fadein {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}

7
samples/react-accordion-dynamic-section/lib/webparts/reactAccordion/loc/en-us.js vendored Normal file
View File

@ -0,0 +1,7 @@
define([], function() {
return {
"PropertyPaneDescription": "",
"BasicGroupName": "Settings",
"DescriptionFieldLabel": "Accordion Section"
}
});