Statut
-
Component checklist
Usage
<dsa-stepper>
<dsa-step step-title="Enregistrement" status="complete">
<p slot="content" style="margin:0">
is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the
1500s.
</p>
<dsa-tooltip
slot="tooltip"
content="Information à partager"
placement="top"
distance="8"
skidding="0"
trigger="hover focus"
hoist
>
<dsa-icon-button
name="info"
label="Information complémentaire"
></dsa-icon-button
></dsa-tooltip>
</dsa-step>
<dsa-step step-title="Informations personnelles" status="error">
<p slot="content" style="margin:0">
is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the
1500s.
</p></dsa-step
>
<dsa-step step-title="Adresse" status="in-progress">
<p slot="content" style="margin:0">
is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the
1500s.
</p></dsa-step
>
<dsa-step step-title="Récapitulatif">
<p slot="content" style="margin:0">
is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the
1500s.
</p></dsa-step
>
</dsa-stepper>
<script type="text/typescript">
import '@ds-autonomie/web-components/dist/components/step/step.js';
import '@ds-autonomie/web-components/dist/components/stepper/stepper.js';
import type { DSAStep, DSAStepper } from '@ds-autonomie/web-components/';
</script>
API
Attributs et propriétés
|
Propriété attribut |
Description |
Type |
Valeur par défaut |
|---|---|---|---|
|
hideLabel hide-label
|
Activez cette option pour enlever le label des différentes étapes
|
boolean |
false |
|
vertical
|
Activez cette option pour mettre le stepper en mode vertical |
boolean |
false |
Voir aussi l’élément dsa-step.