Skip to content

Port ACF's _acf-copyable.js for click-to-copy field keys on list tables #508

Description

@ockham

What

On the Field Groups / Post Types / Taxonomies / Options Pages list tables, the Key column (.column-acf-key) has no copy affordance in SCF. Upstream wraps the key in a .copyable span and handles click-to-copy from a dedicated assets/src/js/_acf-copyable.js, which SCF has never ported — SCF only has the field-group editor copyable (in _field-group-field.js), which works fine and is unrelated.

Why now

#506 synced the sass partials from ACF 6.8.5, so the list-table copyable CSS (_list-table.scss: hover copy icon, green check on .copied) already ships — it's inert until the JS creates the .copyable markup. Porting the JS completes the feature with zero further CSS work.

Where upstream has it

Free ACF repo, tag 6.8.5, assets/src/js/_acf-copyable.js: an acf.Model that gates on the relevant pagenow screens, wraps .column-acf-key contents, and handles the copy click (including the copy-unsupported fallback for non-secure contexts). Check how upstream enqueues it (bundle entry vs standalone) and mirror that in SCF's build.

Acceptance

Hovering a key in the list-table Key column shows the copy icon; clicking copies the key and swaps to the green check, matching the existing editor behavior.

Found while reviewing #506 (the "Copyable field keys" family of its CSS delta is currently inert).

🤖 Generated with Claude Code

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions