Shim

Separator

Visually separate content with a horizontal or vertical line.

Documentation
React Aria
Pattern
W3C ARIA
Source
GitHub
Issues
Report
Install
pnpm dlx @kkga/shim add separator

Shipping info

1234 Main St, Springfield, USA
import { Link } from "@/shim-ui/link";
import { Separator } from "@/shim-ui/separator";

export default () => (
  <div className="max-w-xs">
    <h3 className="font-semibold text-neutral-text-contrast">Shipping info</h3>
    <span>1234 Main St, Springfield, USA</span>
    <Separator />
    <div className="flex gap-1">
      <Link href="#">Edit address</Link>
      <Separator orientation="vertical" />
      <Link href="#">Edit shipping method</Link>
    </div>
  </div>
);

Install

Use the CLI or copy the source code manually.

pnpm dlx @kkga/shim add separator