Interface ISplitTextStaticProps

Static properties for the SplitText module

interface ISplitTextStaticProps {
    __staticProp?: true;
    ariaLabel?: string | boolean;
    container: HTMLElement;
    ignore?: null | string | HTMLElement[] | (element: HTMLElement) => boolean;
    letterClass?: string;
    letters?: boolean;
    letterTag?: keyof HTMLElementTagNameMap;
    lineClass?: string;
    lines?: boolean;
    linesWrapper?: boolean;
    lineTag?: keyof HTMLElementTagNameMap;
    lineWrapperClass?: string;
    prepareText?: (text: string) => string;
    resizeDebounce?: number;
    wordClass?: string;
    wordDelimiter?: string;
    wordDelimiterOutput?: null | string;
    wordTag?: keyof HTMLElementTagNameMap;
}

Hierarchy (View Summary)

Properties

__staticProp? ariaLabel? container ignore? letterClass? letters? letterTag? lineClass? lines? linesWrapper? lineTag? lineWrapperClass? prepareText? resizeDebounce? wordClass? wordDelimiter? wordDelimiterOutput? wordTag?

Properties

Optional__staticProp

__staticProp?: true

OptionalariaLabel

ariaLabel?: string | boolean

Allow aria-label. false prevents adding aria-label attributes to container. String value overrides the default aria-label.

Default

true

container

container: HTMLElement

The text container where the text will be split.

Optionalignore

ignore?: null | string | HTMLElement[] | (element: HTMLElement) => boolean

Do not split certain elements. Supports string selectors, array of elements, or function.

Default

null

OptionalletterClass

letterClass?: string

Letter class name.

Default

v-split-text__letter

Optionalletters

letters?: boolean

Specifies whether the text should be split into individual letters.

Default

false

OptionalletterTag

letterTag?: keyof HTMLElementTagNameMap

HTML tag to wrap each letter.

Default

span

OptionallineClass

lineClass?: string

Line class name.

Default

v-split-text__line

Optionallines

lines?: boolean

Specifies whether the text should be split into lines.

Default

false

OptionallinesWrapper

linesWrapper?: boolean

Specifies whether to wrap each line in an additional container.

Default

false

OptionallineTag

lineTag?: keyof HTMLElementTagNameMap

HTML tag to wrap each line.

Default

span

OptionallineWrapperClass

lineWrapperClass?: string

Line wrapper class name.

Default

v-split-text__line-wrapper

OptionalprepareText

prepareText?: (text: string) => string

Optional callback to preprocess text before it is split into words. This function receives the original text and should return the modified text. It is useful for languages like Chinese where standard word splitting may not work correctly.

Example

const segmenter = new Intl.Segmenter('zh', { granularity: 'word' });

const instance = new SplitText({
  container,
  prepareText: (source) => [...segmenter.segment(source)].map((s) => s.segment).join(' '),
 });

OptionalresizeDebounce

resizeDebounce?: number

The debounce delay for the resize event in milliseconds.

Default

0

OptionalwordClass

wordClass?: string

Word class name.

Default

v-split-text__word

OptionalwordDelimiter

wordDelimiter?: string

Specifies a custom delimiter used to split text into words. By default, splitting occurs on regular whitespace.

Default

" "

OptionalwordDelimiterOutput

wordDelimiterOutput?: null | string

Provides an alternative delimiter to use when outputting the split words. Useful when a custom input delimiter is used but the output should differ.

Default

null

OptionalwordTag

wordTag?: keyof HTMLElementTagNameMap

HTML tag to wrap each word.

Default

span

Settings

Member Visibility

On This Page

Properties