Ce package contient un ensemble de composants LWC à destination des Experience Sites Salesforce implémentant le template LWR Build Your Own.
Il s'agit de l'implémentation de différents composants HTML définis dans le Système de Design de l'État Français, prenant en compte la structuration et les contraintes de ce template LWR Build Your Own des Experience Sites Salesforce.
Ces composants sont construits/maintenus en tant qu'exemples/contributions de Pierre-Emmanuel Gros dans le cadre de missions de conseil pour Salesforce.
- Il s'agit d'une première version initialisée pour un premier projet en production, les composants étant progressivement enrichis et améliorés au gré des nouveaux besoins rencontrés.
- Merci de le contacter si vous souhaitez participer à cette initiative (par ex. via des pull requests)
- Vous pouvez également utiliser les issues pour poser des questions, remonter des problèmes ou demander des améliorations.
ℹ️ Un autre package à destination des sites LWR Build Your Own plus générique est également disponible pour enrichir les capacités de configuration des pages : cf. PEG_LWR
Ce package propose différents types de composants LWC:
- Composants unitaires de présentation (tags, boutons...)
- Components de présentation (entête, pied de page)
- Composants de structure (accordéons, onglets de sections)
- Composants de sécurité (connexion, changement de mot de passe...)
- Composants complexes (cartes, tuiles, alertes...)
Chaque composant est documenté dans sa propre page.
ℹ️ Certains composants nécessitent le déploiement prélable du package PEG_LIST pour fonctionner. Il s'agit de tous les composants proposant des fonctionnalités avancées en termes de liste et d'action.
- la CSS, les polices et les icônes / pictogrammes du DSFR
- une CSS de surcharge des caractéristiques du SLDS standard Salesforce pour les adapter à la charte graphique du DSFR (afin d'utiliser certains composants standards Salesforce, par ex. le lightning-record-form ou les inputs standards des Flows)
- dsfrButtonDsp pour déclencher une action de navigation
- dsfrActionButtonCmp pour déclencher une création / MAJ d'un enregistrement (par ex. MAJ d'un statut)
- dsfrFormButtonCmp pour déclencher un formulaire de création / modification en popup modale
- dsfrFlowPopupCmp pour déclencher un processus guidé (Salesforce Flow) en popup modale
- dsfrSearchCmp pour définir des critères de sélection et naviguer vers une page de recherche (ou mettre à jour le contexte de sélection d'une page de recherche)
- dsfrActionListCmp pour afficher un groupe de bouton activable dynamiquement
This package has been tested only in Build Your Own (LWR) Experience Sites.
Àllow guest users to access public APIs
and
Let guest users view asset files and CMS content available to the site
settings should be activated if guest usage is supported.
Guest Usage also equires various elements to be configured to let them properly access CMS Content, Objects, List Views (e.g. for the standard Grid component), Flows... This is done via feature specific settings (CMS, Flow) and Guest User profile configuration.
For the time being, it is required to set the CSP to the
Relaxed CSP: Permit Access to Inline Scripts and Allowed Hosts
value
with the local domain URL allowed (e.g. https:/<mydomain>.sandbox.my.site.com/
)
in order to let the component properly load especially when included in Flows.
The DSFR static resource should be loaded via the head marketup for the styles, fonts, icons, pictograms... to be properly displayed. Some custom overrides are also required to properly style standard Salesforce components (if used).
See dsfrHeadMarkup
In the site theme, the Set max content width
setting should be checked and the
Max Content Width
set to 1200 (px) to be consistent with DSFR break points.
All section padding, gutters... should be also set to 0 at site level.
These components leverage the latest capabilities of LWR Experience Sites and will probably not work in Aura based ones.
A wide number of components are also usable within Flows in order to be reused for Page Flow processes within Experience Sites.
When using Cards and Tiles with CMS Collections (via the standard Grid component), it is possible to inject the following properties in the DSFR components:
{!Item.name}
for card/tile title{!Item.body.contentBody.excerpt}
for card/tile description{!Item.body.contentBody.bannerImage.url}
for card/tile image