Text in Element's colours and sizes, truncated to a line or a number of lines if asked.
Usage
el_text(
...,
id = NULL,
type = NULL,
size = NULL,
truncated = NULL,
line_clamp = NULL,
tag = NULL,
width = NULL,
slots = NULL
)
update_el_text(
session = shiny::getDefaultReactiveDomain(),
id,
type = NULL,
size = NULL,
truncated = NULL,
line_clamp = NULL,
tag = NULL
)Arguments
- ...
Its content: any Shiny UI. Components of this package are folded into this one's Vue instance, as
el_button_group()folds its buttons.- id
Component ID. Auto-generated if
NULL.- type
Text type. Element Plus's
type('primary' | 'success' | 'warning' | 'danger' | 'info').- size
Text size. Element Plus's
size('large' | 'default' | 'small').- truncated
Render ellipsis. Element Plus's
truncated(boolean).- line_clamp
Maximum lines. Element Plus's
line-clamp(string / number).- tag
Custom element tag. Element Plus's
tag(string).- width
Component width, as a CSS unit.
- slots
Named list of Element slot contents. A scoped slot is written with
template().- session
Shiny session; the current one by default, as for
shiny::updateTextInput().
Updating from the server
update_el_text() changes the component from the server: every argument of
el_text() that can change once it is drawn, under the same name. One left
NULL stays as it is; NA returns it to Element's default.
update_el_text() is called for its side effect and returns NULL invisibly.
Examples
el_text("Primary text", type = "primary")
#> <div id="el_text_200d8dc7-61b3-4e76-a4ec-20c0895b473d" data-shiny-vue style="display: contents">
#> <script type="text/x-template" data-shiny-vue-template><div id="el_text_200d8dc7-61b3-4e76-a4ec-20c0895b473d_container" style="display: contents">
#> <el-text :type="type === null ? undefined : type" :size="size === null ? undefined : size" :truncated="truncated === null ? undefined : truncated" :line-clamp="lineClamp === null ? undefined : lineClamp" :tag="tag === null ? undefined : tag">Primary text</el-text>
#> </div></script>
#> <script type="application/json" data-shiny-vue-options>{"options":{"data":{"type":"primary","size":null,"truncated":null,"lineClamp":null,"tag":null}},"input":null,"rate":null,"type":null,"use":["shinyElement.plugin"],"generated":true,"evals":[]}</script>
#> </div>
el_text(strrep("A long sentence. ", 20), truncated = TRUE)
#> <div id="el_text_7e0f46bf-6c70-470d-9a39-e974a9f2783d" data-shiny-vue style="display: contents">
#> <script type="text/x-template" data-shiny-vue-template><div id="el_text_7e0f46bf-6c70-470d-9a39-e974a9f2783d_container" style="display: contents">
#> <el-text :type="type === null ? undefined : type" :size="size === null ? undefined : size" :truncated="truncated === null ? undefined : truncated" :line-clamp="lineClamp === null ? undefined : lineClamp" :tag="tag === null ? undefined : tag">A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. A long sentence. </el-text>
#> </div></script>
#> <script type="application/json" data-shiny-vue-options>{"options":{"data":{"type":null,"size":null,"truncated":true,"lineClamp":null,"tag":null}},"input":null,"rate":null,"type":null,"use":["shinyElement.plugin"],"generated":true,"evals":[]}</script>
#> </div>