SParagraph <s-paragraph>

import { SParagraph } from 'polaris-vue-elements'

Example

Default paragraph text, used for the bulk of body copy.A subdued paragraph, useful for secondary or helper text.A critical paragraph, useful for inline error copy. A long paragraph that demonstrates lineClamp truncating its content after a fixed number of lines instead of wrapping indefinitely down the page.

<script setup>
import { SParagraph } from 'polaris-vue-elements'
</script>

<template>
  <SParagraph>Default paragraph text, used for the bulk of body copy.</SParagraph>
  <SParagraph color="subdued">A subdued paragraph, useful for secondary or helper text.</SParagraph>
  <SParagraph tone="critical">A critical paragraph, useful for inline error copy.</SParagraph>
  <SParagraph :lineClamp="2" style="max-width: 280px">
    A long paragraph that demonstrates lineClamp truncating its content after a fixed
    number of lines instead of wrapping indefinitely down the page.
  </SParagraph>
</template>

Props

Prop	Type	Description
accessibilityVisibility	"visible" | "hidden" | "exclusive"	Changes the visibility of the element. - visible: the element is visible to all users. - hidden: the element is removed from the accessibility tree but remains visible. - exclusive: the element is visually hidden but remains in the accessibility tree.
color	"subdued" | "base"	Modify the color to be more or less intense.
dir	"auto" | "ltr" | "rtl"	Indicates the directionality of the element’s text. - ltr: languages written from left to right (e.g. English) - rtl: languages written from right to left (e.g. Arabic) - auto: the user agent determines the direction based on the content - '': direction is inherited from parent elements (equivalent to not setting the attribute)
fontVariantNumeric	"auto" | "normal" | "tabular-nums"	Set the numeric properties of the font.
lineClamp	number	Truncates the text content to the specified number of lines.
tone	"auto" | "neutral" | "info" | "success" | "caution" | "warning" | "critical"	Sets the tone of the component, based on the intention of the information being conveyed.

Slots

Slot	Description
default	The content of the Paragraph.