Add Accordion web part implementation with dynamic SharePoint list integration
- Created Accordion web part with SPFx 1.4.1 framework. - Implemented dynamic loading of SharePoint lists and fields. - Added configuration options for title, content, and category fields. - Included support for multiple open sections and initial state settings. - Developed HTML sanitizer for rich text content. - Implemented accessible accordion UI with category grouping. - Added localization support for English and German languages. - Created necessary configuration files for deployment and asset management. - Added validation script to ensure project compliance with standards.
This commit is contained in:
@@ -0,0 +1,62 @@
|
||||
# Accordion
|
||||
|
||||
Accordion 1.0.0 ist ein listenbasiertes SPFx-WebPart für SharePoint Server Subscription Edition. Es orientiert
|
||||
sich funktional am PnP-Beispiel `react-accordion-dynamic-section`, verwendet aber die mit SharePoint SE
|
||||
kompatible SPFx-1.4.1-/React-15-Toolchain.
|
||||
|
||||
## Funktionen
|
||||
|
||||
- Auswahl einer nicht ausgeblendeten Liste aus dem aktuellen Web
|
||||
- dynamische Auswahl von Überschrift-, Inhalt-, Kategorie- und Sortierspalte
|
||||
- optionales Gruppieren nach Kategorien
|
||||
- auf- oder absteigende Sortierung
|
||||
- initial vollständig geschlossen, erster Eintrag geöffnet oder alle Einträge geöffnet
|
||||
- wahlweise genau ein oder mehrere gleichzeitig geöffnete Bereiche
|
||||
- semantische Buttons mit `aria-expanded`, `aria-controls` und zugeordneten Inhaltsregionen
|
||||
- SharePoint-Themefarben und Standardtypografie
|
||||
- bereinigte Rich-Text-Ausgabe ohne Skripte, Eventhandler, Bilder oder unsichere Links
|
||||
- zentrale Bereitstellung über den App Catalog
|
||||
|
||||
## Erwartete Liste
|
||||
|
||||
Es wird keine fachliche Liste provisioniert. Eine einfache FAQ-Liste kann beispielsweise folgende Spalten besitzen:
|
||||
|
||||
| Spalte | Typ | Verwendung |
|
||||
|---|---|---|
|
||||
| `Title` | Eine Textzeile | Überschrift |
|
||||
| `Content` | Mehrere Textzeilen mit Rich Text | Inhalt |
|
||||
| `Category` | Auswahl oder Text | optionale Gruppierung |
|
||||
| `SortOrder` | Zahl | optionale Sortierung |
|
||||
|
||||
Nach dem Hinzufügen des WebParts werden Liste und Spalten im Property Pane ausgewählt. Änderungen an den
|
||||
Listeneinträgen erscheinen beim nächsten Laden beziehungsweise Rendern der Seite automatisch.
|
||||
|
||||
## Version und Build
|
||||
|
||||
| Eigenschaft | Wert |
|
||||
|---|---|
|
||||
| Version | 1.0.0 |
|
||||
| SharePoint Framework | 1.4.1 |
|
||||
| React | 15.6.2 |
|
||||
| Node.js | 8.17.0 |
|
||||
| npm | 6.13.4 |
|
||||
|
||||
```powershell
|
||||
npm install
|
||||
npm run package
|
||||
```
|
||||
|
||||
Das Paket wird unter `sharepoint/solution/accordion.sppkg` erzeugt. Es kann im App Catalog zentral bereitgestellt
|
||||
werden. Danach steht das WebPart unter dem Namen **Accordion** beziehungsweise **Akkordeon** im WebPart-Picker zur Verfügung.
|
||||
|
||||
## Sicherheit
|
||||
|
||||
Der Inhalt einer Rich-Text-Spalte wird nicht ungeprüft ausgegeben. Erlaubt sind grundlegende Text-, Listen-,
|
||||
Tabellen- und Linkelemente. Skripte, eingebettete Inhalte, Eventhandler, Inline-Styles und unsichere URL-Schemata
|
||||
werden entfernt.
|
||||
|
||||
## Referenz
|
||||
|
||||
Die fachliche Vorlage ist das PnP Community Sample:
|
||||
https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-accordion-dynamic-section
|
||||
|
||||
Reference in New Issue
Block a user