Skip to content

moooon

Motir

Vibe your whole project. Bring an idea — Motir's three AI layers plan it, track it, and ship it, end to end. You're looking at Motir, built in Motir.

  • Vibe Project
  • Open Source
  • AI Agent
  • AI Loop
1
requests
0
upvotes
145
planned
1,361
shipped

Motir · Work items

MOTIR-226Done

4.3.1 Design — estimation surfaces: inline-editable estimate badge + scale picker, epic roll-up badge, sprint committed-points roll-up (backlog header), project Estimation settings panel (NEW design/estimation/)

Estimate: 46m

The design asset EVERY UI subtask of this story builds against. The estimation surfaces are unspecified — design/ has the backlog row estimate slot + the sprint committed-points slot + the board .pts chip drawn only as RESERVED dashed seams / a static chip (never the click-to-edit picker), the issue detail draws only the TIME Estimate (not story points), and there is no epic roll-up badge and no project Estimation settings panel. Whole elements unspecified == NO design under the gate, so this subtask CREATES it FIRST (mirrors 1.0.5 / 1.2.1 / 1.3.3 / 1.5.1 / 4.2.1). Output: a NEW area design/estimation/ with estimation.mock.html (the badge + picker + roll-up displays across surfaces) + estimation-settings.mock.html (the project Estimation settings panel) + PNG exports + design/estimation/design-notes.md naming every composing primitive, copy string, and placement. Built from the real design system (components/ui/* + the --el-* tokens + element shape tokens — no Pencil→code gap); --el-* only (no Tier-0 --color-*); shape via the element shape tokens; AA-safe; the Jira story-point field + board Estimation settings as the mirror.

This surface REUSES existing vocabularies — reference, don't redraw. The estimate badge reuses the chip/Pill vocabulary + the backlog row (4.2.1) + the board card .pts chip (design/boards/) + the issue-detail core-fields rail (design/work-items/detail.pen); the settings panel reuses the project-settings page chrome + FormField / Segmented / the settings-card pattern (settings/project/board + workflow). Draw the NET-NEW: the click-to-edit picker, the roll-up badges, and the Estimation settings form.

Specify, panel by panel (estimation.mock.html):

  • Estimate badge — display states — the chip showing the configured statistic (a story-point value, e.g. 5; the muted / empty-slot when unestimated), in the FIXED slot the 4.2 backlog row reserved (so 4.3 drops it in with no relayout), and on the board card (the .pts chip, mono) + the list row + the issue-detail rail. Show it is the SAME component across surfaces.
  • Estimate picker — edit state — the click-to-edit popover: the configured scale deck as quick-pick chips (Fibonacci default — 1,2,3,5,8,13,21,…), a free numeric input (decimals allowed), a Clear action, and the keyboard affordance. Draw the popover anchored to the badge on a backlog row AND in the detail rail.
  • Issue-detail story-points field — the rail field, DISTINCT from the existing TIME Estimate (clock glyph) field — a hash/points glyph + the value + the inline picker. Specify where it sits in the core-fields rail (design/work-items/detail.pen).
  • Epic roll-up badge — the rolled-up subtree total on an epic (and any parent), e.g. Story Points · 34 or a 34 pts summary, on the issue detail header/rail AND the list/tree parent row. Distinct from the parent's OWN estimate (a roll-up of descendants).
  • Sprint committed-points roll-up — the figure that FILLS the Story-4.2 sprint-container committed-points slot (the dashed seam design/backlog/design-notes.md reserved): the committed (and the seam for completed / remaining) points in the sprint header. Match the 4.2.1 slot placement so it drops in with no relayout. Note its relationship to the scrum header's fuller points summary (Story 4.5 draws the scrum variant).
  • Degradation + states — unestimated issue (muted , never NaN); unestimated sprint/epic ( roll-up); the badge in a read-only (no-permission) state.

Specify (estimation-settings.mock.html):

  • Project Estimation settings panel (settings/project/estimation) — the settings page chrome + a card with: the estimation statistic selector (Story Points default · Time estimate · Issue count — a Segmented or radio group), the point scale selector (Fibonacci · linear · custom), the custom-scale editor (an editable list of numeric values, shown only when scale = custom), helper copy explaining each, and the Save affordance. Plus the settings-hub nav card entry (sibling of Board + Workflow). Admin-only state. Mirror Jira board Estimation settings.

Acceptance criteria

  • A NEW design/estimation/ area exists with estimation.mock.html + estimation-settings.mock.html + PNG export(s) + design/estimation/design-notes.md; built from components/ui/* + --el-*/element-shape tokens only (no Tier-0 --color-*, no raw rounded-*/p-* for control shape), passing the render checklist (icon viewBox, no nested buttons, prettier), AA-safe.
  • estimation.mock.html draws: the estimate badge display states (with the unestimated ), the click-to-edit picker (scale-deck quick chips + free numeric + clear), the issue-detail story-points field (distinct from the time Estimate), the epic roll-up badge (subtree total), the sprint committed-points roll-up filling the 4.2 sprint-header slot, and the degradation/read-only states.
  • estimation-settings.mock.html draws the project Estimation settings panel (statistic selector + scale selector + custom-scale editor + helper copy + Save) and the settings-hub nav-card entry; admin-only.
  • design-notes.md names each composing primitive (Pill/chip, the picker popover primitive, FormField, Segmented, the settings card, the backlog row, the detail rail) AND documents: the badge fills the Story-4.2 estimate slot + committed-points slot (with no relayout), the statistic switch (Story Points default), the project-scoped-config justified deviation, and that rollupForSprint is the reusable aggregate Story 4.5.2 consumes for its scrum SprintSummaryDto.points.
  • The asset REUSES (references, does not redraw) the backlog row, the board .pts chip, the detail rail, and the settings-page chrome; it specifies only the net-new picker + roll-up badges + settings form.

Context refs

  • design/backlog/backlog.mock.html + design-notes.md (the row estimate slot + the sprint committed-points slot this fills — named "filled by Story 4.3") — match the reserved slot placement
  • design/boards/design-notes.md (the card .pts chip) + design/boards/scrum.mock.html (the scrum sprint-header points summary 4.5 draws) — the chip + points vocabulary to align with
  • design/work-items/detail.pen + design/work-items/design-notes.md (the core-fields rail with the TIME Estimate field) — where the story-points field + epic roll-up sit
  • app/(authed)/settings/project/board + workflow + design/projects/ — the settings-page chrome + settings-card + nav-card pattern the Estimation panel mirrors
  • components/ui/* (Pill, FormField, Segmented, the menu/popover primitive, Button) + app/globals.css --el-* + element-shape tokens; the /tokens specimen route
  • The Jira story-point field + board Estimation settings (statistic + scale) as the mirror; findings #57 (bounded roll-ups), #35 (read as text), #54 (use the palette)