Merge branch 'dev' into fix-1019

Author: JosefBredereck

CUTTING_A_RELEASE.md

@@ -0,0 +1,73 @@
+# How To Cut a Pattern Lab Release
+
+We use a handful of tools to help automate and simplify the process of cutting a new Pattern Lab release. The most important ones being [Lerna](https://github.com/lerna/lerna) and [Auto](https://intuit.github.io/auto/).
+
+## Release Prep
+
+1. Make sure any/all the code ready to get released is merged down to the `dev` branch and all CI checks, etc are passing as expected
+
+2. Git checkout the `dev` branch locally and make sure:
+- You've run `yarn` to install the latest dependencies
+- You don't have any local changes pending
+
+```
+git checkout dev
+git pull
+yarn
+git status # confirm no pending changes
+```
+
+3. Before running the publish command, I also like to run the `build` command to be extra sure everything compiles fine locally (ex. Node.js version matches with the version of Sass that's installed, gotchas like that)
+
+```
+yarn build
+```
+
+4. You'll also want to make sure you have a `.env` file in your PL Node repo root (and create one if you don't)
+
+You can grab the NPM + Github tokens needed here by heading to https://github.com/settings/tokens/new (grant repo access)  and https://www.npmjs.com/settings/NPM_USER/tokens 
+
+```
+## .env
+export GH_TOKEN=PASTE_GITHUB_TOKEN_HERE
+export NPM_TOKEN=PASTE_NPM_TOKEN_HERE
+```
+
+I personally like to use zsh's `env` plugin (already installed with Oh My ZSH) which has instructions for enabling here https://github.com/johnhamelink/env-zsh
+
+> Pro tip: you can quickly check to see if your env variable tokens are available for these CLI commands by running `npx auto release --dry-run` which will throw an error if the tokens above can't be found!
+
+5. Finally you'll also want to confirm that you're logged into your NPM account with access to publish to the Pattern Lab NPM org by running `npm login` and following the prompts.
+
+## Cutting The Release
+
+6. Run the `publish` command
+
+Ok - with all that prep out of the way, the actual release process is pretty quick and should be super straightforward.
+
+Simply run the `yarn run publish` command and include the type of SEMVER release you want to cut. 
+
+So for example:
+
+```
+yarn run publish minor 
+
+## alternatively you can include the exact version you want to publish
+yarn run publish v5.14.0
+```
+
+Lerna should prompt you with a confirmation that the version about to get released matches up with what you expect ^
+
+7. Manually (re)run the `auto release` command?
+
+Ok, if everything built and published successfully, this final step may or may not be required... 
+
+Normally the `auto release` command should run automatically after Lerna finishes publishing to NPM. This command will create the Github release associated with the latest Git tag, add any relevant release notes, and comment on related PRs, however the last couple of releases required this last step to get re-run manually.
+
+Note that you'll need to replace the `from` and `use-version` version numbers to match the last previous Git tag and this next release getting cut.
+
+```
+npx auto release --from v5.11.1 --use-version v5.12.0
+```
+
+8. Confirm the [Github release](https://github.com/pattern-lab/patternlab-node/releases) was added and manually tweak any release notes as needed.

packages/cli/bin/build.js

@@ -19,6 +19,10 @@ function build(config, options) {
   // Initiate Pattern Lab core with the config
   const patternLab = pl(config);
 
+  if (options && options.watch) {
+    config.watch = options.watch;
+  }
+
   /**
    * Check whether a flag was passed for build
    * 1. Build only patterns
@@ -31,7 +35,7 @@ function build(config, options) {
   } else {
     // 2
     debug(`build: Building your project now into ${config.paths.public.root}`);
-    return patternLab.build(config.cleanPublic);
+    return patternLab.build(config);
   }
 }
 

packages/cli/bin/patternlab.js

@@ -20,8 +20,7 @@ log.on('patternlab.error', err => console.log(err)); // eslint-disable-line
 log.on('patternlab.info', msg => console.log(msg)); // eslint-disable-line
 
 // Conditionally register verbose logging
-const verboseLogs = verbose =>
-  log.on('patternlab.debug', msg => console.log(msg)); // eslint-disable-line
+const verboseLogs = () => log.on('patternlab.debug', msg => console.log(msg)); // eslint-disable-line
 
 // Conditionally unregister all logging
 const silenceLogs = () => {
@@ -58,7 +57,7 @@ cli
   .alias('compile')
   .description('Build Pattern Lab. Optionally (re-)build only the patterns')
   .option('-p, --patterns-only', 'Whether to only build patterns')
-  .option('--no-watch', 'Start watching for changes')
+  .option('--watch', 'Start watching for changes')
   .action(build);
 
 /**

packages/core/src/lib/object_factory.js

@@ -41,7 +41,10 @@ const Pattern = function(
   const info = this.getPatternInfo(
     pathObj,
     patternlab,
-    isPromoteToFlatPatternRun
+    isPromoteToFlatPatternRun ||
+      (patternlab &&
+        patternlab.config &&
+        patternlab.config.allPatternsAreDeeplyNested)
   );
 
   this.fileName = pathObj.name; // '00-colors'
@@ -258,7 +261,7 @@ Pattern.prototype = {
    *
    * @param {Patternlab} patternlab Current patternlab instance
    */
-  promoteFromFlatPatternToDirectory: function(patternlab) {
+  promoteFromDirectoryToFlatPattern: function(patternlab) {
     const p = new Pattern(this.relPath, this.jsonFileData, patternlab, true);
     // Only reset the specific fields, not everything
     Object.assign(this, {
@@ -287,7 +290,7 @@ Pattern.prototype = {
     const info = {
       // 00-colors(.mustache) is deeply nested in 00-atoms-/00-global/00-colors
       patternlab: patternlab,
-      patternHasOwnDir: !isPromoteToFlatPatternRun
+      patternHasOwnDir: isPromoteToFlatPatternRun
         ? path.basename(pathObj.dir).replace(prefixMatcher, '') ===
             pathObj.name.replace(prefixMatcher, '') ||
           path.basename(pathObj.dir).replace(prefixMatcher, '') ===

packages/core/src/lib/patternlab.js

@@ -307,6 +307,11 @@ module.exports = class PatternLab {
   // dive once to perform iterative populating of patternlab object
   processAllPatternsIterative(patterns_dir) {
     const self = this;
+
+    // before updating the patterns has to be reset, otherwise
+    // deleted pattern would still be present in the patterns array
+    this.patterns = [];
+
     const promiseAllPatternFiles = new Promise(function(resolve) {
       dive(
         patterns_dir,

packages/core/src/lib/plugin_manager.js

@@ -1,37 +1,8 @@
 'use strict';
 
 const plugin_manager = function() {
-  const path = require('path');
   const logger = require('./log');
 
-  const pluginMatcher = /^plugin-(.*)$/;
-
-  /**
-   * Loads a plugin
-   *
-   * @param modulePath {string} the path to the plugin
-   * @return {object} the loaded plugin
-   */
-  function loadPlugin(modulePath) {
-    return require(modulePath);
-  }
-
-  /**
-   * Given a path: return the plugin name if the path points to a valid plugin
-   * module directory, or false if it doesn't.
-   * @param filePath
-   * @returns Plugin name if exists or FALSE
-   */
-  function isPlugin(filePath) {
-    const baseName = path.basename(filePath);
-    const pluginMatch = baseName.match(pluginMatcher);
-
-    if (pluginMatch) {
-      return pluginMatch[1];
-    }
-    return false;
-  }
-
   /**
    * Looks for installed plugins, loads them, and invokes them
    * @param {object} patternlab
@@ -41,7 +12,7 @@ const plugin_manager = function() {
     foundPlugins.forEach(plugin => {
       logger.info(`Found plugin: ${plugin}`);
       logger.info(`Attempting to load and initialize plugin.`);
-      const pluginModule = loadPlugin(plugin);
+      const pluginModule = require(plugin);
       pluginModule(patternlab);
     });
   }
@@ -61,12 +32,6 @@ const plugin_manager = function() {
     intialize_plugins: patternlab => {
       initializePlugins(patternlab);
     },
-    load_plugin: modulePath => {
-      return loadPlugin(modulePath);
-    },
-    is_plugin: filePath => {
-      return isPlugin(filePath);
-    },
     raiseEvent: async (patternlab, eventName, ...args) => {
       await raiseEvent(patternlab, eventName, args);
     },

packages/core/src/lib/readDocumentation.js

@@ -56,12 +56,11 @@ module.exports = function(pattern, patternlab) {
       }
 
       if (
-        !markdownObject.hasOwnProperty('deeplyNested') ||
-        (markdownObject.hasOwnProperty('deeplyNested') &&
-          !markdownObject.deeplyNested)
+        markdownObject.hasOwnProperty('deeplyNested') &&
+        markdownObject.deeplyNested
       ) {
         // Reset to pattern without own pattern-directory
-        pattern.promoteFromFlatPatternToDirectory(patternlab);
+        pattern.promoteFromDirectoryToFlatPattern(patternlab);
       }
     } else {
       logger.warning(`error processing markdown for ${pattern.patternPartial}`);

packages/core/src/lib/watchPatternLabFiles.js

@@ -131,8 +131,31 @@ const watchPatternLabFiles = (
             file: p,
           }
         );
+      })
+      // the watcher does not react on unlink and unlinkDir
+      // events, so patterns are never removed
+      .on('unlink', async p => {
+        patternlab.graph.sync();
+        patternlab.graph.upgradeVersion();
+        await pluginMananger.raiseEvent(
+          patternlab,
+          events.PATTERNLAB_PATTERN_CHANGE,
+          {
+            file: p,
+          }
+        );
+      })
+      .on('unlinkDir', async p => {
+        patternlab.graph.sync();
+        patternlab.graph.upgradeVersion();
+        await pluginMananger.raiseEvent(
+          patternlab,
+          events.PATTERNLAB_PATTERN_CHANGE,
+          {
+            file: p,
+          }
+        );
       });
-
     patternlab.watchers[patternWatchPath] = patternWatcher;
   });
 

packages/core/test/object_factory_tests.js

@@ -79,7 +79,7 @@ tap.test(
         path.sep +
         'colors.mustache'
     );
-    test.equals(p.name, '00-atoms-00-global-00-colors');
+    test.equals(p.name, '00-atoms-00-global-colors');
     test.equals(p.subdir, path.join('00-atoms', '00-global', '00-colors'));
     test.equals(p.fileName, 'colors');
     test.equals(p.fileExtension, '.mustache');
@@ -88,9 +88,9 @@ tap.test(
     test.equals(p.patternName, 'Colors');
     test.equals(
       p.getPatternLink(pl),
-      '00-atoms-00-global-00-colors' +
+      '00-atoms-00-global-colors' +
         path.sep +
-        '00-atoms-00-global-00-colors.rendered.html'
+        '00-atoms-00-global-colors.rendered.html'
     );
     test.equals(p.patternGroup, 'atoms');
     test.equals(p.patternSubGroup, 'global');
@@ -117,8 +117,8 @@ tap.test('test Pattern name for variants correctly initialzed', function(test) {
       d: 123,
     }
   );
-  test.equals(p1.name, '00-atoms-00-global-00-colors-variant');
-  test.equals(p2.name, '00-atoms-00-global-00-colors-variant-minus');
+  test.equals(p1.name, '00-atoms-00-global-colors-variant');
+  test.equals(p2.name, '00-atoms-00-global-colors-variant-minus');
   test.end();
 });
 
@@ -153,10 +153,10 @@ tap.test('test Pattern with own-directory gets resetted as expected', function(
   test
 ) {
   var p = new Pattern('00-atoms/00-button/button.mustache', { d: 123 }, pl);
-  p.promoteFromFlatPatternToDirectory(pl);
+  p.promoteFromDirectoryToFlatPattern(pl);
 
   test.equals(p.relPath, path.join('00-atoms', '00-button', 'button.mustache'));
-  test.equals(p.name, '00-atoms-00-button-button');
+  test.equals(p.name, '00-atoms-00-button');
   test.equals(p.subdir, path.join('00-atoms', '00-button'));
   test.equals(p.fileName, 'button');
   test.equals(p.fileExtension, '.mustache');
@@ -165,13 +165,10 @@ tap.test('test Pattern with own-directory gets resetted as expected', function(
   test.equals(p.patternName, 'Button');
   test.equals(
     p.getPatternLink(pl),
-    path.join(
-      '00-atoms-00-button-button',
-      '00-atoms-00-button-button.rendered.html'
-    )
+    path.join('00-atoms-00-button', '00-atoms-00-button.rendered.html')
   );
   test.equals(p.patternGroup, 'atoms');
-  test.equals(p.flatPatternPath, '00-atoms-00-button');
+  test.equals(p.flatPatternPath, '00-atoms');
   test.equals(p.patternPartial, 'atoms-button');
   test.equals(p.template, '');
   test.equals(p.lineage.length, 0);
@@ -255,7 +252,7 @@ tap.test(
       '00-atoms/00-global/00-colors-alt/colors-alt~variant.mustache',
       { d: 123 }
     );
-    test.equals(p.name, '00-atoms-00-global-00-colors-alt-variant');
+    test.equals(p.name, '00-atoms-00-global-colors-alt-variant');
     test.equals(p.flatPatternPath, '00-atoms-00-global');
     test.equals(p.patternBaseName, 'colors-alt-variant');
 
@@ -295,7 +292,7 @@ tap.test('test Patterns that are nested deeper without own directory', function(
     '00-atoms/00-global/00-random-folder/00-another-folder/00-colors-alt/colors-alt.mustache',
     { d: 123 }
   );
-  test.equals(p.name, '00-atoms-00-global-00-colors-alt');
+  test.equals(p.name, '00-atoms-00-global-colors-alt');
   test.equals(p.flatPatternPath, '00-atoms-00-global');
 
   var p = new Pattern(

packages/docs/src/docs/pattern-organization.md

@@ -59,3 +59,5 @@ The `deeplyNested` attribute is used to toggle the pattern building behavior and
 
 - **deeplyNested not set or false**  - Pattern won't be handled as a deeply nested pattern
 - **deeplyNested: true**  - Pattern will be handled like mentioned under [Deeper Nesting](#heading-deeper-nesting)
+
+To turn on this behavior globally, just add `"allPatternsAreDeeplyNested": true` to your `patternlab-config.json`.