Extension SDK Preview

The Extension SDK enables you to create custom logic that can be run inside Editor, Dashboard and Cloud Worker. It provides easy to use but powerful methods to query, mutate, draw, interact, compute or export a layout.

WARNING

This is a preview version. Breaking changes are to be expected.

Extensions can provide their own UI, rely on dialogs or run as headless scripts.

Check the Setup guide on how to work locally and deploy your first extension.

HostApi

This is the main interface for extensions allowing you to run commands that are executed by the host.

import { createHostConnection } from '@archilogic/extension-sdk'

const hostApi = createHostConnection()

const meetingRooms = await hostApi.getSpaces({
  where: { program: { eq: 'meet' }, seatCapacity: { gte: 4, lte: 6 } }
})

Lifecycle events

Hosts EditorDashboardCloud Worker

On initialization you can register event handlers for various events

const hostApi = createHostConnection({
  onConnect: ({ floorMetaData }) => {},
  onLayoutChange: ({ operations }) => {},
  onSelectionChange: ({ selectedNodes }) => {},
  onCanvasClick: ({ position }) => {},
  onDestroy: () => {}
})

Queries

Hosts EditorDashboardCloud Worker

Query methods have powerful filter options similar to the GraphQL API.

Get elements

Query elements with the getElements method by various properties and optionally select the shape of the returned objects.

const largeWindows = await hostApi.getElements({
  where: { type: 'element:window', dimensions: { length: { gte: 3 } } }
})

Get element by id

Retrieve specific properties from an element with getElementById

const { dimensions, boundingBox } = await hostApi.getElementById({
  id: '<asset-id>',
  select: { boundingBox: true, dimensions: true }
})

Get spaces

Query spaces with the getSpaces method by various properties and optionally select the shape of the returned objects.

const spaces = await hostApi.getSpaces({
  where: { seatCapacity: { gte: 5 } }
})

Get space by id

Retrieve specific properties from a space with getSpaceById

const { labelPoint, polygons, elements } = await hostApi.getSpaceById({
  id: '<space-id>',
  select: { labelPoint: true, polygons: true, elements: true }
})

Get products

Query products with the getProducts method by various properties and optionally select the shape of the returned objects.

const chairCounts = await hostApi.getProducts({
  select: { id: true, count: true },
  where: { subCategory: 'taskChair' }
})

Operations

Hosts EditorCloud Worker

Make changes to the layout, like adjusting space meta data or placing assets inside a space. This interface mirrors the operations endpoint.

Create

Create elements in the layout.

await hostApi.runOperations({
  operations: [
    {
      type: 'operation:elementCreate',
      value: {
        type: 'element:asset',
        position: [-2, 0, 3],
        rotation: 45,
        product: '<product-id>'
      }
    }
  ]
})

Update

Update the layout by changing node's properties or creating/removing nodes.

Like the custom attributes of a space.

await hostApi.runOperations({
  operations: [
    {
      type: 'operation:spaceUpdate',
      id: '<space-id>',
      value: { customAttributes: { isBooked: true } }
    }
  ]
})

Delete

Update the layout by changing node's properties or creating/removing nodes.

await hostApi.runOperations({
  operations: [
    {
      type: 'operation:elementRemove',
      id: '<element-id>'
    }
  ]
})

Drawing

Hosts EditorDashboardCloud Worker

Add plan layer

const layerRef = await hostApi.addPlanLayer({ id: 'my-layer' })

Add plan graphics

const layerRef = await hostApi.addPlanGraphic({
  shapes: [
    {
      type: 'curve:circle',
      radius: 1,
      position: [1, 0]
    }
  ],
  layerId: 'my-layer'
})

Set plan config

await hostApi.setPlanConfig({
  theme: {
    byFilter: [
      {
        where: { customAttributes: { isBooked: { eq: true } } },
        fill: '#FF8800'
      },
      {
        where: { customAttributes: { isBooked: { eq: false } } },
        fill: '#00FF88'
      }
    ]
  }
})

Interact

Hosts EditorDashboard

Zoom to node

await hostApi.zoomToNode({ nodeId: <space-id> })

Zoom extents

await hostApi.zoomExtents({ margin: 2, animate: true })

Select nodes

await hostApi.selectNodes({ nodeIds: ['<space-1>'] })

Dialogs Coming soon

Hosts EditorDashboard

Confirm

const isConfirmed = await hostApi.confirm({
  title: 'Remove all assets',
  confirmLabel: 'Yes',
  cancelLabel: 'No'
})

Prompt

const { format } = await hostApi.prompt({
  title: 'Export format',
  parameters: {
    format: {
      label: 'Format',
      type: 'Select',
      options: ['JPG', 'PNG'],
      default: 'JPG'
    }
  }
})

Compute Coming soon

Hosts EditorDashboardCloud Worker

Run complex tasks like way finding.

Get path

Compute the fastest path from A to B by avoiding 'Hub' spaces

const path = await hostApi.getPath({
  start: [3, 4.5],
  target: [25, 123.5],
  excludeSpaces: {
    where: { subCategory: { in: ['hub'] } }
  }
})

Find closest space

Find the closest space with seat capacity greater than 4 that is bookable

const path = await hostApi.findClosestSpace({
  start: [3, 4.5],
  where: {
    seatCapacity: { gte: 4 },
    customAttributes: { isBooked: { eq: false } }
  }
})

Exports Coming soon

Hosts EditorDashboardCloud Worker

Export the layout including the custom graphics and style to various formats

PDF

const path = await hostApi.exportPdf({
  orientation: 'landscape',
  format: 'A4',
  units: 'mm'
})

DXF

const path = await hostApi.exportDxf()

SVG

const path = await hostApi.exportSvg()

GeoJSON

const path = await hostApi.exportGeoJson()

IMDF

const path = await hostApi.exportImdf()

IFC

const path = await hostApi.exportIfc()

GLTF

const path = await hostApi.exportGltf()