React library for the NOODL language

Usage no npm install needed!

<script type="module">
  import aitmedReactNoodl from 'https://cdn.skypack.dev/@aitmed/react-noodl';



React library for working with CADL pages

NPM JavaScript Style Guide


npm install --save @aitmed/react-cadl


  • type: listFooter
  • type: scrollView
  • type: searchBar
  • Format phone # in inputs
  • make type: scrollView in sync with innerHeight height
  • border: { color: "0x00000" }
  • new component:
    • type: date
      • contentType: formattedDate
      • contentType: formattedDuration
  • new action type: popUp
  • new concept: lastTop
    • most likely used for scrollView components
    • for listItem under scrollView (or list)
  • On-demand color hex transform during the resolving process


  • Add a check for comments not following a space

Evaluator todos

  • Combine evaluator lookup inside _run
  • Let CADLEvaluator.evaluate do the evaluation

Action triggers

  • onClick
Event handler data types
  • string: Provide our own custom function
  • Array: Provide our own custom function
    • It represents a chain of actions
    • Each action in the action chain can have these possible actionTypes:
      1. builtIn - Provide our own function and logic to achieve the goal
      2. ecosConnection - Communicating with the eCOS
      3. pageJump - Navigating to a page
      4. updateObject - Updates the global root object afer receiving its data

Referencing (Underscore)

Inheritance, extension, and substitution rules

  1. (copy/clone) parent object
  2. Override + add attributes
  3. Substitute/replacement of values

YAML Document Node Interfaces

Name TS type YAML Node
Action chain (key/value) { [key: string]: CADLChainActionObject[] } YAMLPair
Action chain CADLChainActionObject[] YAMLSeq
Action object CADLChainActionObject YAMLMap

Custom integrations

  • Some components are attached with the prop data-ux for UX interactions between the library and web apps

Video call

Creating a token --> creating a edge --> backend creates a deat --> when join, updating name structure on the edge (type: 30000)

  • Invitations sent to join --> use bvid
    • Another person joins --> add another edge to existing room
  • Can change the title of the meeting room
  • Can invite ppl to the meeting room
    • Phone #, first name, last name
  • Invite --> creates another edge
    • If phone # exists, (?)
  • Meeting Rooms have a call ID (let austin know if twillio or talkbox is quicker for video conferencing)
  • Once a user joins the room, connect them to the meeting center(?) with the id
    • Everyone shares the same meeting room id
  • After the meeting is finished, a call history is generated (implemented later)
  • Everything is just using creating edges (no docs/vertex) at the moment



  • Username: christopher@aitmed.com

  • Password: letmein1234567

  • Account SID: ACa524f7e42d5dc9ef7385a0fdf6ac4089

  • Auth Token: ad662c4146166356aac01286f9ed21dd

  • Austins:

    • Account SID: ACa3404ef44a1d76ddb9b933ac832ae89a
    • Auth Token: 04d5a7c2fbca5bbda9d5de46fe0066f2
    • Phone #: +18634001516

For client/SDK

  • Name: clientApiKey
  • SID: SK56fbef6964ae85203c48608d8f90c6f2
  • Key type: Standard
  • Secret: OHMOjdEsrTEuDsN7uiZmeZoBsNoq8SOp