Elements

Elements in HTML have attributes; these are additional values that configure the elements or adjust their behavior in various ways to meet the criteria the users want.

Element Object

An element object is made up of properties that include HTML element attributes as well as the following `special` Stellify specific properties:

Properties

  • Name
    uuid
    Type
    string
    Description

    Unique identifier for the element.

  • Name
    children
    Type
    array
    Description

    References child element uuids.

  • Name
    type
    Type
    string
    Description

    The element type as explained here in our documentation.

  • Name
    text
    Type
    string
    Description

    The text displayed within the tags.

  • Name
    parent
    Type
    string
    Description

    A reference to the uuid of the parent element (when the element is a child of another element).

  • Name
    parentRoute
    Type
    string
    Description

    A reference to the uuid of the parent route (when the element is a child of pages root element).

  • Name
    created_at
    Type
    timestamp
    Description

    Timestamp of when the element was created.

  • Name
    updated_at
    Type
    timestamp
    Description

    Timestamp of when the element was last updated.


GET/v1/element/:id

Retrieve Element

This endpoint allows you to retrieve an element for a given uuid.

Request

GET
/v1/element
curl -G https://api.stellify.com/v1/element/a5f240aa-73e1-4466-af79-ba2c5a064bd2 \
  -H "Authorization: Bearer {token}" 


import ApiClient from '@stellisoft/js-api-client'

const client = new ApiClient(token)

await client.element.get('a5f240aa-73e1-4466-af79-ba2c5a064bd2')
from stellify_api import ApiClient

client = ApiClient(token)

client.element.get('a5f240aa-73e1-4466-af79-ba2c5a064bd2')
$client = new \Stellify\ApiClient($token);

$client->element->get('a5f240aa-73e1-4466-af79-ba2c5a064bd2');

Response

{
    "uuid": "a5f240aa-73e1-4466-af79-ba2c5a064bd2",
    "type": "s-layout",
    "tag": "div",
    "classes": [],
    "routeParent": "480c8f3b-5da1-49e0-8ab0-b88cbef2b306"
}

POST/v1/element

Create Element

This endpoint allows you to create a new element and attach it to either a page or another element.

Required attributes

  • Name
    type
    Type
    string
    Description

    The element type.

Elective attributes

  • Name
    page_id
    Type
    string
    Description

    The page to which the element should be attached.

  • Name
    parent
    Type
    string
    Description

    The element to which you wish attach the new element.

Request

POST
/v1/element
curl https://api.stellify.com/v1/element \
  -H "Authorization: Bearer {token}" \
  -d type="s-layout" \
  -d page_id="480c8f3b-5da1-49e0-8ab0-b88cbef2b306" 
import ApiClient from '@stellisoft/js-api-client'

const client = new ApiClient(token)

await client.element.create({
  type: 's-layout',
  page_id: '480c8f3b-5da1-49e0-8ab0-b88cbef2b306',
})
from stellify_api import ApiClient

client = ApiClient(token)

client.element.create(
  type="s-layout",
  page_id="480c8f3b-5da1-49e0-8ab0-b88cbef2b306",
)
$client = new \Stellify\ApiClient($token);

$client->element->create([
  'type' => 's-layout',
  'page_id' => '480c8f3b-5da1-49e0-8ab0-b88cbef2b306',
]);

Response

{
    "uuid": "a5f240aa-73e1-4466-af79-ba2c5a064bd2",
    "type": "s-layout",
    "tag": "div",
    "classes": [],
    "routeParent": "480c8f3b-5da1-49e0-8ab0-b88cbef2b306"
}

PUT/v1/element/:id

Update Element

This endpoint allows you to perform an update on an element.

Required attributes

  • Name
    Request JSON Body
    Type
    object
    Description

    The element object properties properties as set out above.

Request

PUT
/v1/element/a5f240aa-73e1-4466-af79-ba2c5a064bd2
curl -X PUT https://api.stellify.com/v1/element/a5f240aa-73e1-4466-af79-ba2c5a064bd2 \
  -H "Authorization: Bearer {token}" \
  -H "Content-Type: application/json" \
  -d "{\"uuid\":\"a5f240aa-73e1-4466-af79-ba2c5a064bd2\",\"type\":\"s-layout\",\"tag\":\"div\",\"classes\":[\"m-4\"],\"routeParent\":\"480c8f3b-5da1-49e0-8ab0-b88cbef2b306\"}"
import ApiClient from '@stellisoft/js-api-client'

const client = new ApiClient(token)

await client.element.update('a5f240aa-73e1-4466-af79-ba2c5a064bd2', {
    "uuid": "a5f240aa-73e1-4466-af79-ba2c5a064bd2",
    "type": "s-layout",
    "tag": "div",
    "classes": ["m-4"],
    "routeParent": "480c8f3b-5da1-49e0-8ab0-b88cbef2b306"
});
from stellify_api import ApiClient

client = ApiClient(token)

client.element.update("a5f240aa-73e1-4466-af79-ba2c5a064bd2",
{\"uuid\":\"a5f240aa-73e1-4466-af79-ba2c5a064bd2\",\"type\":\"s-layout\",\"tag\":\"div\",\"classes\":[\"m-4\"],\"routeParent\":\"480c8f3b-5da1-49e0-8ab0-b88cbef2b306\"})
$client = new \Stellify\ApiClient($token);

$client->element->update('a5f240aa-73e1-4466-af79-ba2c5a064bd2, [
      "uuid" => "a5f240aa-73e1-4466-af79-ba2c5a064bd2",
      "type" => "s-layout",
      "tag" => "div",
      "classes" => ["m-4"],
      "routeParent" => "480c8f3b-5da1-49e0-8ab0-b88cbef2b306"
]);

Response

{
    "uuid": "a5f240aa-73e1-4466-af79-ba2c5a064bd2",
    "type": "s-layout",
    "tag": "div",
    "classes": ["m-4"],
    "routeParent": "480c8f3b-5da1-49e0-8ab0-b88cbef2b306"
}

DELETE/v1/element/:id

Delete Element

This endpoint allows you to delete an element and its descendants.

Request

DELETE
/v1/element/a5f240aa-73e1-4466-af79-ba2c5a064bd2
curl -X DELETE https://api.stellify.com/v1/element/a5f240aa-73e1-4466-af79-ba2c5a064bd2 \
  -H "Authorization: Bearer {token}"
import ApiClient from '@stellisoft/js-api-client'

const client = new ApiClient(token)

await client.messages.delete('a5f240aa-73e1-4466-af79-ba2c5a064bd2')
from stellify_api import ApiClient

client = ApiClient(token)

client.element.delete("a5f240aa-73e1-4466-af79-ba2c5a064bd2")
$client = new \Stellify\ApiClient($token);

$client->element->delete('a5f240aa-73e1-4466-af79-ba2c5a064bd2');

POST/v1/element/duplicate

Duplicate Element

This endpoint allows you to duplicate an element and any descendants it may have. You must elect either a page or a parent element to which the duplicated root element will be attached.

Required attributes

  • Name
    uuid
    Type
    string
    Description

    The uuid of element you wish to duplicate.

Elective attributes

  • Name
    page_id
    Type
    string
    Description

    The page to which the root element should be attached.

  • Name
    parent
    Type
    string
    Description

    The element to which you wish attach the duplicated root element.

Request

POST
/v1/element
curl https://api.stellify.com/v1/element \
  -H "Authorization: Bearer {token}" \
  -d uuid="a5f240aa-73e1-4466-af79-ba2c5a064bd2" \
  -d page_id="480c8f3b-5da1-49e0-8ab0-b88cbef2b306" 
import ApiClient from '@stellisoft/js-api-client'

const client = new ApiClient(token)

await client.element.create({
  uuid: 'a5f240aa-73e1-4466-af79-ba2c5a064bd2',
  page_id: '480c8f3b-5da1-49e0-8ab0-b88cbef2b306',
})
from stellify_api import ApiClient

client = ApiClient(token)

client.element.create(
  uuid="a5f240aa-73e1-4466-af79-ba2c5a064bd2",
  page_id="480c8f3b-5da1-49e0-8ab0-b88cbef2b306",
)
$client = new \Stellify\ApiClient($token);

$client->element->create([
  'uuid' => 'a5f240aa-73e1-4466-af79-ba2c5a064bd2',
  'page_id' => '480c8f3b-5da1-49e0-8ab0-b88cbef2b306',
]);

Response

{
   "root": "a2b828c5-d6f5-40b2-8b4a-fab5115e7585"
   "elements": [{
      "uuid": "a2b828c5-d6f5-40b2-8b4a-fab5115e7585",
      "type": "s-layout",
      "tag": "div",
      "classes": [],
      "routeParent": "480c8f3b-5da1-49e0-8ab0-b88cbef2b306"
   }]
}

Please be aware that our API documentation is under construction.