Svelte 5 component · machines-ui · Frame

FrameRule

A horizontal dashed rule that spans the frame, for separating sections inside a FrameBody.

All components Source

Install

FrameRule is a Svelte 5 ASCII frame rule component in @fractaldesign/machines-ui. It works in SvelteKit and in any Svelte 5 app.

pnpm add @fractaldesign/machines-ui

Import

import

import '@fractaldesign/machines-ui/style.css';
import { FrameRule } from '@fractaldesign/machines-ui';

Usage

Example

<Frame title="RULE">
  <FrameBody>
    <p>Above the rule</p>
    <FrameRule />
    <p>Below the rule</p>
  </FrameBody>
</Frame>

Props

Name	Type	Default
`class`	`string`	`''`

GraphArrow Dashed arrow between flow nodes. `stretch` spans the available row.GraphTick One glyph on a GraphTrack: flexes to fill, stays 1ch wide, centered.GraphTrack Horizontal track that spans the frame.ButtonMachine A button drawn as a dashed frame with the label set in a block of the current accent.ButtonMachineOutline The quiet cousin of `ButtonMachine`: the same dashed frame with no block behind the label.Frame The dashed character frame every graph sits inside: a caption on the top edge, corner glyphs, and optional…