aboutsummaryrefslogtreecommitdiff
path: root/src/tools/json-diff/diff-viewer/diff-viewer.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/tools/json-diff/diff-viewer/diff-viewer.vue')
-rw-r--r--src/tools/json-diff/diff-viewer/diff-viewer.vue110
1 files changed, 110 insertions, 0 deletions
diff --git a/src/tools/json-diff/diff-viewer/diff-viewer.vue b/src/tools/json-diff/diff-viewer/diff-viewer.vue
new file mode 100644
index 0000000..c77d407
--- /dev/null
+++ b/src/tools/json-diff/diff-viewer/diff-viewer.vue
@@ -0,0 +1,110 @@
+<template>
+ <div v-if="showResults">
+ <n-space justify="center">
+ <n-form-item label="Only show differences" label-placement="left">
+ <n-switch v-model:value="onlyShowDifferences" />
+ </n-form-item>
+ </n-space>
+
+ <c-card data-test-id="diff-result">
+ <n-text v-if="jsonAreTheSame" depth="3" block text-center italic> The provided JSONs are the same </n-text>
+ <diff-root-viewer v-else :diff="result" />
+ </c-card>
+ </div>
+</template>
+
+<script lang="ts" setup>
+import { useAppTheme } from '@/ui/theme/themes';
+import _ from 'lodash';
+import { DiffRootViewer } from './diff-viewer.models';
+import { diff } from '../json-diff.models';
+
+const onlyShowDifferences = ref(false);
+const props = defineProps<{ leftJson: unknown; rightJson: unknown }>();
+const { leftJson, rightJson } = toRefs(props);
+const appTheme = useAppTheme();
+
+const result = computed(() =>
+ diff(leftJson.value, rightJson.value, { onlyShowDifferences: onlyShowDifferences.value }),
+);
+
+const jsonAreTheSame = computed(() => _.isEqual(leftJson.value, rightJson.value));
+const showResults = computed(() => !_.isUndefined(leftJson.value) && !_.isUndefined(rightJson.value));
+</script>
+
+<style lang="less" scoped>
+::v-deep(.diffs-viewer) {
+ color: v-bind('appTheme.text.mutedColor');
+
+ & > ul {
+ padding-left: 0 !important;
+ }
+
+ ul {
+ list-style: none;
+ padding-left: 20px;
+ margin: 0;
+
+ li {
+ .updated-line {
+ padding: 3px 0;
+ }
+
+ .result,
+ .array,
+ .object,
+ .value {
+ &:not(:last-child) {
+ margin-right: 4px;
+ }
+
+ &.added {
+ padding: 3px 5px;
+ border-radius: 4px;
+ background-color: v-bind('appTheme.success.colorFaded');
+ color: v-bind('appTheme.success.color');
+ .key {
+ color: inherit;
+ }
+ }
+
+ &.removed {
+ padding: 3px 5px;
+ border-radius: 4px;
+ background-color: v-bind('appTheme.error.colorFaded');
+ color: v-bind('appTheme.error.color');
+
+ .key {
+ color: inherit;
+ }
+ }
+ }
+
+ .value {
+ cursor: pointer;
+ border: 1px solid transparent;
+ transition: border-color 0.2s ease-in-out;
+
+ &.added:hover {
+ border-color: v-bind('appTheme.success.color');
+ }
+
+ &.removed:hover {
+ border-color: v-bind('appTheme.error.color');
+ }
+ }
+
+ .added .added,
+ .removed .removed {
+ background-color: transparent;
+ color: inherit;
+ }
+
+ .key {
+ font-weight: 500;
+ color: v-bind('appTheme.text.baseColor');
+ }
+ }
+ }
+}
+</style>
'>fix/dates Unnamed repository; edit this file 'description' to name the repository.
aboutsummaryrefslogtreecommitdiff
path: root/examples/snowpack/README.md (unfollow)
AgeCommit message (Expand)AuthorFilesLines
2021-09-15Version Packages (#1377)astro@0.20.7Gravatar github-actions[bot] 23-30/+27
2021-09-15Update stats.ts (#1376)Gravatar Fred K. Schott 2-1/+6
2021-09-15Expose slots to components (#1368)Gravatar Jonathan Neal 10-0/+169
2021-09-15[ci] collect statsGravatar FredKSchott 1-0/+1
2021-09-14Revert "fix bad ci paths"Gravatar Fred K. Schott 1-5/+5
2021-09-15[ci] yarn formatGravatar FredKSchott 1-0/+1
2021-09-14Version Packages (#1358)astro@0.20.6@astrojs/renderer-vue@0.1.8@astrojs/renderer-svelte@0.1.2@astrojs/renderer-solid@0.1.1@astrojs/renderer-react@0.2.1@astrojs/renderer-preact@0.2.2@astrojs/renderer-lit@0.1.1Gravatar github-actions[bot] 41-70/+91
2021-09-14fix bad ci pathsGravatar Fred K. Schott 1-5/+5
2021-09-14update changesetsGravatar Fred K. Schott 1-1/+1
2021-09-14Fix passing Markdown content through props (#1259) (#1343)Gravatar kelvinsjk 4-0/+22
2021-09-14Improve stats logging to use `pretty-bytes` so that 20B doesn't get output as...Gravatar Caleb Jasik 4-2/+13
2021-09-14[ci] yarn formatGravatar FredKSchott 1-1/+1
2021-09-14Merge "Remove check for referenced files" (#1196)Gravatar (none) 6-6/+45
2021-09-14Docs: Add READMEs for renderers (#1351)Gravatar Drew Powers 8-1/+184
2021-09-14Update deployment docs for Netlify deployment (#1361)Gravatar Cassidy Williams 1-7/+9
2021-09-14Delete perfect-kids-occur.md (#1372)Gravatar Fred K. Schott 1-5/+0
2021-09-14[ci] yarn formatGravatar FredKSchott 1-15/+10
2021-09-14Self-host homepage fonts to improve page load speed (#1370)Gravatar mundry 14-5/+52
2021-09-14Add types to examples and docs (#1347)Gravatar Matthew Phillips 8-20/+60
2021-09-14[ci] collect statsGravatar FredKSchott 1-0/+1
2021-09-13Fix typo (#1360)Gravatar Marcus Otterström 1-1/+1
2021-09-13Disclaimer for Github pages / jekyll quirk (#1355)Gravatar Tc001 2-0/+7
2021-09-13fix outdated lockfile issue (#1357)Gravatar Fred K. Schott 1-3/+1
2021-09-13Add `astro.build/play` link (#1359)Gravatar Nate Moore 1-0/+6
2021-09-13[ci] yarn formatGravatar FredKSchott 2-8/+7
2021-09-13Add a new lockfile (#1356)Gravatar Matthew Phillips 1-19/+19
2021-09-13[ci] collect statsGravatar FredKSchott 1-0/+1
2021-09-12[ci] collect statsGravatar FredKSchott 1-0/+1
2021-09-11[ci] collect statsGravatar FredKSchott 1-0/+1
2021-09-10Prevent removing CSS preloads during bundling (#1326)Gravatar Bartek Igielski 8-18/+96
2021-09-10Fix typos in Netlify sponsorship announcement blog post (#1346)Gravatar mundry 1-4/+4
2021-09-10[ci] collect statsGravatar FredKSchott 2-1/+2
2021-09-09blog: announce netlify sponsorship (#1345)Gravatar Fred K. Schott 4-5/+64
2021-09-09Version Packages (#1344)Gravatar github-actions[bot] 29-53/+42
2021-09-09Revert "Version Packages (#1303)"Gravatar Fred K. Schott 29-42/+53
2021-09-09update lockfileastro@0.20.5@astrojs/markdown-support@0.3.1Gravatar Fred K. Schott 1-9/+9
2021-09-09Version Packages (#1303)Gravatar github-actions[bot] 29-53/+42
2021-09-09[ci] collect statsGravatar FredKSchott 2-1/+2
2021-09-08Update netlify deploy instructions for `.nvmrc` syntax (#1337)Gravatar Caleb Jasik 1-1/+1
2021-09-08[ci] yarn formatGravatar jasikpark 1-1/+0