howtomakeaname/sumi/primitives does not have a README file

    ButtonSize

    pub(all) enum ButtonSize {
    Default
    Sm
    Icon
    IconSm
    } derive(Eq,
    Debug
    )

    ButtonSize::equal

    fn ButtonSize::equal(ButtonSize, ButtonSize) -> Bool

    ButtonSize::not_equal

    fn ButtonSize::not_equal(x : ButtonSize, y : ButtonSize) -> Bool

    ButtonVariant

    pub(all) enum ButtonVariant {
    Primary
    Secondary
    Ghost
    } derive(Eq,
    Debug
    )

    ButtonVariant::equal

    ButtonVariant::not_equal

    fn ButtonVariant::not_equal(x : ButtonVariant, y : ButtonVariant) -> Bool

    TagVariant

    pub(all) enum TagVariant {
    Default
    Brand
    Outline
    } derive(Eq,
    Debug
    )

    TagVariant::equal

    fn TagVariant::equal(TagVariant, TagVariant) -> Bool

    TagVariant::not_equal

    fn TagVariant::not_equal(x : TagVariant, y : TagVariant) -> Bool

    add_tile

    fn add_tile(on_click? :
    Cmd
    , disabled? : Bool, aria_label? : String, id? : String, class? : String, attrs? :
    Attrs
    , style? : Array[String]) ->
    Html

    The 48px "add" tile: a quiet bordered square with a centered plus that opens an upload/picker menu (compose with dropdown_menu as the trigger). Hover raises the fill to the primary block; disabled fades the plus to the disabled text shade.

    dropdown_menu(
    trigger=add_tile(aria_label="Add image"),
    items=[...],
    open=menu_open,
    on_open_change=set_menu_open.map(v => _ => v),
    )

    avatar

    fn avatar(src? : String, fallback? : String, size? : Int, alt? : String, id? : String, class? : String, attrs? :
    Attrs
    , style? : Array[String]) ->
    Html

    A round avatar. Shows the image at src when given, otherwise the first character of fallback on a spotlight fill.

    badge

    fn badge(value? : Int, dot? : Bool, id? : String, class? : String, attrs? :
    Attrs
    , style? : Array[String]) ->
    Html

    A numeric notification badge. Values above 99 render as 99+; pass dot=true for a plain dot.

    button

    fn[C :
    IsChildren
    ] button(variant? : ButtonVariant, size? : ButtonSize, disabled? : Bool, pressed? : Bool, loading? : Bool, type_? : String, id? : String, class? : String, title? : String, name? : String, value? : String, autofocus? : Bool, on_click? :
    Cmd
    , attrs? :
    Attrs
    , style? : Array[String], children : C) ->
    Html

    Render a button in one of the design's three variants.

    • Primary — solid light fill with dark text, the main call to action.
    • Secondary — translucent white fill.
    • Ghost — transparent, fills on hover; the toolbar/menu-button look.

    pressed marks a toggle-style button as the currently active tool: it adds aria-pressed and the design's selected fill (same tone as hover).

    loading=true keeps the default fill and the button's width: the content stays rendered but invisible while a 16px spinner overlays its center, and aria-busy is set; pass a title describing the busy action for screen readers.

    User styles are appended last and therefore override the built-in recipe.

    credits

    fn credits(value~ : Int, original_value? : Int, muted? : Bool, on_click? :
    Cmd
    , id? : String, class? : String, title? : String, attrs? :
    Attrs
    , style? : Array[String]) ->
    Html

    The credit-cost indicator shown inline in toolbars before the primary submit. original_value renders a struck-through pre-discount price. muted=true drops the tone to placeholder strength for frosted input docks, where the indicator is secondary to the composer itself.

    favorite_toggle

    fn favorite_toggle(checked~ : Bool, on_change? :
    Emit
    [Bool], disabled? : Bool, aria_label? : String, id? : String, class? : String, attrs? :
    Attrs
    , style? : Array[String]) ->
    Html

    A bare star button that toggles a favorite on/off: outline star at rest, filled amber star when on. Fully controlled — the caller owns checked. Unlike icon_button it carries no hover plate, matching the design's chrome-less affordance.

    favorite_toggle(
    checked=starred,
    on_change=set_starred.map(v => _ => v),
    )

    icon

    fn icon(path : String, size? : Int, stroke_width? : Int, style? : Array[String]) ->
    Html

    A 24x24 stroke icon rendered as inline SVG. The surrounding span owns accessibility hiding and a stable layout box; color inherits from the parent via currentColor.

    icon_adjust

    fn icon_adjust(size? : Int) ->
    Html

    icon_align_left

    fn icon_align_left(size? : Int) ->
    Html

    Three left-aligned bars, the bottom one short — the generic document placeholder glyph of the attachment tile.

    icon_arrow_down

    fn icon_arrow_down(size? : Int) ->
    Html

    icon_arrow_up

    fn icon_arrow_up(size? : Int) ->
    Html

    icon_button

    fn icon_button(icon :
    Html
    , variant? : ButtonVariant, size? : ButtonSize, disabled? : Bool, pressed? : Bool, id? : String, class? : String, title? : String, aria_label? : String, on_click? :
    Cmd
    , attrs? :
    Attrs
    , style? : Array[String]) ->
    Html

    A square button for a single icon. Convenience wrapper over button with size=Icon/IconSm and variant=Ghost by default.

    icon_caret_down

    fn icon_caret_down(size? : Int) ->
    Html

    Filled rounded caret marking a filter trigger, on a 16 design grid.

    icon_check

    fn icon_check(size? : Int) ->
    Html

    icon_check_fill

    fn icon_check_fill(size? : Int) ->
    Html

    Filled check mark for the outline checkboxes of menu rows. The glyph grid is 12 inside the 16 viewBox (path coordinates scaled by 4/3), so at the default size 12 it reproduces the design's checkbox tick exactly.

    icon_chevron_down

    fn icon_chevron_down(size? : Int) ->
    Html

    icon_chevron_left

    fn icon_chevron_left(size? : Int) ->
    Html

    icon_chevron_right

    fn icon_chevron_right(size? : Int) ->
    Html

    icon_chevron_up

    fn icon_chevron_up(size? : Int) ->
    Html

    icon_clock

    fn icon_clock(size? : Int) ->
    Html

    icon_close_circle

    fn icon_close_circle(size? : Int) ->
    Html

    Filled circle with a times cutout — the clear affordance of a filtered trigger. The glyph grid is 13.333 inside the 16 viewBox, which reproduces the design's 8.33% inset exactly at size 16.

    icon_crop

    fn icon_crop(size? : Int) ->
    Html

    icon_download

    fn icon_download(size? : Int) ->
    Html

    icon_expand

    fn icon_expand(size? : Int) ->
    Html

    icon_folder

    fn icon_folder(size? : Int) ->
    Html

    Folder outline — the pick-from-library menu row's glyph.

    icon_grid

    fn icon_grid(size? : Int) ->
    Html

    icon_image

    fn icon_image(size? : Int) ->
    Html

    icon_important

    fn icon_important(size? : Int) ->
    Html

    Exclamation in a circle, used for inline validation and status notes.

    icon_info_circle_fill

    fn icon_info_circle_fill(size? : Int, style? : Array[String]) ->
    Html

    Filled disc with an "i" cutout — the partial-failure state of async work.

    icon_layers

    fn icon_layers(size? : Int) ->
    Html

    icon_minus

    fn icon_minus(size? : Int) ->
    Html

    icon_more

    fn icon_more(size? : Int) ->
    Html

    icon_play

    fn icon_play(size? : Int) ->
    Html

    icon_plus

    fn icon_plus(size? : Int) ->
    Html

    icon_plus_fill

    fn icon_plus_fill(size? : Int) ->
    Html

    Rounded filled plus on the 16 grid — the add tile's glyph.

    icon_ratio

    fn icon_ratio(width~ : Int, height~ : Int, size? : Int) ->
    Html

    An aspect-ratio artwork icon: a centered rectangle outline drawn at the given ratio inside the icon box (ratio pickers in size panels).

    icon_reset

    fn icon_reset(size? : Int) ->
    Html

    icon_scissors

    fn icon_scissors(size? : Int) ->
    Html

    fn icon_search(size? : Int) ->
    Html

    icon_slash

    fn icon_slash(size? : Int) ->
    Html

    Slanted bar separating pagination numbers — a filled glyph on a 9.333x14 design grid, sized by height (the width follows the glyph's ratio).

    icon_sparkle

    fn icon_sparkle(size? : Int) ->
    Html

    icon_star

    fn icon_star(size? : Int) ->
    Html

    Star outline on the 16 grid — the favorite toggle's off state.

    icon_star_fill

    fn icon_star_fill(size? : Int) ->
    Html

    Filled star — the favorite toggle's on state.

    icon_target

    fn icon_target(size? : Int) ->
    Html

    Crosshair — the pick-from-canvas menu row's glyph.

    icon_tick_circle_fill

    fn icon_tick_circle_fill(size? : Int, style? : Array[String]) ->
    Html

    Filled disc with a tick cutout — the completion state of async work.

    icon_upload

    fn icon_upload(size? : Int) ->
    Html

    icon_upload_fill

    fn icon_upload_fill(size? : Int) ->
    Html

    Filled upload arrow over a baseline — the upload menu row's glyph.

    icon_x

    icon_x_fill

    fn icon_x_fill(size? : Int) ->
    Html

    Filled times mark, weighted to stay legible at 4px — the glyph of the attachment tile's remove badge. (The stroked icon_x renders too thin at that size.)

    kbd

    fn kbd(key : String, id? : String, class? : String, attrs? :
    Attrs
    , style? : Array[String]) ->
    Html

    A keyboard key hint, e.g. for shortcut labels in menus and tooltips.

    spinner

    fn spinner(size? : Int, id? : String, class? : String, style? : Array[String]) ->
    Html

    An indeterminate loading spinner. Rotation comes from the interaction sheet emitted by theme and respects prefers-reduced-motion.

    tag

    A small status/category label. Pass on_remove to render a removable tag with a trailing close icon.