WordPress / WordPress/pattern-directory

Add Code View to Pattern Creator

Open
#429 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

[Component] Pattern Creator
Dominant language
PHP
Stars
134
Forks
46
Avg merge
9h 4m
Merged PRs (30d)
19

Description

Describe the feature
There have been a number of occasions when building a pattern, that I wanted to copy in pattern code or modify it directly.
It would be nice if we could switch the creator into Code Editor mode and back. For me, it's part of my Gutenberg experience. I frequently work in both views.

Expect to see

Scope
At this moment in time, the <ModeSwitcher> is not an exported component. Gutenberg's edit-site package appears to just have duplicated the code. We could also duplicate or maybe submit a Gutenberg PR to export the component.

https://github.com/WordPress/gutenberg/blob/b7f0444f93572d02ec4106c16561c73f1ff5c494/packages/edit-post/src/components/header/more-menu/index.js#L16

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reading Gutenberg's packages/edit-post/src/components/header/more-menu/index.js at the referenced commit, focusing on the ModeSwitcher component and how edit-site duplicates it. Then inspect the Pattern Creator entry point and determine whether the switch should reuse or export that component. Done means the creator can switch between visual and Code Editor modes and back, with code changes reflected in the pattern.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, wordpress
Domain
frontend, web-dev
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.