fractalsvelte mascot fractalsvelte fractalsvelte
fractalsvelte mascot fractalsvelte fractalsvelte

Svelte 5 component · machines-ui · Frame

GraphTick

One glyph on a GraphTrack: flexes to fill, stays 1ch wide, centered.

All components Source

Install

GraphTick is a Svelte 5 ASCII tick 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 { GraphTick } from '@fractaldesign/machines-ui';

Usage

Example 
<GraphTrack>
  <GraphTick>█</GraphTick>
  <GraphTick>░</GraphTick>
</GraphTrack>

Props

NameTypeDefault
class string ''
children Snippet Content rendered inside the component.—

Snippets

NameTypeDefault
default unknown —

Related components

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…FrameBody The content region inside a graph frame, with optional compact spacing for dense layouts.FrameRule A horizontal dashed rule that spans the frame, for separating sections inside a FrameBody.