Skip to contents

A step of el_steps()

Source: R/el_items.R
el_step.Rd

Element Plus's el-step, for el_steps(steps =).

Usage

el_step(title = NULL, description = NULL, icon = NULL, status = NULL)

Arguments

title

Step title: text, or markup for the step's title slot.

description

Step description: text, or markup.

icon

The step's icon, by name, or markup.

status

The step's status, set by the steps when not given: "", "wait", "process", "finish", "error" or "success".

Value

A step, for el_steps(steps =).

See also

Other items: el_anchor_link(), el_breadcrumb_item(), el_carousel_item(), el_collapse_item(), el_descriptions_item(), el_dropdown_item(), el_menu_item(), el_option(), el_skeleton_item(), el_tab_pane(), el_table_column(), el_table_v2_column(), el_timeline_item(), el_tour_step()

Examples

el_steps(
  "s",
  steps = list(
    el_step("Step 1", "Some description"),
    el_step("Step 2", icon = "Upload"),
    el_step("Step 3", status = "error")
  ),
  active = 1
)
#> <div id="s" data-shiny-vue style="display: contents">
#>   <script type="text/x-template" data-shiny-vue-template><div id="s_container" style="display: contents">
#>   <el-steps :active="active" :direction="direction" :process-status="processStatus" :finish-status="finishStatus" :align-center="alignCenter" :simple="simple" :space="space === null ? undefined : space" @change="elEmitChange">
#>     <el-step title="Step 1" description="Some description"></el-step>
#>     <el-step title="Step 2" icon="Upload"></el-step>
#>     <el-step title="Step 3" status="error"></el-step>
#>   </el-steps>
#> </div></script>
#>   <script type="application/json" data-shiny-vue-options>{"options":{"data":{"active":1,"direction":"horizontal","processStatus":"process","finishStatus":"finish","alignCenter":false,"simple":false,"space":null},"methods":{"elEmitChange":"function() { window.shinyVue.emit('s', 'change', arguments); }"},"watch":{"active":"function(newVal) { }"}},"input":"active","rate":null,"type":null,"use":["shinyElement.plugin"],"evals":["options.methods.elEmitChange","options.watch.active"]}</script>
#> </div>