chore: 🤖 add initial rose styles for inclusion in apps

addons/rose/.eslintignore

@@ -18,3 +18,5 @@
 /.node_modules.ember-try/
 /bower.json.ember-try
 /package.json.ember-try
+
+index.js

addons/rose/.sasslintrc

@@ -0,0 +1,7 @@
+files:
+  include: 'app/styles/**/*.s+(a|c)ss'
+rules:
+  leading-zero: 0
+  mixins-before-declarations: 0
+  nesting-depth: 0
+  placeholder-in-extend: 0

addons/rose/README.md

@@ -7,6 +7,7 @@ Project Watchtower UIs.
 <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
 **Table of Contents**  *generated with [DocToc](https://github.com/thlorenz/doctoc)*
 
+- [Add Styles to an App](#add-styles-to-an-app)
 - [Installation](#installation)
 - [Yarn Commands](#yarn-commands)
 - [Linting](#linting)
@@ -17,6 +18,12 @@ Project Watchtower UIs.
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
+## Add Styles to an App
+
+Add this addon to an Ember application's `devDependencies` as:
+`"rose": "*"`, for applications included in this monorepo.  Application's
+may then import rose styles by adding `@import 'rose';` to their stylesheets.
+
 ## Installation
 
 See monorepo README for installation instructions.

addons/rose/addon/styles/rose/index.scss

@@ -0,0 +1 @@
+html { background: pink; }

addons/rose/app/styles/app.scss

@@ -0,0 +1 @@
+@import 'rose';

addons/rose/app/templates/index.hbs

@@ -0,0 +1 @@
+Dummy app index template

addons/rose/index.js

@@ -1,5 +1,38 @@
 'use strict';
 
+var path = require('path');
+var Funnel = require('broccoli-funnel');
+var mergeTrees = require('broccoli-merge-trees');
+
 module.exports = {
-  name: require('./package').name
+  name: require('./package').name,
+
+  /**
+   * Finds this addon's styles folder and includes it into the running
+   * application's `sassOptions.includePaths`, such that the application needs
+   * no further configuration to import the styles.
+   */
+  included(app) {
+    this._super.included(app);
+
+    // Resolve a path to this addon's style folder `addon/styles/addon-name`,
+    // where addon-name is resolved from package.json
+    const addonPath = require.resolve(this.name);
+    const stylePath = path.resolve(addonPath, `../addon/styles/${this.name}`);
+    const styleTree = mergeTrees([
+      new Funnel(stylePath, {
+        destDir: this.name,
+        include: ['**/*']
+      })
+    ]);
+
+    // Setup default sassOptions on the running application
+    app.options.sassOptions = app.options.sassOptions || {};
+    app.options.sassOptions.includePaths =
+      app.options.sassOptions.includePaths || [];
+
+    // Include the addon styles
+    app.options.sassOptions.includePaths.push(styleTree);
+  }
+
 };

addons/rose/package.json

@@ -10,10 +10,12 @@
   "scripts": {
     "build": "ember build",
     "build:production": "ember build --environment=production",
-    "lint": "yarn lint:hbs && yarn lint:js",
+    "lint": "yarn lint:hbs && yarn lint:js && yarn lint:sass",
     "lint:hbs": "ember-template-lint .",
     "lint:js": "eslint .",
+    "lint:sass": "sass-lint -v -q",
     "start": "ember serve",
+    "pretest": "yarn lint",
     "test": "ember test",
     "test:all": "ember try:each",
     "doc:toc": "doctoc README.md"
@@ -34,6 +36,7 @@
     "ember-cli-dependency-checker": "^3.2.0",
     "ember-cli-eslint": "^5.1.0",
     "ember-cli-inject-live-reload": "^2.0.2",
+    "ember-cli-sass": "^10.0.1",
     "ember-cli-sri": "^2.1.1",
     "ember-cli-template-lint": "^1.0.0-beta.3",
     "ember-cli-uglify": "^3.0.0",
@@ -49,7 +52,9 @@
     "eslint-plugin-ember": "^7.7.2",
     "eslint-plugin-node": "^11.0.0",
     "loader.js": "^4.7.0",
-    "qunit-dom": "^1.0.0"
+    "qunit-dom": "^1.0.0",
+    "sass": "^1.26.5",
+    "sass-lint": "^1.13.1"
   },
   "engines": {
     "node": "10.* || >= 12"