diff --git a/client/galaxy/scripts/components/Alert.md b/client/galaxy/scripts/components/Alert.md
index 2e578282be3..021efd67e56 100644
--- a/client/galaxy/scripts/components/Alert.md
+++ b/client/galaxy/scripts/components/Alert.md
@@ -1,12 +1,10 @@
-# Basic alert types
-
-Default alert:
+### Default alert
```js
An alert with all defaults
```
-Alert variants:
+### Alert variants
```js
@@ -14,7 +12,7 @@ Alert variants:
```
-Dismissible:
+### Dismissible
```js
diff --git a/client/galaxy/scripts/components/Tags/StatelessTags.md b/client/galaxy/scripts/components/Tags/StatelessTags.md
new file mode 100644
index 00000000000..916362b0f33
--- /dev/null
+++ b/client/galaxy/scripts/components/Tags/StatelessTags.md
@@ -0,0 +1,11 @@
+### Default behavior with four simple tags
+
+```js
+
+```
+
+### Limiting maximum tags to two
+
+```js
+
+```
diff --git a/client/styleguide.config.js b/client/styleguide.config.js
index 34a66424b2e..d3d7d64d7e9 100644
--- a/client/styleguide.config.js
+++ b/client/styleguide.config.js
@@ -1,5 +1,6 @@
const path = require("path");
const glob = require("glob");
+const fs = require("fs");
const merge = require("webpack-merge");
let webpackConfig = require("./webpack.config.js");
@@ -47,7 +48,17 @@ glob.sync("./galaxy/docs/galaxy-*.md").forEach(file => {
const sections = [
{
name: 'Components',
- components: './galaxy/scripts/components/**/*.vue'
+ // Components that are directories will get their own section
+ sections: glob.sync("./galaxy/scripts/components/*").map(file => {
+ if (fs.lstatSync(file).isDirectory()) {
+ return {
+ name: path.basename(file),
+ components: file + "/**/*.vue"
+ };
+ }
+ }).filter( v => v ),
+ // ...while top level components are handled here.
+ components: './galaxy/scripts/components/*.vue',
},
{
name: 'Galaxy styles',