Skip to content
Frauthy Brand
Frauthy index

Go anywhere.

    No exact contract found. Try a component family, product name, prop, or keyboard key.

    ↑↓ move↵ openesc close

    04 · Actions & collections

    beta

    ButtonGroup

    Labels and arranges a related set of native buttons without replacing their individual behavior.

    Since
    1.0.0-next.0
    Owner
    Brand Core
    Export
    PRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/ButtonGroup
    Release
    Documentation version
    Deterministic fixture · default state

    Component studio

    light · comfortable · LTR

    Deterministic state: ready · no request is sent

    §01

    Contract

    Semantics first

    Anatomy

    Renders role=group by default; callers may supply a more specific role and should label the group when its purpose is not obvious.

    Consumer classes, styles, and data attributes may extend the surface, but required roles, IDs, relationships, and handlers remain owned by the component.

    Keyboard

    • Tab visits each enabled button in normal order.
    • Buttons retain their own Enter and Space behavior; the group does not install roving focus.
    §02

    Public surface

    API & styling

    Props

    id
    Explicit IDs override stable generated IDs.
    class / style
    Consumer additions compose with required styles.
    ref
    Element or callback where focus control is expected.
    children
    Typed content; raw HTML strings are never rendered.

    Slots & events

    children
    Primary content slot.
    onChange
    Typed value plus a small reason object when state changes.
    native events
    Composed without overwriting required handlers.

    State attributes

    • data-fui-button-group
    • data-orientation
    • data-attached

    CSS tokens

    • --fui-button-group-gap
    • --fui-button-group-border
    §03

    Consumption

    Solid, Vite & Astro

    Solid / VitePRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/ButtonGroup
    import ButtonGroup from 'PRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/ButtonGroup';
    
    <ButtonGroup>Frauthy content</ButtonGroup>
    Astrostatic
    ---
    import ButtonGroup from 'PRIVATE_BETA_PACKAGE_COORDINATE_REDACTED/ButtonGroup';
    ---
    
    <ButtonGroup>Frauthy content</ButtonGroup>
    §04

    Verification

    Evidence record

    Scheduled

    Automated

    Batch C action coverage verifies orientation, attached styling, default/consumer role, class composition, and children.

    Target
    Brand 1.0.0-next.0 matrix
    Last verified
    Pending integrated G2 run
    Required

    Assistive technology

    No widget-specific AT pass required; labelled-group output receives a screen-reader spot check in form fixtures.

    Desktop
    VoiceOver/Safari · NVDA/Firefox
    Touch
    Required for touch-centric behavior
    Open

    Known issues

    • Attached styling does not create a single composite tab stop; each child remains independently focusable.
    §05

    Editorial guidance

    Do / don’t

    Do

    Use for a small set of actions that share one visible purpose.

    Don’t

    Do not imply mutual exclusivity with styling alone; use an appropriate selection pattern.

    Release activity

    ButtonGroup · Brand Core

    1 recorded change · 26 weeks
    1. 1.0.0-next.3

      Baseline public component contract.

    Version & provenance

    New in the v2 architecture

    There is no stable predecessor for this explicit compiled subpath. The v1 compatibility layer remains tested separately; visual and API diffs begin with the next prerelease.

    Current
    1.0.0-next.0
    Previous
    compatibility surface
    Deprecation
    none
    Replacement
    not applicable
    Next in Actions & collectionsDisclosure