Divider

Use cases:

• Used anywhere a horizontal rule might be used.

Example

First block of content

Second block of content

Genesis

Declaration

<rapid-divider></rapid-divider>

Usage

@customElement({
  name: 'my-element',
  template: html`
    <rapid-divider></rapid-divider>
  `,
})
export class MyElement extends GenesisElement {
}

React

Declaration

  <rapid-divider></rapid-divider>

Usage

export function MyComponent() {
  return (
    <rapid-divider></rapid-divider>
  );
}

Angular

Declaration

  <rapid-divider></rapid-divider>

Usage

import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
@Component({
  selector: 'my-root',
  template: `
    <rapid-divider></rapid-divider>
  `,
  standalone: true,
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
export class AppComponent {
}

API

Property and attribute binding examples for Genesis Component syntax. Closing tag omitted.

Attributes

Name	Type	Description	Example
orientation	"horizontal" | "vertical"	The orientation of the divider. Default: horizontal	<rapid-divider orientation="vertical">
role	"separator" | "presentation"	Separator - The divider semantically separates content, Presentation - The divider has no semantic value and is for visual presentation only. Default: separator	<rapid-divider orientation="vertical">

Properties

This component doesn't have any properties.

Slots

This component doesn't have any slots.

Parts

This component doesn't have any parts.

Events fired

This component doesn't fire any events.

Events listened to

This component doesn't listen to any events.