Create diff generator website project

.changeset/small-radios-mate.md

@@ -0,0 +1,5 @@
+---
+"@adobe/token-diff-generator": major
+---
+
+Initial release of the token diff generator library and cli

.moon/workspace.yml

@@ -6,6 +6,8 @@ projects:
   site: "docs/site"
   root: "."
   csvGenerator: tools/token-csv-generator
+  diff: "tools/diff-generator"
+  tdiff: "docs/tdiff"
 vcs:
   manager: "git"
   defaultBranch: "main"

README.md

@@ -16,6 +16,7 @@ Packages in this monorepo:
 - [Spectrum Tokens](packages/tokens/) design tokens for Spectrum, Adobe's design system.
 - [Spectrum Token Visualizer Tool](docs/visualizer/) a visualizer for inspecting tokens. Published as a [static site](https://opensource.adobe.com/spectrum-tokens/visualizer/), not an NPM package.
 - [Spectrum Tokens Docs](docs/site/) a static site to show the component options API and other token data.
+- [Spectrum Token Diff Generator](tools/diff-generator/) a library and cli tool that reports changes made between two schema/releases/branches.
 
 ## Setup monorepo locally
 

docs/token-diff/.editorconfig

@@ -0,0 +1,29 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+
+[*]
+
+# Change these settings to your own preference
+indent_style = space
+indent_size = 2
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[*.json]
+indent_size = 2
+
+[*.{html,js,md}]
+block_comment_start = /**
+block_comment = *
+block_comment_end = */

docs/token-diff/.gitignore

@@ -0,0 +1,24 @@
+## editors
+/.idea
+/.vscode
+
+## system files
+.DS_Store
+
+## npm
+/node_modules/
+/npm-debug.log
+
+## testing
+/coverage/
+
+## temp folders
+/.tmp/
+
+# build
+/_site/
+/dist/
+/out-tsc/
+
+storybook-static
+custom-elements.json

docs/token-diff/.husky/pre-commit

@@ -0,0 +1 @@
+./node_modules/.bin/lint-staged

docs/token-diff/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 token-diff
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

docs/token-diff/README.md

@@ -0,0 +1,48 @@
+# \<token-diff>
+
+This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
+
+## Installation
+
+```bash
+npm i token-diff
+```
+
+## Usage
+
+```html
+<script type="module">
+  import 'token-diff/token-diff.js';
+</script>
+
+<token-diff></token-diff>
+```
+
+## Linting and formatting
+
+To scan the project for linting and formatting errors, run
+
+```bash
+npm run lint
+```
+
+To automatically fix linting and formatting errors, run
+
+```bash
+npm run format
+```
+
+
+## Tooling configs
+
+For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.
+
+If you customize the configuration a lot, you can consider moving them to individual files.
+
+## Local Demo with `web-dev-server`
+
+```bash
+npm start
+```
+
+To run a local development server that serves the basic demo located in `demo/index.html`

docs/token-diff/demo/index.html

@@ -0,0 +1,32 @@
+<!doctype html>
+<html lang="en-GB">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
+  <style>
+    body {
+      background: #fafafa;
+    }
+  </style>
+</head>
+<body>
+  <div id="demo"></div>
+
+  <script type="module">
+    import { html, render } from 'lit';
+    import '../src/components/token-diff.js';
+    import '../src/nav-bar.js';
+
+    const header = 'Hello owc World!';
+    render(
+      html`
+        <nav-bar></nav-bar>
+        <token-diff .header=${header}>
+          some light-dom
+        </token-diff>
+      `,
+      document.querySelector('#demo')
+    );
+  </script>
+</body>
+</html>

docs/token-diff/index.ts

@@ -0,0 +1,2 @@
+export { NavBar } from './src/NavBar.js';
+export { TokenDiff } from './src/components/TokenDiff.js';

docs/token-diff/moon.yml

@@ -0,0 +1,61 @@
+# Copyright 2024 Adobe. All rights reserved.
+# This file is licensed to you under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License. You may obtain a copy
+# of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+# Unless required by applicable law or agreed to in writing, software distributed under
+# the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+# OF ANY KIND, either express or implied. See the License for the specific language
+# governing permissions and limitations under the License.
+$schema: "https://moonrepo.dev/schemas/project.json"
+stack: "frontend"
+tags:
+  - docs
+  - token-diff
+fileGroups:
+  target:
+    - "/token-diff"
+tasks:
+  copySchema:
+    command:
+      - cp
+      - -r
+      - ../../packages/tokens/schemas
+      - public/
+    platform: system
+    inputs:
+      - /packages/tokens/schemas/**/*.json
+    outputs:
+      - public/schemas
+  build:
+    command:
+      - next
+      - build
+    platform: node
+    deps:
+      - ~:copySchema
+    outputs:
+      - "/token-diff"
+  clean:
+    command:
+      - rimraf
+      - -g
+      - "../../token-diff"
+    platform: node
+    inputs:
+      - "@globs(target)"
+  start:
+    command:
+      - next
+      - dev
+    local: true
+    platform: node
+    deps:
+      - ~:build
+  export:
+    platform: node
+    deps:
+      - ~:clean
+      - ~:build
+    outputs:
+      - "/token-diff"