Ops
Running and tending the tools around the code: containers and compose files, alerts, audit findings with their score, plugins and rules with switches, a catalogue of skills, install and sign-in steps, editor themes and connected accounts. Rows sit in a List from the data group, so arrow keys, typeahead and selection come from React Aria.
12 pages, 14 exports
- ContainerRow
- ToneDot
- ComposeBar
- AlertRow
- FindingRow
- ScoreBadge
- PluginRow
- RuleRow
- SkillCard
- InstallButton
- InstallDetails
- InstallProgress
- ThemeSwatch
- ConnectionCard
ImportLink to the section Import
Each group has its own entry, so an app that needs only this group loads only this group. Everything is also exported from @skribly/ui.
import { ContainerRow, ToneDot, ComposeBar, AlertRow, … } from '@skribly/ui/ops'Pages in this groupLink to the section Pages in this group
- ContainerRowOne container with its state, image, uptime, ports, usage and actions. Pick it for a list of containers or services; the demo changes state, shows a busy row and confirms with a polite message.ContainerRow
- ToneDotThe state of anything that runs as a small glyph and a word. Pick it inside rows and headers; use the label even where it is hidden.ToneDot
- ComposeBarThe compose files of a project with their commands. One command runs at a time, and Down asks first. Pick it above a list of containers.ComposeBar
- AlertRowA record of an alert that happened, such as a crash or a failed health check, with where and when. Pick it for an alert history; Enter jumps to the source.AlertRow
- FindingRow and ScoreBadgeAudit results: a score out of 100 with its grade, and findings with severity, rule and place that can be picked to send on together. Pick it for security, accessibility or SEO reports.FindingRow, ScoreBadge
- ScoreBadge sizesThree sizes and the three grades. The thresholds can change, for example for a check where 70 is already good.ScoreBadge
- PluginRowAn installed plugin or server with a switch that takes effect at once, its id, version, scope and description. The second list shows the loading state.PluginRow
- RuleRowAn instruction rule with a switch for "always apply", when it applies, its file pattern and description. Pick it for agent or editor rules.RuleRow
- SkillCardOne skill or template in a catalogue grid, with its command, description, category and install state, and a checkbox to pick several.SkillCard
- InstallInstalling or signing in to a tool with one press: the button, the progress with the last line of output and the time, and the command folded away. Try the second button to see a failure.InstallButton, InstallDetails, InstallProgress
- ThemeSwatchAn editor theme drawn as a little editor in its colours, with its name. With onPress it is a toggle for a grid of themes; without it a static preview.ThemeSwatch
- ConnectionCardA connected account or service: who, its state, a quiet detail and actions. Pick it for Git hosts, trackers or any integration settings.ConnectionCard