TxToast · Vue · tecexpress

Timed status message; accept visibility changes in the application.

Prop	Type	Default	Meaning
`visible`	`boolean \| undefined`	`false`	Controls visibility.
`message`	`string \| undefined`	`undefined`	Notification text.
`position`	`string \| undefined`	`bottom-right`	Position of the notification or overlay.
`type`	`"error" \| "success" \| "info" \| "warning" \| undefined`	`info`	Appearance/input type; see the signature for allowed values.
`displayTime`	`number \| undefined`	`3500`	Display duration; 0 or Duration.zero stays open.

Events

Event	Payload / behavior
update:visible	New visible value; accept using v-model:visible (modelValue: v-model).

Slots

Slot	Arguments
default	()
actions	()

vue

<script setup lang="ts">
import { ref } from 'vue'
import { TxToast, TxButton } from '@tekocloud.de/tecexpress'
import '@tekocloud.de/tecexpress/themes/index.css'
const visible = ref(false)
</script>

<template>
  <TxButton text="Notify" @click="visible = true" />
  <TxToast v-model:visible="visible" message="Saved" type="success" />
</template>

TxToast.