Expressions

Expressions is simple way to access data from app runtime, or response from server. Data is accessed by object, that we internaly call AppDataContext. If expression fails, it will returns undefined. If you specify default parameter, it will be returned when expression fails.

Examples:

property: !expression flow.export.value

property:
  !expression eval: flow.export.value
  default: Nothing

Functions

Function is another type of expression. It’s usefull to add some callbacks, for example to button on click event. Its also needed to create script snipet.

AppDataContext:

• configuration - complete configuration of your target in json.
• flow - data from server about flow and flow/route functions from server

  flow: {
      export: ...any-data-from-server, // - this is exported data for page in flow from server
      backEnabled: true/false, // - value of backEnabled from server for current page
      function: {
          [function-name]: (payload?: any, resultKey?: string) => void, // - call (in !fuction) any flow/route function by call function name (like `flow.function.search('something')`), you can also set output resultKey (default function-name)
          results: {
              [function-name or result-key]: ...any-data-from-server-function, // - here will be data from server under function-name or result-key property name (like `flow.function.results.search`)
          }
      }
  }
  

• form - data about form, including states of fields

  form: {
      data: {
          [field-name]: ...data-inside-field, // - data can be string, file, etc.
      },
      field: {
          [field-name]: {
              isValid: boolean,           // - is field valid
              validationError: string,    // - only validation erros generated by page schema
              error: string,              // - all field errors including validation errors and server errors
              isFilled: boolean,          // - is there any data
          }
      },
      valid: boolean,           // - is form valid
      disabled: boolean,        // - is form disabled
      tag: {
          [tag-name]: boolean,  // - form visual tags
      },
      // checks if all tags are present
      hasTags: (tags: string | string[]) => boolean
      // add tags to form
      addTags: (tags: string[]) => void,
      // regexp as string can be also used to identify more tags
      removeTags: (tags: string[]) => void,
      // change value of some field, you can use callback that will be called after data set, for example if you need to submit form
      changeValue: (fieldName: string, value: any, callback?: () => void) => void,
      // submit form
      submit: (actionName: string, params: string[]) => void,
  }
  

• app - informations about app

  app: {
      waiting: {
          [waiting-tag]: boolean, // - app waiting for tags
      }
  }
  

• api - informations about api

  api: {
      progress: {
          [field-name]: number // - percentage of progress in file uploading
      }
  }
  

• analytics - functions for trigger analytics events

  analytics: {
      authorization: (token) => void, // - trigger mixpanel.identify(token), GA.set({ userId: token }) and GTM dataLayer event "authorization" with parameter token (string)
      event: (eventName, eventParams) => void, // - trigger GTM dataLayer event with given eventName (string) and eventParams (object)
  }
  

• formatter - helper functions for formating

  formatter: {
      thousandsSeparator: (value, separator) => string
  }
  

• financial - helper function for calculating financial

  financial: {
      rate: (periods, payment, present, future, type, guess) => any,
      ptm: (ir, np, pv, fv, type) => number,
      round: (num, places?) => number,
  }
  

• url - informations about locations, query params, etc…

  url: {
      ... // - https://github.com/unshiftio/url-parse
  }
  

• translates - function to translate some text

  t: (string, params) => string
  

• page params - parameters of page, it can be some error, this data was set only from local application run, not from server

  page: {
      params: any // - for example page.params.error contains informations, why you are on error page
  }