Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@sanity/visual-editing

Package Overview
Dependencies
Maintainers
44
Versions
167
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@sanity/visual-editing - npm Package Compare versions

Comparing version 0.0.0 to 1.0.0

CHANGELOG.md

11

package.json
{
"name": "@sanity/visual-editing",
"version": "0.0.0",
"version": "1.0.0",
"keywords": [
"sanity.io",
"visual-editing",
"presentation",
"preview",
"overlays"
],
"homepage": "https://github.com/sanity-io/visual-editing/tree/main/packages/visual-editing#readme",

@@ -116,3 +123,3 @@ "bugs": {

"@sanity/visual-editing-helpers": "0.2.6",
"@types/react": "^18.2.51",
"@types/react": "^18.2.53",
"@types/react-dom": "^18.2.18",

@@ -119,0 +126,0 @@ "@typescript-eslint/eslint-plugin": "^6.20.0",

@@ -1,2 +0,2 @@

# @sanity/visual-editing — Visual Editing
# @sanity/visual-editing

@@ -26,3 +26,3 @@ [![npm stat](https://img.shields.io/npm/dm/@sanity/visual-editing.svg?style=flat-square)](https://npm-stat.com/charts.html?package=@sanity/visual-editing)

useEffect(() => {
const disable = enableVisualEditing({})
const disable = enableVisualEditing({)
return () => disable()

@@ -35,4 +35,30 @@ }, [])

## Manually configuring "Edit in Sanity Studio" elements
### `data-sanity-edit-target`
You can choose which element to render the "Edit in Sanity Studio" buttons on by adding a `data-sanity-edit-target` attribute to the element you want to be clickable. This allows you to move the edit container to a parent wrapper element.
In this example, by default the edit button would be placed on the `<h1>` tag
```html
<section>
<h1>{dynamicTitle}</h1>
<div>Hardcoded Tagline</div>
</section>
```
But by adding the `data-sanity-edit-target` attribute to the `<section>` tag, the edit button will be placed on it instead.
```html
<section data-sanity-edit-target>
<h1>{dynamicTitle}</h1>
<div>Hardcoded Tagline</div>
</section>
```
Manually setting the edit target will use the first element it finds with encoded metadata and remove clickable buttons from all other child elements.
[gzip-badge]: https://img.shields.io/bundlephobia/minzip/@sanity/visual-editing?label=gzip%20size&style=flat-square
[size-badge]: https://img.shields.io/bundlephobia/min/@sanity/visual-editing?label=size&style=flat-square
[bundlephobia]: https://bundlephobia.com/package/@sanity/visual-editing
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc