@metreeca/tile
    Preparing search index...

    Module visuals

    Visual tokens.

    Says how the widgets in an area are to appear, so the area settles them in one place instead of every widget in it repeating the same value, and a widget asking for something of its own still gets it.

    What they settle — the visual register a widget is written in, which is a property of the area rather than of any one widget: look today, how loud a widget appears, told in weight, rule and room and never in colour. A register another attribute names is added here as the attribute earns one.

    What they never settle — what a widget means. A meaning belongs to the one widget that carries it, a control saying what activating it will do and a notice what the system found, so it is stated at the widget and inherited by nothing. An area that quietens its controls therefore leaves each of them saying what it says.

    Who wins — a widget stating an attribute of its own answers to that and reads none of this, so a token settles only the widgets that state nothing. A toolbar assigning subtle quietens the controls it holds without touching the one control in it that asked to be loud.

    How a widget reads one — through a style query, which matches on the value a custom property holds on an enclosing element, there being no other way for a rule to branch on a value. These inherit, so every element is inside a matching container and no rule declares a container of its own:

    @container style(--tile--look: subtle) {
    tile-button:not([look]) > button {
    border-style: none;
    }
    }

    A style query matches one value at a time, so a widget carries a branch per value, and the attribute has to be absent for the token to have a say, which is what a widget rendering it only where it was asked for leaves open.

    Where one is assigned — anywhere: on the root element, to set the register a whole interface is written in, or on a toolbar, a panel or a table cell, to settle one area of it. An app assigns it through the published contract rather than as a literal string, as it assigns any other token.

    visuals

    The custom property behind every visual token.