Update stepper docs

pull/5323/head
Cagatay Civici 2024-02-22 12:45:53 +03:00
parent 9d8e2cfd65
commit 02b4daead2
5 changed files with 8 additions and 5 deletions

View File

@ -1,6 +1,9 @@
<template> <template>
<DocSectionText v-bind="$attrs"> <DocSectionText v-bind="$attrs">
<p>Stepper consists of one or more StepperPanel elements.</p> <p>
Stepper consists of one or more StepperPanel elements to encapsulate each step in the progress. The elements to navigate between the steps are not built-in for ease of customization, instead <i>prevCallback</i> and
<i>nextCallback</i> events should be bound to your custom UI elements.
</p>
</DocSectionText> </DocSectionText>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<Stepper> <Stepper>

View File

@ -1,6 +1,6 @@
<template> <template>
<DocSectionText v-bind="$attrs"> <DocSectionText v-bind="$attrs">
<p>Stepper is linear by default to enforce completion of a previus step to proceed, set <i>linear</i> as true for non-linear mode.</p> <p>When <i>linear</i> property is present, current step must be completed in order to move to the next step.</p>
</DocSectionText> </DocSectionText>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<Stepper linear> <Stepper linear>

View File

@ -1,6 +1,6 @@
<template> <template>
<DocSectionText v-bind="$attrs"> <DocSectionText v-bind="$attrs">
<p>Each StepperPanel content can easily be customized with the default slot instead of using the built-in modes. Additionally, header, content, and separator sections of the StepperPanel are customizable via templating.</p> <p>Stepper provides various templating options to customize the default UI design.</p>
</DocSectionText> </DocSectionText>
<div class="card flex justify-content-center"> <div class="card flex justify-content-center">
<Stepper v-model:activeStep="active"> <Stepper v-model:activeStep="active">

View File

@ -1,6 +1,6 @@
<template> <template>
<DocSectionText v-bind="$attrs"> <DocSectionText v-bind="$attrs">
<p>Layout of the Stepper is configured with the <i>orientation</i> property that accepts <i>horizontal</i> and <i>vertical</i> as options.</p> <p>Layout of the Stepper is configured with the <i>orientation</i> property that accepts <i>horizontal</i> and <i>vertical</i> as available options.</p>
</DocSectionText> </DocSectionText>
<div class="card"> <div class="card">
<Stepper orientation="vertical"> <Stepper orientation="vertical">

View File

@ -2,7 +2,7 @@
<DocComponent <DocComponent
title="Vue Stepper Component" title="Vue Stepper Component"
header="Stepper" header="Stepper"
description="Stepper is a component that streamlines a wizard-like workflow, organizing content into coherent steps and visually guiding users through a numbered progression in a multi-step process." description="The Stepper component displays a wizard-like workflow by guiding users through the multi-step progression."
:componentDocs="docs" :componentDocs="docs"
:themingDocs="themingDoc" :themingDocs="themingDoc"
:ptTabComponent="ptComponent" :ptTabComponent="ptComponent"