Skip to content

CloningHistoryViewer ​

Interactive tree visualization of construct cloning history. Navigate through recursive cloning steps, from source materials to final product.

Demo ​

Usage ​

svelte
<script>
  import { CloningHistoryViewer } from '@molbiohive/hatchlings';
</script>

<CloningHistoryViewer root={cloningTree} width={800} height={500} />

Data Type — CloningNode ​

FieldTypeRequiredDescription
idstringyesUnique node ID
namestringyesConstruct name
sizenumberyesSize in bp
topologystringno'circular' | 'linear'
partsPart[]noFeatures
cutSitesCutSite[]noRestriction sites
sourceCloningSourcenoHow it was made

Props ​

PropTypeDefaultDescription
rootCloningNode—Root of cloning tree
widthnumber—Container width
heightnumber—Container height
onnodeclickfunction—Node click handler