🥮 mooncakes.io
    Sign in

    howtomakeaname/sumi/primitives does not have a README file

    ButtonSize

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

    ButtonSize::equal

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

    ButtonSize::not_equal

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

    ButtonSize::to_repr

    source

    ButtonVariant

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

    ButtonVariant::equal

    source

    ButtonVariant::not_equal

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

    ButtonVariant::to_repr

    source

    MediaTagKind

    source
    pub(all) enum MediaTagKind {
      Image
      Video
      Audio
      Text
      Group
      Timeline
      Element
    } derive(Eq)

    What an inline reference points at. Image and Video can carry a thumbnail; every kind falls back to its own glyph when no thumbnail is given (or the state is Empty).

    MediaTagKind::equal

    source

    MediaTagKind::not_equal

    source
    fn MediaTagKind::not_equal(x : MediaTagKind, y : MediaTagKind) -> Bool

    MediaTagState

    source
    pub(all) enum MediaTagState {
      Ready
      Candidate
      Uploading
      Generating
      Failed
      Empty
    } derive(Eq)

    Lifecycle of the referenced content: Candidate is a half-transparent suggestion, Uploading dims the thumbnail under a spinner, Generating swaps the visual for a spinner, Failed shows the warning disc, and Empty forces the placeholder glyph even when a thumbnail exists.

    MediaTagState::equal

    source

    MediaTagState::not_equal

    source
    fn MediaTagState::not_equal(x : MediaTagState, y : MediaTagState) -> Bool

    MediaTagVariant

    source
    pub(all) enum MediaTagVariant {
      Block
      Inline
    } derive(Eq)

    Block is the filled chip used inside conversation bubbles; Inline is the transparent variant that sits inside the composer input.

    MediaTagVariant::equal

    source

    MediaTagVariant::not_equal

    source
    fn MediaTagVariant::not_equal(x : MediaTagVariant, y : MediaTagVariant) -> Bool

    ResultChipSize

    source
    pub(all) enum ResultChipSize {
      Small
      Medium
    } derive(Eq)

    The two label treatments of a result_chip.

    • Small — 13/19.5 tertiary label over a 6px backdrop blur; floats on generated imagery
    • Medium — 14/24 secondary label; sits in a chat result row

    ResultChipSize::equal

    source

    ResultChipSize::not_equal

    source
    fn ResultChipSize::not_equal(x : ResultChipSize, y : ResultChipSize) -> Bool

    TagVariant

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

    TagVariant::equal

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

    TagVariant::not_equal

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

    TagVariant::to_repr

    source

    add_tile

    source
    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

    source
    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

    source
    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

    source
    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

    source
    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

    source
    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

    source
    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

    source
    fn icon_adjust(size? : Int) -> 
    Html

    icon_adjust_fill

    source
    fn icon_adjust_fill(size? : Int) -> 
    Html

    Filled adjustment sliders on a 14 grid — the settings affordance of input toolbars. (The stroked icon_adjust reads too thin at 14px.)

    icon_align_left

    source
    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

    source
    fn icon_arrow_down(size? : Int) -> 
    Html

    icon_arrow_up

    source
    fn icon_arrow_up(size? : Int) -> 
    Html

    icon_arrow_up_fill

    source
    fn icon_arrow_up_fill(size? : Int) -> 
    Html

    Filled up-arrow on a 16 grid — the send button's glyph. (The stroked icon_arrow_up reads too thin on the solid circular fill.)

    icon_at

    source
    fn icon_at(size? : Int) -> 
    Html

    At-sign on a 14 grid — the reference-mention affordance of input toolbars.

    icon_button

    source
    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

    source
    fn icon_caret_down(size? : Int) -> 
    Html

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

    icon_chat_history

    source
    fn icon_chat_history(size? : Int) -> 
    Html

    List lines with a clock on a 16 grid — the session-history affordance of session headers.

    icon_check

    source
    fn icon_check(size? : Int) -> 
    Html

    icon_check_fill

    source
    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_check_fill_large

    source
    fn icon_check_fill_large(size? : Int) -> 
    Html

    Large filled check on a 16 grid — the selected-row indicator of session lists. (icon_check_fill is the smaller 12-grid checkbox tick.)

    icon_chevron_down

    source
    fn icon_chevron_down(size? : Int) -> 
    Html

    icon_chevron_down_fill

    source
    fn icon_chevron_down_fill(size? : Int) -> 
    Html

    Chunky filled chevron-down on a 14 grid — the expanded status row's affordance.

    icon_chevron_left

    source
    fn icon_chevron_left(size? : Int) -> 
    Html

    icon_chevron_right

    source
    fn icon_chevron_right(size? : Int) -> 
    Html

    icon_chevron_right_fill

    source
    fn icon_chevron_right_fill(size? : Int) -> 
    Html

    Chunky filled chevron-right on a 14 grid — the collapsed status row's affordance.

    icon_chevron_up

    source
    fn icon_chevron_up(size? : Int) -> 
    Html

    icon_chevron_up_fill

    source
    fn icon_chevron_up_fill(size? : Int) -> 
    Html

    Chunky filled chevron-up on a 14 grid — the collapse toggle's glyph. (The stroked icon_chevron_up reads too thin at this size.)

    icon_clock

    source
    fn icon_clock(size? : Int) -> 
    Html

    icon_close_circle

    source
    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_copy

    source
    fn icon_copy(size? : Int) -> 
    Html

    Two overlapping rounded frames — the copy-to-clipboard action glyph.

    icon_crop

    source
    fn icon_crop(size? : Int) -> 
    Html

    icon_delete

    source
    fn icon_delete(size? : Int) -> 
    Html

    Trash can on a 16 grid — the delete affordance of hoverable list rows.

    icon_download

    source
    fn icon_download(size? : Int) -> 
    Html

    icon_draw

    source
    fn icon_draw(size? : Int) -> 
    Html

    Pencil with a stroke trail on a 16 grid — the canvas-work glyph of tool rows.

    icon_edit

    source
    fn icon_edit(size? : Int) -> 
    Html

    Pencil with an underline on a 16 grid — the rename affordance of hoverable list rows.

    icon_element

    source
    fn icon_element(size? : Int) -> 
    Html

    Figure inside a frame — the single-element reference glyph.

    icon_expand

    source
    fn icon_expand(size? : Int) -> 
    Html

    icon_folder

    source
    fn icon_folder(size? : Int) -> 
    Html

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

    icon_fullscreen_alt

    source
    fn icon_fullscreen_alt(size? : Int) -> 
    Html

    Diagonal corner arrows on a 16 grid — the collapse/expand affordance of session headers.

    icon_grid

    source
    fn icon_grid(size? : Int) -> 
    Html

    icon_group

    source
    fn icon_group(size? : Int) -> 
    Html

    Shape nodes pinned to a selection frame — the grouped-reference glyph.

    icon_image

    source
    fn icon_image(size? : Int) -> 
    Html

    icon_image_fill

    source
    fn icon_image_fill(size? : Int) -> 
    Html

    Filled landscape with a sun — the placeholder glyph of an image reference that has no thumbnail yet.

    icon_important

    source
    fn icon_important(size? : Int) -> 
    Html

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

    icon_info_circle_fill

    source
    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

    source
    fn icon_layers(size? : Int) -> 
    Html

    icon_minus

    source
    fn icon_minus(size? : Int) -> 
    Html

    icon_more

    source
    fn icon_more(size? : Int) -> 
    Html

    icon_new_conversation

    source
    fn icon_new_conversation(size? : Int) -> 
    Html

    Speech bubble with a plus on a 16 grid — the new-conversation affordance of session headers.

    icon_play

    source
    fn icon_play(size? : Int) -> 
    Html

    icon_plus

    source
    fn icon_plus(size? : Int) -> 
    Html

    icon_plus_fill

    source
    fn icon_plus_fill(size? : Int) -> 
    Html

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

    icon_ratio

    source
    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

    source
    fn icon_reset(size? : Int) -> 
    Html

    icon_scissors

    source
    fn icon_scissors(size? : Int) -> 
    Html

    fn icon_search(size? : Int) -> 
    Html

    icon_skill

    source
    fn icon_skill(size? : Int) -> 
    Html

    Magic wand with a sparkle on a 16 grid — the skill affordance of input toolbars and skill chips.

    icon_slash

    source
    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_sound

    source
    fn icon_sound(size? : Int) -> 
    Html

    Four waveform bars — the audio reference glyph.

    icon_sparkle

    source
    fn icon_sparkle(size? : Int) -> 
    Html

    icon_sparkle_fill

    source
    fn icon_sparkle_fill(size? : Int) -> 
    Html

    Filled four-point star on a 16 grid — the credit-cost glyph of generation rows and confirm buttons. Color inherits via currentColor.

    icon_star

    source
    fn icon_star(size? : Int) -> 
    Html

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

    icon_star_fill

    source
    fn icon_star_fill(size? : Int) -> 
    Html

    Filled star — the favorite toggle's on state.

    icon_stop_fill

    source
    fn icon_stop_fill(size? : Int) -> 
    Html

    Filled rounded square on a 16 grid — the stop-generating glyph that replaces the send arrow while a run is in flight.

    icon_target

    source
    fn icon_target(size? : Int) -> 
    Html

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

    icon_text

    source
    fn icon_text(size? : Int) -> 
    Html

    Serif-like capital T — the text reference glyph.

    icon_tick_circle_fill

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

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

    icon_timeline

    source
    fn icon_timeline(size? : Int) -> 
    Html

    Frame split into a header strip and column cells — the timeline reference glyph.

    icon_upload

    source
    fn icon_upload(size? : Int) -> 
    Html

    icon_upload_fill

    source
    fn icon_upload_fill(size? : Int) -> 
    Html

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

    icon_video

    source
    fn icon_video(size? : Int) -> 
    Html

    Rounded frame with a play triangle — the video reference glyph.

    icon_x

    source

    icon_x_fill

    source
    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

    source
    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.

    media_tag

    source
    fn media_tag(kind~ : MediaTagKind, label? : String, state? : MediaTagState, variant? : MediaTagVariant, thumbnail? : String, on_click? : 
    Cmd    , aria_label? : String, id? : String, class? : String, attrs? : 
    Attrs    , style? : Array[String]) -> 
    Html

    A compact inline reference to a piece of content — the "Image" / "Video" chip that prefixes a conversation bubble or sits inside the composer input. Purely presentational unless on_click is given, in which case it renders as a button and brightens on hover.

    media_tag(kind=Image, thumbnail=thumb_url)
    media_tag(kind=Video, state=Generating)
    media_tag(kind=Audio, variant=Inline, state=Candidate)

    result_chip

    source
    fn result_chip(label~ : String, thumbnail? : String, size? : ResultChipSize, aria_label? : String, id? : String, class? : String, attrs? : 
    Attrs    , style? : Array[String]) -> 
    Html

    A 24px rich-text reference tag of generation results: a rounded block fill holding a 16px rounded thumbnail and a short label. Small blurs the backdrop (6px) for floating over imagery; Medium drops the blur and steps the label up to 14/24 secondary for inline chat rows.

    result_chip(label="Harbor Dusk", thumbnail=ref_url)
    result_chip(label="Image", thumbnail=ref_url, size=Medium)

    spinner

    source
    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

    source

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

    Source Files

    Powered by MoonBit

    Site sourceReport issuePackagesBuild queueSkillsStatistics

    © 2026 mooncakes.io