honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1334 from hugoabernier/react-adaptivecards-1332-2

This commit is contained in:
Hugo Bernier 2020-06-11 22:52:55 -04:00 committed by GitHub
parent aba2db2319 c74013ac4a
commit c703110b5d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 109 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
samples/react-adaptivecards/.tours/code-walkthrough.tour
View File

@ -352,21 +352,6 @@
"line": 14,
"description": "We also use `markdown-it` to parse the Markdown from the rendered HTML so that we fully support the Adaptive Card schema."
},
{
"file": "src/controls/AdaptiveCard/AdaptiveCard.tsx",
"line": 84,
"description": "We have to do a little workaround here, but that's a temporary issue.\r\n\r\nThe May 2020 Adaptive Card templating library change the syntax from `{}` to `${}`, but the npm package doesn't seem to be updated yet. So we just replace all `${}` to `{}` so that you can use all the latest Adaptive Card templating samples without issues. \r\n\r\nWe'll fix this when the npm package is updated.",
"selection": {
"start": {
"line": 79,
"character": 8
},
"end": {
"line": 84,
"character": 61
}
}
},
{
"file": "src/controls/AdaptiveCard/AdaptiveCard.tsx",
"line": 132,

4
samples/react-adaptivecards/README.md
View File

@ -424,6 +424,10 @@ The web part sample conditionally hides and shows property pane controls dependi
![Dependent Property Pane Controls](./assets/DependentControls.gif)
### CodeTour
This project contains a CodeTour that will walk you through the areas of interest. To use it, make sure you install [CodeTour](https://marketplace.visualstudio.com/items?itemName=vsls-contrib.codetour) for Visual Studio Code. When you open the project, you'll be prompted to start the tour, but you can also find the **Code Walk-through** tour in the **CodeTour** pane.
## For More Information
If you'd like to read more about the various concepts illustrated in this sample, please refer to the following links:

103
samples/react-adaptivecards/package-lock.json generated
View File

@ -1711,6 +1711,11 @@
"@microsoft/node-core-library": "3.15.1"
}
},
"@microsoft/recognizers-text-data-types-timex-expression": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/@microsoft/recognizers-text-data-types-timex-expression/-/recognizers-text-data-types-timex-expression-1.1.4.tgz",
"integrity": "sha512-2vICaEJfV9EpaDKs5P1PLAEs+WpNqrtpkl7CLsmc5gKmxgpQtsojG4tk6km5JRKg1mYuLV5ZzJ/65oOEeyTMvQ=="
},
"@microsoft/rush-lib": {
"version": "5.15.1",
"resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-5.15.1.tgz",
@ -3110,6 +3115,11 @@
"integrity": "sha512-VQgHxyPMTj3hIlq9SY1mctqx+Jj8kpQfoLvDlVSDNOyuYs8JYfkuY3OW/4+dO657yPmNhHpePRx0/Tje5ImNVQ==",
"dev": true
},
"@types/atob": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/@types/atob/-/atob-2.1.2.tgz",
"integrity": "sha512-8GAYQ1jDRUQkSpHzJUqXwAkYFOxuWAOGLhIR4aPd/Y/yL12Q/9m7LsKpHKlfKdNE/362Hc9wPI1Yh6opDfxVJg=="
},
"@types/chai": {
"version": "3.4.34",
"resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
@ -3218,6 +3228,11 @@
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.117.tgz",
"integrity": "sha512-xyf2m6tRbz8qQKcxYZa7PA4SllYcay+eh25DN3jmNYY6gSTL7Htc/bttVdkqj2wfJGbeWlQiX8pIyJpKU+tubw=="
},
"@types/lru-cache": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/@types/lru-cache/-/lru-cache-5.1.0.tgz",
"integrity": "sha512-RaE0B+14ToE4l6UqdarKPnXwVDuigfFv+5j9Dze/Nqr23yyuqdNvzcZi3xB+3Agvi5R4EOgAksfv3lXX4vBt9w=="
},
"@types/merge2": {
"version": "0.3.29",
"resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz",
@ -3251,6 +3266,14 @@
"integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck=",
"dev": true
},
"@types/moment-timezone": {
"version": "0.5.13",
"resolved": "https://registry.npmjs.org/@types/moment-timezone/-/moment-timezone-0.5.13.tgz",
"integrity": "sha512-SWk1qM8DRssS5YR9L4eEX7WUhK/wc96aIr4nMa6p0kTk9YhGGOJjECVhIdPEj13fvJw72Xun69gScXSZ/UmcPg==",
"requires": {
"moment": ">=2.14.0"
}
},
"@types/mz": {
"version": "0.0.32",
"resolved": "https://registry.npmjs.org/@types/mz/-/mz-0.0.32.tgz",
@ -3571,6 +3594,11 @@
"@types/node": "*"
}
},
"@types/xmldom": {
"version": "0.1.29",
"resolved": "https://registry.npmjs.org/@types/xmldom/-/xmldom-0.1.29.tgz",
"integrity": "sha1-xEKLDKhtO4gUdXJv2UmAs4onw4E="
},
"@types/yargs": {
"version": "0.0.34",
"resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
@ -4034,6 +4062,46 @@
"resolved": "https://registry.npmjs.org/adal-angular/-/adal-angular-1.0.16.tgz",
"integrity": "sha1-4rwxvHEqr/ugU6pN1GvITrXSCQ8="
},
"adaptive-expressions": {
"version": "4.9.2",
"resolved": "https://registry.npmjs.org/adaptive-expressions/-/adaptive-expressions-4.9.2.tgz",
"integrity": "sha512-hywLFmj0NwMR2GoIg185p/oSc7hp+fagEwG4/1415fhL+lsbR25E/GS1InCUhWa8JSoyn+0EuneLey+BCGlOiA==",
"requires": {
"@microsoft/recognizers-text-data-types-timex-expression": "1.1.4",
"@types/atob": "^2.1.2",
"@types/lru-cache": "^5.1.0",
"@types/moment-timezone": "^0.5.12",
"@types/xmldom": "^0.1.29",
"antlr4ts": "0.5.0-alpha.1",
"atob": "^2.1.2",
"big-integer": "^1.6.48",
"jspath": "^0.4.0",
"lodash": "^4.17.15",
"lru-cache": "^5.1.1",
"moment": "^2.25.1",
"moment-timezone": "^0.5.28"
},
"dependencies": {
"lru-cache": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
"integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
"requires": {
"yallist": "^3.0.2"
}
},
"moment": {
"version": "2.26.0",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.26.0.tgz",
"integrity": "sha512-oIixUO+OamkUkwjhAVE18rAMfRJNsNe/Stid/gwHSOfHrOtw9EhAY2AHvdKZ/k/MggcYELFCJz/Sn2pL8b8JMw=="
},
"yallist": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
"integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="
}
}
},
"adaptivecards": {
"version": "1.2.6",
"resolved": "https://registry.npmjs.org/adaptivecards/-/adaptivecards-1.2.6.tgz",
@ -4045,9 +4113,12 @@
"integrity": "sha512-ovjp0f6xfzEBdTXVpBwNTovxjM3S7q/aJe39F58Ybe1+AO+warRFdpIT5v1HcxBwYoDsnllwo9U9Ne52TcL96A=="
},
"adaptivecards-templating": {
"version": "0.1.1-alpha.1",
"resolved": "https://registry.npmjs.org/adaptivecards-templating/-/adaptivecards-templating-0.1.1-alpha.1.tgz",
"integrity": "sha512-pK34y5tcqmtcUZaaEK1EgrTLJX8yq6RYc2hp3x/IsLdDZm6pFGWliYD8pAQnJdyvblpxV82XTnAMhnBw0HUi7A=="
"version": "1.0.0-rc.0",
"resolved": "https://registry.npmjs.org/adaptivecards-templating/-/adaptivecards-templating-1.0.0-rc.0.tgz",
"integrity": "sha512-lA+Dn0QeRk8nGdxx994njzPGKGdh8XwIAnTlnVTmBHmnIjpTK261l+rs5Yxl/2ysMwkl1du21vFDMCDbP9qAXg==",
"requires": {
"adaptive-expressions": "^4.9.0"
}
},
"agent-base": {
"version": "4.3.0",
@ -4172,6 +4243,11 @@
"integrity": "sha1-qCJQ3bABXponyoLoLqYDu/pF768=",
"dev": true
},
"antlr4ts": {
"version": "0.5.0-alpha.1",
"resolved": "https://registry.npmjs.org/antlr4ts/-/antlr4ts-0.5.0-alpha.1.tgz",
"integrity": "sha512-LU5FLWq2fUwg2cTL/DeIL16ucUm5jv6SNVFoMjbYLviXAp6p5g1ZzkTAnWiOKX/muEEy0PY78perPj6WUBSQCw=="
},
"any-promise": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
@ -4532,8 +4608,7 @@
"atob": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
"integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
"dev": true
"integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg=="
},
"autoprefixer": {
"version": "9.1.5",
@ -4969,6 +5044,11 @@
"tryer": "^1.0.1"
}
},
"big-integer": {
"version": "1.6.48",
"resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.48.tgz",
"integrity": "sha512-j51egjPa7/i+RdiRuJbPdJ2FIUYYPhvYLjzoYbcMMm62ooO6F94fETG4MTs46zPAF9Brs04OajboA/qTGuz78w=="
},
"big.js": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
@ -12592,6 +12672,11 @@
"integrity": "sha1-XAxWhRBxYOcv50ib3eoLRMK8Z70=",
"dev": true
},
"jspath": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/jspath/-/jspath-0.4.0.tgz",
"integrity": "sha512-2/R8wkot8NCXrppBT/onp+4mcAUAZqtPxsW6aSJU3hrFAVqKqtFYcat2XJZ7inN4RtATUxfv0UQSYOmvJKiIGA=="
},
"jsprim": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
@ -13498,6 +13583,14 @@
"resolved": "https://registry.npmjs.org/moment/-/moment-2.24.0.tgz",
"integrity": "sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg=="
},
"moment-timezone": {
"version": "0.5.31",
"resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.31.tgz",
"integrity": "sha512-+GgHNg8xRhMXfEbv81iDtrVeTcWt0kWmTEY1XQK14dICTXnWJnT0dxdlPspwqF3keKMVPXwayEsk1DI0AA/jdA==",
"requires": {
"moment": ">= 2.9.0"
}
},
"move-concurrently": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",

2
samples/react-adaptivecards/package.json
View File

@ -28,7 +28,7 @@
"@types/webpack-env": "1.13.1",
"adaptivecards": "^1.2.6",
"adaptivecards-fabric": "^1.0.4",
"adaptivecards-templating": "^0.1.1-alpha.1",
"adaptivecards-templating": "^1.0.0-rc.0",
"markdown-it": "^10.0.0",
"office-ui-fabric-react": "6.189.2",
"react": "16.8.5",

24
samples/react-adaptivecards/src/controls/AdaptiveCard/AdaptiveCard.tsx
View File

@ -69,19 +69,13 @@ export class AdaptiveCard extends React.Component<IAdaptiveCardProps, IAdaptiveC
}
let errors: Array<IValidationError> = [];
let card: {};
let card: any;
if (this.props.data && this.props.useTemplating) {
// Define a template payload
console.log("Using templating");
var templatePayload = {};
try {
// KLUDGE: Temporary fix for Adaptive Templating May 2020 change
// to be updated when new version of Adapting Template package is available
var templating:string = this.props.template.split("${").join('{');
templatePayload = JSON.parse(templating);
//
//templatePayload = JSON.parse(this.props.template);
templatePayload = JSON.parse(this.props.template);
} catch (error) {
console.error("Something went wrong with the template", error);
this._errorHandler(strings.TemplatingJsonError + error);
@ -91,16 +85,10 @@ export class AdaptiveCard extends React.Component<IAdaptiveCardProps, IAdaptiveC
// Create a Template instance from the template payload
var template = new ACData.Template(templatePayload);
// Create a data binding context, and set its $root property to the
// data object to bind the template to
// BUG: According to https://docs.microsoft.com/en-us/adaptive-cards/templating/ we're supposed to use
//var card = template.expand({
//$root: {
// // Your data goes here
//}
//});
// ...but that doesn't work
var context = new ACData.EvaluationContext();
var context: any = {
"$root":{}
};
try {
context.$root = JSON.parse(this.props.data);
} catch (error) {