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
string
required
Organization ID
string
required
Project ID
string
required
Component ID
Request Body
All fields are optional. Only provided fields will be updated.string
Updated component name
string
Updated component source code (TypeScript)
string
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();