@metreeca/tile
    Preparing search index...

    Module @metreeca/tile-hive - v0.3.0

    @metreeca/tile-hive

    npm

    Preact layouts and containers for @metreeca/tile interfaces.

    A consumer assembles a screen from the arrangements an app repeats: pages, tables, accordions, panes, grids and stacks that answer where things sit, and takes from here the element the screen is rendered into. A layout places the widgets handed to it without knowing what they mean, so an arrangement is replaced without touching what the interface does.

    A container need not place anything. One may instead settle how the widgets it encloses appear, retuning the design system over an area so a toolbar, a panel or a whole screen is written in a single register rather than every widget in it repeating the same value, and a widget asking for something of its own still getting it. Another sets them on a box of its own, padded, rounded, lifted and painted from the design system, so a card, a panel or a well needs no rule written for it.

    Styling is structural only: what an arrangement needs to work, with the values behind colour, type and spacing left to @metreeca/tile or to whoever styles the app.

    Installation

    npm install preact               # peer dependency
    npm install @metreeca/tile-hive # this package
    Warning

    TypeScript consumers must use "moduleResolution": "nodenext"/"node16"/"bundler" in tsconfig.json. The legacy "node" resolver is not supported.

    Usage

    Note

    This section introduces essential concepts; for complete coverage, see the API reference.

    {TBD: usage overview and examples}

    Support

    • open an issue to report a problem or to suggest a new feature
    • start a discussion to ask a how-to question or to share an idea

    License

    This project is licensed under the Apache 2.0 License – see LICENSE file for details.

    box

    Styled box.

    index

    Preact layouts and containers.

    shell

    Shell.

    stack

    Vertical stack.

    strip

    Horizontal strip.

    style

    Styled area.

    tabs.core

    Headless tabs.

    tabs

    Tabbed panel.