Giraffe SDK

Appearance

Giraffe SDK

Documentation for the Giraffe iframe SDK

GiraffeState
RPC Functions

Read From Giraffe ​

Iframes can listen to data from the parent Giraffe window using GiraffeState.

ts
import { giraffeState } from '@gi-nx/iframe-sdk';

giraffeState.addListener(['mapContent'], (key: string) => {
  console.log('mapContent has changed', giraffeState.get('mapContent'));
});

For React apps, use the useGiraffeState hook:

ts
import { useGiraffeState } from '@gi-nx/iframe-sdk';

export const MyComponent = () => {
  const stackedSections = useGiraffeState('stackedSections');
  return <div>...</div>;
};

Commands / Functions ​

RPC Functions can be invoked via the postmessage SDK.

ts
import { rpc } from '@gi-nx/iframe-sdk';
rpc.invoke('setTiles', [sourceId, newTiles]);