Update Component
curl --request PUT \
--url https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id} \
--header 'Content-Type: application/json' \
--data '
{
"name": "<string>",
"content": "<string>",
"collectionId": "<string>",
"metadata": {
"metadata.tags": [
"<string>"
]
}
}
'import requests
url = "https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}"
payload = {
"name": "<string>",
"content": "<string>",
"collectionId": "<string>",
"metadata": { "metadata.tags": ["<string>"] }
}
headers = {"Content-Type": "application/json"}
response = requests.put(url, json=payload, headers=headers)
print(response.text)const options = {
method: 'PUT',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({
name: '<string>',
content: '<string>',
collectionId: '<string>',
metadata: {'metadata.tags': ['<string>']}
})
};
fetch('https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}', options)
.then(res => res.json())
.then(res => console.log(res))
.catch(err => console.error(err));<?php
$curl = curl_init();
curl_setopt_array($curl, [
CURLOPT_URL => "https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}",
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => "",
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 30,
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => "PUT",
CURLOPT_POSTFIELDS => json_encode([
'name' => '<string>',
'content' => '<string>',
'collectionId' => '<string>',
'metadata' => [
'metadata.tags' => [
'<string>'
]
]
]),
CURLOPT_HTTPHEADER => [
"Content-Type: application/json"
],
]);
$response = curl_exec($curl);
$err = curl_error($curl);
curl_close($curl);
if ($err) {
echo "cURL Error #:" . $err;
} else {
echo $response;
}package main
import (
"fmt"
"strings"
"net/http"
"io"
)
func main() {
url := "https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}"
payload := strings.NewReader("{\n \"name\": \"<string>\",\n \"content\": \"<string>\",\n \"collectionId\": \"<string>\",\n \"metadata\": {\n \"metadata.tags\": [\n \"<string>\"\n ]\n }\n}")
req, _ := http.NewRequest("PUT", url, payload)
req.Header.Add("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)
defer res.Body.Close()
body, _ := io.ReadAll(res.Body)
fmt.Println(string(body))
}HttpResponse<String> response = Unirest.put("https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}")
.header("Content-Type", "application/json")
.body("{\n \"name\": \"<string>\",\n \"content\": \"<string>\",\n \"collectionId\": \"<string>\",\n \"metadata\": {\n \"metadata.tags\": [\n \"<string>\"\n ]\n }\n}")
.asString();require 'uri'
require 'net/http'
url = URI("https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}")
http = Net::HTTP.new(url.host, url.port)
http.use_ssl = true
request = Net::HTTP::Put.new(url)
request["Content-Type"] = 'application/json'
request.body = "{\n \"name\": \"<string>\",\n \"content\": \"<string>\",\n \"collectionId\": \"<string>\",\n \"metadata\": {\n \"metadata.tags\": [\n \"<string>\"\n ]\n }\n}"
response = http.request(request)
puts response.read_bodyComponents
Update Component
Update an existing component
PUT
/
app
/
v1
/
organizations
/
{organizationId}
/
projects
/
{projectId}
/
components
/
{id}
Update Component
curl --request PUT \
--url https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id} \
--header 'Content-Type: application/json' \
--data '
{
"name": "<string>",
"content": "<string>",
"collectionId": "<string>",
"metadata": {
"metadata.tags": [
"<string>"
]
}
}
'import requests
url = "https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}"
payload = {
"name": "<string>",
"content": "<string>",
"collectionId": "<string>",
"metadata": { "metadata.tags": ["<string>"] }
}
headers = {"Content-Type": "application/json"}
response = requests.put(url, json=payload, headers=headers)
print(response.text)const options = {
method: 'PUT',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({
name: '<string>',
content: '<string>',
collectionId: '<string>',
metadata: {'metadata.tags': ['<string>']}
})
};
fetch('https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}', options)
.then(res => res.json())
.then(res => console.log(res))
.catch(err => console.error(err));<?php
$curl = curl_init();
curl_setopt_array($curl, [
CURLOPT_URL => "https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}",
CURLOPT_RETURNTRANSFER => true,
CURLOPT_ENCODING => "",
CURLOPT_MAXREDIRS => 10,
CURLOPT_TIMEOUT => 30,
CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
CURLOPT_CUSTOMREQUEST => "PUT",
CURLOPT_POSTFIELDS => json_encode([
'name' => '<string>',
'content' => '<string>',
'collectionId' => '<string>',
'metadata' => [
'metadata.tags' => [
'<string>'
]
]
]),
CURLOPT_HTTPHEADER => [
"Content-Type: application/json"
],
]);
$response = curl_exec($curl);
$err = curl_error($curl);
curl_close($curl);
if ($err) {
echo "cURL Error #:" . $err;
} else {
echo $response;
}package main
import (
"fmt"
"strings"
"net/http"
"io"
)
func main() {
url := "https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}"
payload := strings.NewReader("{\n \"name\": \"<string>\",\n \"content\": \"<string>\",\n \"collectionId\": \"<string>\",\n \"metadata\": {\n \"metadata.tags\": [\n \"<string>\"\n ]\n }\n}")
req, _ := http.NewRequest("PUT", url, payload)
req.Header.Add("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)
defer res.Body.Close()
body, _ := io.ReadAll(res.Body)
fmt.Println(string(body))
}HttpResponse<String> response = Unirest.put("https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}")
.header("Content-Type", "application/json")
.body("{\n \"name\": \"<string>\",\n \"content\": \"<string>\",\n \"collectionId\": \"<string>\",\n \"metadata\": {\n \"metadata.tags\": [\n \"<string>\"\n ]\n }\n}")
.asString();require 'uri'
require 'net/http'
url = URI("https://api.example.com/app/v1/organizations/{organizationId}/projects/{projectId}/components/{id}")
http = Net::HTTP.new(url.host, url.port)
http.use_ssl = true
request = Net::HTTP::Put.new(url)
request["Content-Type"] = 'application/json'
request.body = "{\n \"name\": \"<string>\",\n \"content\": \"<string>\",\n \"collectionId\": \"<string>\",\n \"metadata\": {\n \"metadata.tags\": [\n \"<string>\"\n ]\n }\n}"
response = http.request(request)
puts response.read_bodyPath Parameters
Organization ID
Project ID
Component ID
Request Body
All fields are optional. Only provided fields will be updated.Updated component name
Updated component source code (TypeScript)
Move to different collection (null for root)
Example Request
{
"content": "const metadata = () => ({\n title: 'Product Card',\n description: 'Updated description'\n});\n\nconst body = (props: ComponentProps) => {...};",
"metadata": {
"tags": ["product", "card", "updated"]
}
}
When updating a published component, its status changes to
modified. The TypeScript code in content is automatically recompiled.Response
Returns the updated Component object.{
"id": "c123",
"name": "ProductCard",
"title": "Product Card",
"description": "Updated description",
"type": "view",
"status": "modified",
"version": null,
"lastPublishedVersion": 2,
"content": "...",
"compiled": "...",
"schema": {...},
"metadata": {
"tags": ["product", "card", "updated"]
},
"createdAt": "2024-03-20T10:00:00Z",
"updatedAt": "2024-03-22T09:15:00Z"
}
Error Responses
Not Found
{
"error": {
"code": "NOT_FOUND",
"message": "Component c123 was not found"
}
}
Validation Failed
{
"error": {
"code": "BAD_REQUEST",
"message": "Validation failed",
"details": {}
}
}
Code Examples
curl -X PUT "https://api.metabind.ai/app/v1/organizations/org123/projects/proj456/components/c123" \
-H "Authorization: Bearer YOUR_JWT" \
-H "Content-Type: application/json" \
-d '{
"metadata": {
"tags": ["product", "card", "featured"]
}
}'
const response = await fetch(
'https://api.metabind.ai/app/v1/organizations/org123/projects/proj456/components/c123',
{
method: 'PUT',
headers: {
'Authorization': 'Bearer YOUR_JWT',
'Content-Type': 'application/json'
},
body: JSON.stringify({
content: `
const metadata = () => ({ title: 'Updated Card' });
const body = (props) => Text(props.title);
`
})
}
);
const component = await response.json();
⌘I