{"id":15704938,"url":"https://github.com/aduth/wp-block","last_synced_at":"2025-05-12T17:14:57.447Z","repository":{"id":66273622,"uuid":"80647392","full_name":"aduth/wp-block","owner":"aduth","description":"Post editor blocks support for WordPress","archived":false,"fork":false,"pushed_at":"2017-02-01T17:56:49.000Z","size":3,"stargazers_count":6,"open_issues_count":3,"forks_count":0,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-05-12T17:14:52.201Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aduth.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-02-01T17:56:47.000Z","updated_at":"2023-11-02T18:50:56.000Z","dependencies_parsed_at":null,"dependency_job_id":"7497b6f7-be15-4644-a7bd-95fd2c562f28","html_url":"https://github.com/aduth/wp-block","commit_stats":{"total_commits":1,"total_committers":1,"mean_commits":1.0,"dds":0.0,"last_synced_commit":"8b219db539bef62e54c8a2757bc17de88943f434"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aduth%2Fwp-block","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aduth%2Fwp-block/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aduth%2Fwp-block/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aduth%2Fwp-block/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aduth","download_url":"https://codeload.github.com/aduth/wp-block/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253785009,"owners_count":21963903,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-03T20:14:20.275Z","updated_at":"2025-05-12T17:14:57.427Z","avatar_url":"https://github.com/aduth.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"WP Block\n========\n\nA prototype infrastructure for rendering and managing blocks within the WordPress post editor.\n\n## Background\n\nWordPress already includes a base implementation for blocks in [`wp.mce.View`](https://github.com/WordPress/WordPress/blob/master/wp-includes/js/mce-view.js) and its corresponding [`wpview` TinyMCE plugin](https://github.com/WordPress/WordPress/blob/master/wp-includes/js/tinymce/plugins/wpview/plugin.js). These are already used in displaying, amongst other things, galleries and embeds.\n\nBlocks seeks to extend this base, expanding upon it with conventions and conveniences specifically targeting plugin authors seeking to implement their own editable content blocks.\n\nThe blocks implementation was guided by the following set of requirements:\n\n- Blocks may embed or be informed by non-visual data\n- A block should include UIs both for its front-end visual representation and its editor form\n- It should be easy to serialize back and forth between front-end and editor representations\n\nFor more background, refer also to Make WordPress Core posts on the topic:\n\n- [_Editor Technical Overview_ by Matias Ventura](https://make.wordpress.org/core/2017/01/17/editor-technical-overview/)\n- [_What Are Little Blocks Made Of?_ by Joen Asmussen](https://make.wordpress.org/design/2017/01/25/what-are-little-blocks-made-of/)\n\n## Usage\n\nWhen depending on the registered `wp-blocks` script, a new global is made available to register editor blocks: `wp.blocks.register`. When registering a new block, provide both a name and set of options defining its expected expected behavior.\n\n```js\nblocks.register( 'map-block/map', {\n\ttitle: 'Map',\n\tdescription: 'Embed a map from OpenStreetMaps',\n\tform: function( attributes, state ) {\n\t\t// ...\n\t},\n\tdisplay: function( attributes ) {\n\t\t// ...\n\t},\n\tvalidateAttributes: function( attributes ) {\n\t\t// ...\n\t},\n\tencodeAttributes: function( attributes ) {\n\t\t// ...\n\t}\n} );\n```\n\nFor a complete example, refer to the [Map Block](https://github.com/aduth/wp-map-block) prototype plugin as the \"dream code\" implementation upon which these APIs were derived.\n\nIn HTML, a block may end up looking like:\n\n```html\n\u003c!-- wp:map-block/map {\"query\":\"Cincinnati\",\"bbox\":\"-84.7123899%2C39.0520565%2C-84.3687783%2C39.2210368\"} --\u003e\n\u003ciframe class=\"map-block\" src=\"https://www.openstreetmap.org/export/embed.html?bbox=-84.7123899%2C39.0520565%2C-84.3687783%2C39.2210368\" width=\"425\" height=\"350\" frameborder=\"0\" scrolling=\"no\"\u003e\u003c/iframe\u003e\n\u003c!-- /wp --\u003e\n```\n\n## Options\n\n`title`\n\nLocalized string to be shown in the editor when given the choice to insert a new block.\n\n`description`\n\nShort localized string describing the block to be inserted.\n\n`form`\n\nFunction which, when passed a set of attributes and object of state helpers, is expected to return either an HTML markup string or instance of [wp.element](https://github.com/aduth/wp-elements).\n\nThis should represent the form to be shown in editor that a user is expected to manipulate.\n\nState helpers includes `setAttributes` and `replaceAttributes` which respectively partially and completely update the attributes of a block.\n\n`display`\n\nFunction which, when passed a set of attributes, is expected to return either an HTML markup string or instance of [wp.element](https://github.com/aduth/wp-elements).\n\nThis should represent the front-end display of the block to be saved in post content alongside encoded attributes of the block.\n\n`validateAttributes`\n\nSimilar to [Backbone's `model.validate`](http://backbonejs.org/#Model-validate), this function is passed the set of block attributes prior to save and should throw an error if the current attribute state of the block should not be saveable.\n\n`encodeAttributes`\n\nFunction which, when passed a set of attributes for the block, should return an object to be encoded in the saved data markup. This can be useful in cases where only a subset of block attributes need to be encoded.\n\nBy default this is an identity object; in other words, all attributes are encoded.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faduth%2Fwp-block","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faduth%2Fwp-block","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faduth%2Fwp-block/lists"}