Skip to content

feat(editors): expose block_id and action_id behind an Advanced toggle - #172

Merged
StephenTangCook merged 3 commits into
mainfrom
claude/block-advanced-toggle-c441e4
Aug 4, 2026
Merged

feat(editors): expose block_id and action_id behind an Advanced toggle#172
StephenTangCook merged 3 commits into
mainfrom
claude/block-advanced-toggle-c441e4

Conversation

@StephenTangCook

@StephenTangCook StephenTangCook commented Aug 4, 2026

Copy link
Copy Markdown
Contributor

Closes #152.

What

Every block editor now ends with a collapsed ▸ Advanced disclosure holding that block's Block ID. Each button form gets the same disclosure for its Action ID:

  • actions block buttons (actions-editor)
  • section button accessory (section-editor)
  • card action buttons (card-editor, also reused per card by the carousel editor)

Both ids were previously reachable only by hand-editing the JSON drawer, even though the builder generates a random action_id for every button it inserts. Clearing a field drops the key so Slack goes back to generating one.

How

One shared AdvancedIdField in field.tsx, built on a native <details> element. No React state, no icon, no new dependency: the disclosure triangle, the toggle, and the keyboard/screen-reader behavior all come from the browser.

Block ID lives in block-editor.tsx, the single component every context window renders through, so all 19 block types pick it up at once.

Not included

input blocks and context_actions blocks already show their element action_id as a normal visible field. Left alone rather than hidden behind the new toggle, since they already solve the reported problem and demoting them would be a regression in discoverability.

Verification

  • New unit test test/block-editor-advanced.test.tsx covers editing block_id, editing a button action_id, and clearing back to undefined.
  • Full suite green: 331 unit tests, 117 Storybook play tests, typecheck, biome.
  • Checked end to end in the demo app: setting a button's Action ID to approve_request lands in the exported Block Kit JSON.

🤖 Generated with Claude Code


View with [code]smith Autofix with [code]smith
Need help on this PR? Tag @codesmith-bot with what you need. Autofix is disabled.

Closes #152. Every block editor now ends with a collapsed "Advanced"
disclosure holding the block's `block_id`, and each button form (actions
block, section accessory, card actions) gets the same disclosure for its
`action_id`. Both were previously reachable only by hand-editing the JSON
drawer, even though the builder generates a random id for every button.

Native `<details>`, so the open/closed state, the disclosure triangle,
and keyboard behavior come from the browser rather than React state.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
…ion_id

0.1.13 adds the within-a-block duplicate `action_id` check
(TightknitAI/slack-block-kit-validator#66). The Advanced fields in this PR
let people type ids by hand, so collisions the generated nanoid suffixes made
impossible are now one keystroke away, and until this bump nothing flagged
them.

Test covers both directions: duplicates inside one block are reported and
attributed to that block, the same id in two different blocks stays valid
(`state.values` is keyed block_id then action_id).

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

Copy link
Copy Markdown
Contributor Author

Bumped @tightknitai/slack-block-kit-validator to 0.1.13 on this branch, which lands the fix for slack-block-kit-validator#66: duplicate action_id within a block is now flagged. That gap was reachable precisely because this PR makes the field editable, so the two belong together.

Confirmed in the demo. Two buttons sharing action_id: "123" now surface:

Block 1: Buttons
elements[1].action_id must be unique within the block — '123' appears at elements[0] and elements[1]

New test in test/duplicate-ids.test.ts covers both directions: duplicates inside one block are reported and attributed to that block, while the same id in two different blocks stays valid, since state.values is keyed block_id then action_id.

Unrelated to this PR but worth knowing: duplicate block_id on two markdown blocks is still intentionally not flagged, because Slack drops block_id on markdown blocks. On any other block type it errors.

…-toggle-c441e4

# Conflicts:
#	package.json
#	pnpm-lock.yaml
@StephenTangCook
StephenTangCook merged commit d0d0938 into main Aug 4, 2026
14 checks passed
@StephenTangCook
StephenTangCook deleted the claude/block-advanced-toggle-c441e4 branch August 4, 2026 17:48
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.

Expose action ID parameter in UI

1 participant