Update tools to use latest schema

source/nodejs/adaptivecards/example.html

@@ -154,6 +154,7 @@ <h1>Adaptive Cards - Basic Example</h1>
 
     <script>
         var adaptiveCard = new AdaptiveCards.AdaptiveCard();
+        adaptiveCard.hostConfig = new AdaptiveCards.HostConfig();
         adaptiveCard.parse(json);
         var renderedCard = adaptiveCard.render();
 

source/tools/hostConfig/json-to-scss/index.js

@@ -28,8 +28,7 @@ function indent(level) {
 function appendToLast(output, append) {
     output[output.length - 1] += append;
 }
-function convertToSCSS(x, varName) {
-    if (varName === void 0) { varName = '$hostConfig'; }
+function convertToSCSS(x, varName = '$hostConfig') {
     var output = [];
     function walk(prefix, node, indentLevel) {
         output.push(indent(indentLevel) + prefix + ': (');

source/tools/hostConfig/json-to-scss/package.json

@@ -4,12 +4,16 @@
   "description": "Convert AdaptiveCards HostConfig from JSON to an SCSS map",
   "main": "index.js",
   "scripts": {
+    "build": "tsc ./index.ts --module CommonJS --target es2015",
     "test": "node test.js"
   },
   "author": "",
   "license": "MIT",
   "dependencies": {
     "@types/node": "^7.0.18",
     "color-string": "^1.5.2"
+  },
+  "devDependencies": {
+    "typescript": "^2.1.5"
   }
 }

source/tools/hostConfig/json-to-scss/test.js

@@ -1,179 +1,126 @@
 var convert = require('./index');
 
 var config = {
-    supportsInteractivity: true,
-    strongSeparation: {
-        spacing: 40,
-        lineThickness: 1,
-        lineColor: "#80EEEEEE"
+    "spacing": {
+      "small": 3,
+      "default": 8,
+      "medium": 20,
+      "large": 30,
+      "extraLarge": 40,
+      "padding": 15
     },
-    fontFamily: "Segoe UI",
-    fontSizes: {
-        small: 12,
-        normal: 14,
-        medium: 17,
-        large: 21,
-        extraLarge: 26
+    "separator": {
+      "lineThickness": 1,
+      "lineColor": "#EEEEEE"
     },
-    fontWeights: {
-        lighter: 200,
-        normal: 400,
-        bolder: 600
+  "supportsInteractivity": true,
+  "fontFamily": "Segoe UI",
+  "fontSizes": {
+     "small": 12,
+     "default": 14,
+     "medium": 17,
+     "large": 21,
+     "extraLarge": 26
     },
-    colors: {
-        dark: {
-            normal: "#333333",
-            subtle: "#EE333333"
-        },
-        light: {
-            normal: "#FFFFFF",
-            subtle: "#88FFFFFF"
-        },
-        accent: {
-            normal: "#2E89FC",
-            subtle: "#882E89FC"
-        },
-        attention: {
-            normal: "#FFD800",
-            subtle: "#DDFFD800"
-        },
-        good: {
-            normal: "#00FF00",
-            subtle: "#DD00FF00"
-        },
-        warning: {
-            normal: "#FF0000",
-            subtle: "#DDFF0000"
-        }
-    },
-    imageSizes: {
-        small: 40,
-        medium: 80,
-        large: 160
-    },
-    actions: {
-        maxActions: 5,
-        separation: {
-            spacing: 8
-        },
-        buttonSpacing: 20,
-        stretch: false,
-        showCard: {
-            actionMode: "inlineEdgeToEdge",
-            inlineTopMargin: 16,
-            backgroundColor: "#08000000",
-            padding: {
-                top: 8,
-                right: 8,
-                bottom: 8,
-                left: 8
-            }
-        },
-        actionsOrientation: "horizontal",
-        actionAlignment: "left"
-    },
-    adaptiveCard: {
-        backgroundColor: "#FFFFFF",
-        padding: {
-            left: 8,
-            top: 8,
-            right: 8,
-            bottom: 8
-        }
-    },
-    container: {
-        separation: {
-            spacing: 8
-        },
-        normal: {
-            backgroundColor: "#FFFFFF",
-        },
-        emphasis: {
-            backgroundColor: "#EEEEEE",
-            borderColor: "#AAAAAA",
-            borderThickness: {
-                top: 1,
-                right: 1,
-                bottom: 1,
-                left: 1
-            },
-            padding: {
-                top: 10,
-                right: 10,
-                bottom: 10,
-                left: 10
-            }
-        }
+    "fontWeights": {
+      "lighter": 200,
+      "default": 400,
+      "bolder": 600
     },
-    textBlock: {
-        color: "dark",
-        separations: {
-            small: {
-                spacing: 8,
-            },
-            normal: {
-                spacing: 8
-            },
-            medium: {
-                spacing: 8
-            },
-            large: {
-                spacing: 8
-            },
-            extraLarge: {
-                spacing: 8
-            }
+    "containerStyles": {
+      "default": {
+        "backgroundColor": "#00000000",
+        "foregroundColors": {
+          "default": {
+            "default": "#FF333333",
+            "subtle": "#EE333333"
+          },
+          "accent": {
+            "default": "#FF2E89FC",
+            "subtle": "#882E89FC"
+          },
+          "attention": {
+            "default": "#FFcc3300",
+            "subtle": "#DDcc3300"
+          },
+          "good": {
+            "default": "#FF54a254",
+            "subtle": "#DD54a254"
+          },
+          "warning": {
+            "default": "#FFe69500",
+            "subtle": "#DDe69500"
+          }
         }
-    },
-    image: {
-        size: "medium",
-        separation: {
-            spacing: 8
+      },
+      "emphasis": {
+        "backgroundColor": "#08000000",
+        "foregroundColors": {
+          "default": {
+            "default": "#FF333333",
+            "subtle": "#EE333333"
+          },
+          "accent": {
+            "default": "#FF2E89FC",
+            "subtle": "#882E89FC"
+          },
+          "attention": {
+            "default": "#FFcc3300",
+            "subtle": "#DDcc3300"
+          },
+          "good": {
+            "default": "#FF54a254",
+            "subtle": "#DD54a254"
+          },
+          "warning": {
+            "default": "#FFe69500",
+            "subtle": "#DDe69500"
+          }
         }
+      }
     },
-    imageSet: {
-        imageSize: "medium",
-        separation: {
-            spacing: 8
-        }
+    "imageSizes": {
+      "small": 40,
+      "medium": 80,
+      "large": 160
     },
-    factSet: {
-        separation: {
-            spacing: 8
-        },
-        title: {
-            color: "dark",
-            size: "normal",
-            isSubtle: false,
-            weight: "bolder",
-            wrap: true,
-            maxWidth: 150
-        },
-        value: {
-            color: "dark",
-            size: "normal",
-            isSubtle: false,
-            weight: "normal",
-            wrap: true
-        },
-        spacing: 10
+    "actions": {
+      "maxActions": 5,
+      "spacing": "default",
+      "buttonSpacing": 10,
+      "showCard": {
+        "actionMode": "inline",
+        "inlineTopMargin": 16
+      },
+      "actionsOrientation": "horizontal",
+      "actionAlignment": "stretch"
     },
-    input: {
-        separation: {
-            spacing: 8
-        }
+    "adaptiveCard": {
+      "allowCustomStyle": false
     },
-    columnSet: {
-        separation: {
-            spacing: 8
-        }
+    "imageSet": {
+      "imageSize": "medium",
+      "maxImageHeight": 100
     },
-    column: {
-        separation: {
-            spacing: 8
-        }
+    "factSet": {
+      "title": {
+        "color": "default",
+        "size": "default",
+        "isSubtle": false,
+        "weight": "bolder",
+        "wrap": true,
+        "maxWidth": 150
+      },
+      "value": {
+        "color": "default",
+        "size": "default",
+        "isSubtle": false,
+        "weight": "default",
+        "wrap": true
+      },
+      "spacing": 10
     }
-};
+  };
 
 var conversion = convert(config);