Skip to content

Rebuild the form editor as one document - #282

Merged
PhilReinking merged 194 commits into
mainfrom
land/bits-274-editor
Oct 13, 2026
Merged

PhilReinking merged 194 commits into
mainfrom
land/bits-274-editor

Conversation

@PhilReinking

@PhilReinking PhilReinking commented Oct 13, 2026 •

Copy link
Copy Markdown
Contributor

Brings the reviewed editor stack into main in one PR: the form as one document, with its outline, type picker, rules in place, live preview and end screen.

Fixes BITS-279, BITS-282, BITS-283, BITS-284, BITS-285, BITS-286, BITS-287, BITS-295

The help text contrast in answer settings (2.4:1) comes from the UI kit and moves to BITS-289.

Heads-up: form owners get a new editor: the whole form in one column instead of the question list and workbench.

Tested: Vitest 504, lint, vue-tsc, build on both merges. By hand at 1440 and 390: load, open/close, add via picker, rule, preview, end screen, duplicate, delete, End screen tab.

Not tested: 1024, touch, screen reader, Safari, Firefox.

Known gap, older than the stack: a new Long text question has no options yet, so the preview logs one options.rows error.

Included PRs and fix commits

All reviewed OK at their heads; #281's last head only adds the merge of #280's reviewed head.

🤖 Generated with Claude Code

PhilReinking and others added 30 commits October 13, 2026 01:04
The question list and the workbench become one column. Each question is a
compact row (number, type icon, text on up to 2 lines, a meta line with
Required, rules, Hidden and the identifier), groups are sections. The open
question is a card in place: text with its format toolbar, choices, then
answer type, Required, Settings (this type's settings inline), Rules and a
menu. A new question opens with the cursor in its text.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Delete and the drag grip showed only on hover, 96 px left of the row and
outside the tab order. Now they sit at the end of the row, always visible;
delete is a named button ("Delete choice “Yes”").

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The toolbar buttons had their name only in a tooltip. They now have an
aria-label, aria-pressed and type="button", in a group named "Text format".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Brings in the duplicate endpoint (#262) and the editor loading states (#263).
The page keeps #263's loading; the document shows its skeleton and error box
instead of loading on its own. The old list (Storyboard.vue) stays removed.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
After Try again loads the questions, the cursor goes into the open
question's text (or onto Add question); when it fails again, back onto Try
again. Before, focus fell to the page. A question load that answers after
the editor closed or switched forms no longer fills the store or opens a
question (which also changed the next page's address). A question opened by
click or added now takes the cursor through one shared value, because its
text editor shows up a moment after the card.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The Configure* parts create the block's interaction when they mount.
Keep QuestionSettings mounted (v-show) so a new Short text, Email,
Number, Long text, File, Rating, Scale or Date question gets its field.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The row's Delete button and Cmd+Backspace now ask the list to delete.
Once the row is gone, focus moves to the row above, the new first row,
or the Add button. A failed delete leaves focus where it was.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…ine-phone

# Conflicts:
#	resources/js/components/Factory/Document/QuestionCard.test.ts
#	resources/js/components/Factory/Document/QuestionCard.vue
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The keyboard helper got the list with the hidden custom answer row, but
row numbers count only the visible choices. Focus after a delete could
land on the hidden row, and Enter on the last choice threw.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Editor gets a bare prop: no border around the toolbar and the text.
The card uses it and drops the word counter.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
One border around the key, the text, the grip and delete. Screen
readers now say "Choice 2" and "Reply for choice 2" instead of the
placeholder "Label".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
PhilReinking and others added 14 commits October 13, 2026 11:55
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…p's name whole

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The preview's form put the cursor in its own field after each move, so
typing in a question just opened went into the preview. In preview mode
the form now never takes the focus on its own.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The public form only goes to an http(s) link. With a mailto: link it
shows the end screen, so the document and the preview now show it too.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
… into feat/bits-295-question-lines

# Conflicts:
#	CHANGELOG.md
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The preview blocked focus all the time, so a keyboard user couldn't try
the form there. It now blocks focus only while its own window isn't
focused: the editor keeps the cursor, and Enter in the preview moves
on to the next question as on the real form.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
On a tablet or phone the preview opens over the document. After a click
into the preview, Esc went to the form there and the panel stayed open.
The form in preview mode now tells the editor about Esc (same origin
both ways, like the other preview messages), and the panel closes with
focus back on the Preview button.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
… into feat/bits-295-question-lines

# Conflicts:
#	CHANGELOG.md
# Conflicts:
#	CHANGELOG.md
#	resources/js/Pages/Forms/Edit.vue

@PhilReinking PhilReinking left a comment

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK at cdb443c, CI green (Vitest 504, PHP 746). The head is #281's ceadf5e plus one merge of main, and #281's last merge of #280 changes only CHANGELOG.md. The main merge takes main's newer version of 7 backend files from #262 and #278, where the stack has nothing of its own, and the stack's version of the other 154 files. Edit.vue keeps the stack's imports: the document's load state replaces main's skeletons. Every changelog line appears once.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

@PhilReinking PhilReinking left a comment

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK at 48d1d0b, CI green. The head merges main 6412370 into the reviewed cdb443c. Main's own commits were all in cdb443c already, so only CHANGELOG.md needed a hand fix: the PR's lines stay, and main's #278 and #269 lines keep main's words and order. Every changelog line appears once. Every other file equals cdb443c, and the diff against main touches only resources/, docs/, .vitepress and CHANGELOG.md.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant