blocks/app-status-bar

Import

Import

import * as api from "@fungi.computer/caps/blocks/app-status-bar";

Exports

Kind	Export	Description
Ttype alias	AppStatusBarProps	Props accepted by AppStatusBar.
Ttype alias	StatusBarPickerOption	One choice a status bar picker offers.
Ttype alias	StatusBarPickerProps	Props accepted by StatusBarPicker.
Ttype alias	StatusBarChipProps	Props accepted by StatusBarChip.
constconstant	StatusBarChip	One App-declared status bar control (an action, a toggle or a menu trigger): a flat chip with the same quiet face as StatusBarPicker. It forwards its ref and props, so a menu can render it as its trigger.
fnfunction	AppStatusBar()	One App window’s status bar: its attachment first, then the App’s own readouts, with an optional far-end readout. One bar per window.
fnfunction	AppStatusItem()	One quiet status readout.
fnfunction	StatusBarPicker()	The status bar’s attachment picker: a quiet label that opens a searchable list above the bar. Selection is a request; the caller owns the change.

AppStatusBarPropsTtype alias

Signature

type AppStatusBarProps = HTMLAttributes<HTMLElement> & object;

Props accepted by AppStatusBar.

Type Declaration

Name	Type	Description
attachment?	ReactNode	What this window is attached to: a StatusBarPicker, or a plain AppStatusItem when it cannot be changed. Every App keeps it first.
end?	ReactNode	Readouts held at the far end, such as save state.

---

StatusBarPickerOptionTtype alias

Signature

type StatusBarPickerOption = Readonly<{
  id: string;
  label: string;
}>;

One choice a status bar picker offers.

---

StatusBarPickerPropsTtype alias

Signature

type StatusBarPickerProps = object;

Props accepted by StatusBarPicker.

Properties

noun

Signature

noun: string;

What is picked, e.g. “Computer”; the trigger is named “<noun>: <label>”.

pluralNoun

Signature

pluralNoun: string;

The plural used for searching, e.g. “Computers”.

icon

Signature

icon: ReactNode;

The picked thing’s mark, shown before its label.

options

Signature

options: readonly StatusBarPickerOption[];

value

Signature

value: string | null;

The selected option id; null when nothing is attached.

onSelect

Signature

onSelect: (id) => void;

Called with a different option’s id.

Parameters

Parameter	Type
id	string

Returns

void

emptyMessage?

Signature

optional emptyMessage?: ReactNode;

Shown when the list is empty, e.g. why nothing can be chosen.

accessibleLabel?

Signature

optional accessibleLabel?: string;

The trigger’s accessible name; defaults to “<noun>: <label>”.

disabled?

Signature

optional disabled?: boolean;

open?

Signature

optional open?: boolean;

Host-owned popup visibility; omitted for the ordinary trigger-owned picker.

onOpenChange?

Signature

optional onOpenChange?: (open) => void;

Reports popup dismissal or trigger activation to the host.

Parameters

Parameter	Type
open	boolean

Returns

void

---

StatusBarChipPropsTtype alias

Signature

type StatusBarChipProps = Omit<
  ButtonHTMLAttributes<HTMLButtonElement>,
  "children"
> &
  object;

Props accepted by StatusBarChip.

Type Declaration

Name	Type	Description
label	ReactNode	Visible name of the item, e.g. “Ports”.
icon?	ReactNode	Decorative mark before the label; on a phone the chip shows it alone.
readout?	ReactNode	A readout after the label, such as a CountBadge.
pressed?	boolean	Toggle state. undefined is an ordinary action; a boolean adds aria-pressed and fills the chip while on.
expanded?	boolean	Disclosure state for a chip that opens a menu or panel. A boolean adds aria-expanded and fills the chip while open.

StatusBarChipconstconstant

Signature

const StatusBarChip: ForwardRefExoticComponent<
  Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> &
    object &
    RefAttributes<HTMLButtonElement>
>;

One App-declared status bar control (an action, a toggle or a menu trigger): a flat chip with the same quiet face as StatusBarPicker. It forwards its ref and props, so a menu can render it as its trigger.

AppStatusBar()fnfunction

Signature

function AppStatusBar(__namedParameters): Element;

One App window’s status bar: its attachment first, then the App’s own readouts, with an optional far-end readout. One bar per window.

Parameters

Parameter	Type
__namedParameters	AppStatusBarProps

Returns

Element

---

AppStatusItem()fnfunction

Signature

function AppStatusItem(__namedParameters): Element;

One quiet status readout.

Parameters

Parameter	Type
__namedParameters	HTMLAttributes<HTMLSpanElement>

Returns

Element

---

StatusBarPicker()fnfunction

Signature

function StatusBarPicker(__namedParameters): Element;

The status bar’s attachment picker: a quiet label that opens a searchable list above the bar. Selection is a request; the caller owns the change.

Parameters

Parameter	Type
__namedParameters	StatusBarPickerProps

Returns

Element