The c‎wrapContext is an embedded JavaScript property used to manage and pass context information during the compilation process. It is created dynamically as the application is being compiled and can be passed across different parts of the build environment. This property allows developers to access and manipulate various contexts efficiently, ensuring that the application can adapt to different states and requirements. Unlike c‎wrapReference, which is configured via the cwrapConfig.js file and passed before compilation begins, c‎wrapContext is created and utilized during the compilation process.

{
  "element": "ul",
  "text": "{‎{return c‎wrapContext.get('asideRoutes')[0]}‎}",
  "style": "color: white; display: flex; flex-direction: column; font-weight: bold; gap: 1em; list-style: none; margin: 0; padding: 0;",
  "blueprint": {
    "count": "{‎{return c‎wrapReference.globals.const.documentation['getting started'].length}}",
    "element": "li",
    "children": [
      {
        "element": "a",
        "text": "c‎wrapArray[{‎{return c‎wrapReference.globals.const.documentation['getting started']}}]",
        "style": "position: relative; z-index: 1; transition: 300ms; padding: 0.2em 0.5em;",
        "extend": [
          {
            "extension": ":hover",
            "style": "color: rgba(150, 250, 250, 1);"
          },
          {
            "extension": ".focus",
            "style": "color: rgba(150, 250, 250, 1); background-color: rgba(20, 37, 61, 0.8); padding: 0.2em 0.5em; border-radius: 0.3em;"
          }
        ],
        "attributes": {
          "href": "c‎wrapProperty[prefixAside=./]c‎wrapGlobal[documentation.getting started.c‎wrapIndex]/",
          "class": "c‎wrapArray[{‎{return c‎wrapReference.globals.const.documentation['getting started'].map((x) => `c‎wrapProperty[${x}Focus=c‎wrapOmit]`)}‎}]"
        }
      }
    ]
  }
}