Open each core value as a card of meaning and signals steps #98

Merged
an.di merged 2 commits from adilallo/fix/CR-280-values-step into main 2026-11-06 05:18:04 +00:00
Member

Overview

The Values step now matches the current Overlay / Modal / Card frames. A group picks up to six values, or skips the step. Each value opens a card with a meaning row and a signals row; each row opens its own step with an empty field and Generate draft. A picked value opens filled, with Deselect, Cancel, and Save. Customize no longer leaves helper text in the description box.

Changes

  • Values screen copy: “Pick what your community holds most dear or add your own.” Counter reads “N of 6 picked”. Seventh pick is blocked with no visible note
  • Ghost Skip for now sits left of Confirm values. Confirm stays off at zero picks and turns on at one. Skip does not clear picks already made
  • ValueDialog is the Overlay / Modal / Card for select and final review: meaning and signals rows, then Cancel + Add to Rule (pending) or Deselect + Cancel + Save (editing)
  • Each step is one question. The field starts empty and focused, with Generate draft and “See our first draft for this value”. After a draft or typed text, Generate draft hides and the filled hint shows
  • Cancel, overlay, Escape, and X on a step return to the card. The same controls on the card close the dialog. Primary on a step still saves
  • Customize / Duplicate stay on the card kebab. Customize step 2 opens with an empty description; Next on an empty box saves no description
  • Modal footer can show a trailing Cancel next to Next. Create and MultiSelect count caption follow that pattern
  • Shared by the values select screen and final-review chip edit

Screenshots

Drop in the five shots from Desktop / values-screenshots:

  • 01-select.png — title, add your own, chips, 0 of 6 picked
  • 02-empty-dialog.png — Accessibility card, Step 1 / Step 2, Cancel + Add to Rule
  • 03-meaning-empty.png — empty meaning step, focused field, Generate draft
  • 04-meaning-filled.png — catalog copy in the field, filled hint, no Generate draft
  • 05-picked-dialog.png — green check on meaning, Deselect + Cancel + Save

How to Test

  1. Run the app locally and open /create/core-values.
  2. Confirm the title, “add your own”, “0 of 6 picked”, Skip for now, and Confirm values off.
  3. Click a chip. The card should show meaning and signals rows, Cancel, and Add to Rule. Close with Cancel, X, overlay, or Escape — the chip should unselect.
  4. Open a chip again, open the meaning row. The field should be empty, focused, with Generate draft. Generate draft should fill catalog copy and swap in the filled hint.
  5. Add to Rule. Reopen the chip: meaning should show a green check, footer Deselect / Cancel / Save. Deselect should put the chip back as unselected.
  6. Skip for now with nothing picked should go on to communication methods. Skip with picks should keep those picks.
  7. Pick six values; a seventh chip should not add. Confirm values should work at one or more.
  8. On a card, kebab → Customize. Step 2 (description) should be empty at 0/200, with Next enabled. Next on empty should save no description.
  9. Reach final review with a value and edit the chip — same card, same steps.
  10. After opening a step, Escape once returns to the card; Escape again closes.

Notes

  • Meaning and signals are both optional. A value with no signals is still allowed here; review will flag that later, including the chip warning icon.
  • Value families stay in the copy file only. Picking is still the full chip cloud, with no filter.
  • Figma greys Confirm at one pick as the default disabled variant. Product here: Confirm is enabled at one or more.
  • The six-of-six limit message stays screen-reader only.
  • Generate draft keeps that label. Empty field vs filled hint is the empty-vs-prefilled split.
  • Figma’s empty and picked cards omit the kebab; Customize and Duplicate still live on the card kebab so they stay reachable.
  • Description-optional on Customize step 2 is on the shared method-card wizard, so other Customize flows get the same empty-box Next.
## Overview The Values step now matches the current Overlay / Modal / Card frames. A group picks up to six values, or skips the step. Each value opens a card with a meaning row and a signals row; each row opens its own step with an empty field and Generate draft. A picked value opens filled, with Deselect, Cancel, and Save. Customize no longer leaves helper text in the description box. ## Changes - Values screen copy: “Pick what your community holds most dear or add your own.” Counter reads “N of 6 picked”. Seventh pick is blocked with no visible note - Ghost **Skip for now** sits left of **Confirm values**. Confirm stays off at zero picks and turns on at one. Skip does not clear picks already made - `ValueDialog` is the Overlay / Modal / Card for select and final review: meaning and signals rows, then Cancel + Add to Rule (pending) or Deselect + Cancel + Save (editing) - Each step is one question. The field starts empty and focused, with Generate draft and “See our first draft for this value”. After a draft or typed text, Generate draft hides and the filled hint shows - Cancel, overlay, Escape, and X on a step return to the card. The same controls on the card close the dialog. Primary on a step still saves - Customize / Duplicate stay on the card kebab. Customize step 2 opens with an empty description; Next on an empty box saves no description - Modal footer can show a trailing Cancel next to Next. Create and MultiSelect count caption follow that pattern - Shared by the values select screen and final-review chip edit ## Screenshots Drop in the five shots from Desktop / values-screenshots: - `01-select.png` — title, add your own, chips, 0 of 6 picked - `02-empty-dialog.png` — Accessibility card, Step 1 / Step 2, Cancel + Add to Rule - `03-meaning-empty.png` — empty meaning step, focused field, Generate draft - `04-meaning-filled.png` — catalog copy in the field, filled hint, no Generate draft - `05-picked-dialog.png` — green check on meaning, Deselect + Cancel + Save ## How to Test 1. Run the app locally and open `/create/core-values`. 2. Confirm the title, “add your own”, “0 of 6 picked”, Skip for now, and Confirm values off. 3. Click a chip. The card should show meaning and signals rows, Cancel, and Add to Rule. Close with Cancel, X, overlay, or Escape — the chip should unselect. 4. Open a chip again, open the meaning row. The field should be empty, focused, with Generate draft. Generate draft should fill catalog copy and swap in the filled hint. 5. Add to Rule. Reopen the chip: meaning should show a green check, footer Deselect / Cancel / Save. Deselect should put the chip back as unselected. 6. Skip for now with nothing picked should go on to communication methods. Skip with picks should keep those picks. 7. Pick six values; a seventh chip should not add. Confirm values should work at one or more. 8. On a card, kebab → Customize. Step 2 (description) should be empty at 0/200, with Next enabled. Next on empty should save no description. 9. Reach final review with a value and edit the chip — same card, same steps. 10. After opening a step, Escape once returns to the card; Escape again closes. ## Notes - Meaning and signals are both optional. A value with no signals is still allowed here; review will flag that later, including the chip warning icon. - Value families stay in the copy file only. Picking is still the full chip cloud, with no filter. - Figma greys Confirm at one pick as the default disabled variant. Product here: Confirm is enabled at one or more. - The six-of-six limit message stays screen-reader only. - Generate draft keeps that label. Empty field vs filled hint is the empty-vs-prefilled split. - Figma’s empty and picked cards omit the kebab; Customize and Duplicate still live on the card kebab so they stay reachable. - Description-optional on Customize step 2 is on the shared method-card wizard, so other Customize flows get the same empty-box Next.
an.di added 1 commit 2026-11-06 04:58:13 +00:00
an.di self-assigned this 2026-11-06 04:58:18 +00:00
an.di added 1 commit 2026-11-06 05:17:00 +00:00
an.di merged commit dea7dd7fbd into main 2026-11-06 05:18:04 +00:00
an.di deleted branch adilallo/fix/CR-280-values-step 2026-11-06 05:18:04 +00:00
Sign in to join this conversation.
No Reviewers
No labels
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: CommunityRule/community-rule#98