Fix usage of contrast-colors with commonjs and esm

.github/ISSUE_TEMPLATE/---bug--npm-packages--.md

@@ -0,0 +1,33 @@
+---
+name: "\U0001F41B Bug [npm packages] "
+about: Report a problem with the @leonardo-contrast-colors module
+title: ''
+labels: bug
+assignees: ''
+
+---
+
+## Description
+<!-- Describe the problem you're having -->
+
+
+## Steps to reproduce
+<!-- Include code examples or error messages if you have them -->
+
+
+## Expected behavior
+<!-- Describe what you expected to happen -->
+
+
+## Screenshots
+<!-- If applicable, add screenshots to help explain the problem -->
+
+## Leonardo package and version
+<!--ie:  **@leonardo-contrast-colors version:**  2.13.0 -->
+
+
+## Environment
+ - **Browser(s) and OS(s):** <!-- Chrome 75.0.3770.142 on Win 10 -->
+
+## Additional context
+<!-- Provide any additional information that might help us debug the issue -->

.github/ISSUE_TEMPLATE/--bug-web-tool.md

@@ -0,0 +1,33 @@
+---
+name: "\U0001F41B Bug [Web Tool] "
+about: Report a problem with the Leonardo web interface
+title: ''
+labels: UI, bug
+assignees: ''
+
+---
+
+## Description
+<!-- Describe the problem you're having -->
+
+
+## Steps to reproduce
+
+1. Go to http://leonardocolor.io/
+2. Click on ...
+3. Observe ...
+
+
+## Expected behavior
+<!-- Describe what you expected to happen -->
+
+
+## Screenshots
+<!-- If applicable, add screenshots to help explain the problem -->
+
+
+## Environment
+ - **Browser(s) and OS(s):** <!-- Chrome 75.0.3770.142 on Win 10 -->
+
+## Additional context
+<!-- Provide any additional information that might help us debug the issue -->

.github/ISSUE_TEMPLATE/--feature-request--npm-packages-.md

@@ -0,0 +1,23 @@
+---
+name: "✨ Feature request [npm packages]"
+about: Suggest a new feature for the Leonardo npm modules
+title: ''
+labels: enhancement, npm packages
+assignees: ''
+
+---
+
+## Description
+<!-- Describe your suggested feature in detail -->
+
+
+## Why do you need this feature?
+<!-- Tell us what this solves or why this is important to your use case -->
+
+
+## Leonardo package and version
+<!--ie:  **@leonardo-contrast-colors version:**  2.13.0 -->
+
+
+## Additional context
+<!-- Add any other context, workarounds, or screenshots about your request -->

.github/ISSUE_TEMPLATE/--feature-web-tool.md

@@ -0,0 +1,19 @@
+---
+name: "✨ Feature request [Web Tool]"
+about: Suggest a new feature for the Leonardo web interface
+title: ''
+labels: UI, enhancement
+assignees: ''
+
+---
+
+## Description
+<!-- Describe your suggested feature in detail -->
+
+
+## Why do you need this feature?
+<!-- Tell us what this solves or why this is important to your use case -->
+
+
+## Additional context
+<!-- Add any other context, workarounds, or screenshots about your request -->

.github/PULL_REQUEST_TEMPLATE.md

@@ -3,8 +3,8 @@
 ## Description
 <!--
   Note: Before sending a pull request, make sure there's an issue for what you're changing
-   - Search for issues: https://github.com/adobe/contrast/issues
-   - If there's no issue, file it: https://github.com/adobe/contrast/issues/new/choose
+   - Search for issues: https://github.com/adobe/leonardo/issues
+   - If there's no issue, file it: https://github.com/adobe/leonardo/issues/new/choose
 -->
 <!-- Describe what you changed and link to the relevant issue(s) -->
 

.gitignore

@@ -5,3 +5,4 @@ yarn-debug.log*
 yarn-error.log*
 .nyc_output/
 .cache/
+.DS_Store

.gitmodules

@@ -0,0 +1,6 @@
+[submodule "packages/contrast-colors/SAPC-APCA"]
+	path = packages/contrast-colors/SAPC-APCA
+	url = [email protected]:Myndex/SAPC-APCA.git
+[submodule "packages/ui/src/c3"]
+	path = packages/ui/src/c3
+	url = [email protected]:StanfordHCI/c3.git

README.md

@@ -1,5 +1,12 @@
 ![Leonardo logo](.github/Leonardo_Logo.png)
 
+[![npm version](https://badge.fury.io/js/%40adobe%2Fleonardo-contrast-colors.svg)](https://www.npmjs.com/package/@adobe/leonardo-contrast-colors)
+[![Package size](https://badgen.net/packagephobia/publish/@adobe/leonardo-contrast-colors)](https://packagephobia.com/result?p=%40adobe%2Fleonardo-contrast-colors)
+[![Minified size](https://badgen.net/bundlephobia/min/@adobe/leonardo-contrast-colors)](https://bundlephobia.com/package/@adobe/leonardo-contrast-colors)
+[![Minified and gzipped size](https://badgen.net/bundlephobia/minzip/@adobe/leonardo-contrast-colors)](https://bundlephobia.com/package/@adobe/leonardo-contrast-colors)
+[![license](https://img.shields.io/github/license/adobe/leonardo)](https://github.com/adobe/leonardo/blob/master/LICENSE)
+[![Pull requests welcome](https://img.shields.io/badge/PRs-welcome-blueviolet)](https://github.com/adobe/leonardo/blob/master/.github/CONTRIBUTING.md) [![Web UI](https://img.shields.io/badge/web%20tool-leonardocolor.io-blue)](https://leonardocolor.io)
+
 # Leonardo
 Authoring [adaptive color palettes](#what-is-adaptive-color) for generating color based on a desired contrast ratio.
 
@@ -8,15 +15,14 @@ For a detailed walkthrough of Leonardo, [check out this article](https://medium.
 ## Project Goals
 To make it easier for designers and engineers to leverage color science to create custom interpolations for a value scale, and to make it easier for designers and engineers to conform to [WCAG minimum contrast standards](https://www.w3.org/TR/WCAG21/#contrast-minimum) by using contrast ratio as the starting point, rather than a post-color-selection auditing process.
 
-1. [Leonardo web application](leonardo-web-application)
+1. [Leonardo web application](#leonardo-web-application)
 2. [Show me a demo](#show-me-a-demo)
 3. [What is "adaptive color"?](#what-is-adaptive-color)
 4. [Using Leonardo](#using-leonardo)
-5. [API Reference](#api-reference)
-6. [Why are not all contrast ratios available?](#why-are-not-all-contrast-ratios-available)
-7. [D3 Color](#d3-color)
-8. [Contributing](#contributing)
-9. [Licensing](#licensing)
+5. [Why are not all contrast ratios available?](#why-are-not-all-contrast-ratios-available)
+6. [D3 Color](#d3-color)
+7. [Contributing](#contributing)
+8. [Licensing](#licensing)
 
 
 ## Leonardo web application
@@ -67,5 +73,36 @@ The Leonardo web app leverages d3 for additional features such as generating 2d
 ## Contributing
 Contributions are welcomed! Read the [Contributing Guide](./.github/CONTRIBUTING.md) for more information.
 
+## Development
+
+To get started [developing Leonardo UI](packages/ui#development):
+
+*Note: [Yarn](https://yarnpkg.com/) must be installed on your machine*
+
+```sh
+# Install dependencies
+yarn install
+
+# Change directory to Leonardo UI
+cd packages/ui
+
+# Run local server
+yarn dev
+```
+
+To get started [developing Leonardo `contrast-colors` package](packages/contrast-colors#development):
+
+```sh
+# From root, change directory to contrast-colors
+cd packages/contrast-colors
+
+# Run tests and watch for changes
+yarn dev
+```
+
+Then, visit the live reloading web UIs here:
+http://localhost:1234/index.html
+http://localhost:1234/demo.html
+
 ## Licensing
 This project is licensed under the Apache V2 License. See [LICENSE](LICENSE) for more information.

cssnano.config.js

@@ -0,0 +1,14 @@
+module.exports = {
+  preset: [
+    "default",
+    {
+      svgo: {
+        plugins: [
+          {
+            convertStyleToAttrs: false
+          }
+        ]
+      }
+    }
+  ]
+};