diff --git a/packages/core/src/lib/ui_builder.js b/packages/core/src/lib/ui_builder.js index c994f724b..4cad2ac3d 100644 --- a/packages/core/src/lib/ui_builder.js +++ b/packages/core/src/lib/ui_builder.js @@ -140,7 +140,9 @@ const ui_builder = function () { patternName: _.startCase( isSubgroupPattern ? pattern.patternSubgroup : pattern.patternGroup ), - patternDesc: '', + patternDesc: isSubgroupPattern + ? pattern.patternSubgroupData.markdown + : pattern.patternGroupData.markdown, patternPartial: `viewall-${pattern.patternGroup}-${ isSubgroupPattern ? pattern.patternSubgroup : 'all' }`, diff --git a/packages/docs/src/docs/pattern-documenting.md b/packages/docs/src/docs/pattern-documenting.md index 588896e0a..e0bddca33 100644 --- a/packages/docs/src/docs/pattern-documenting.md +++ b/packages/docs/src/docs/pattern-documenting.md @@ -11,7 +11,7 @@ sitemapPriority: '0.8' sitemapChangefreq: 'monthly' --- -Pattern documentation gives developers and designers the ability to provide context for their patterns. The documentation file consists of Markdown with YAML front matter. It should follow this format: +Pattern documentation gives developers and designers the ability to provide context for their patterns and subgroups. The documentation file consists of Markdown with YAML front matter. It should follow this format: ``` --- @@ -55,6 +55,19 @@ We'd name our documentation file: atoms/button/button~red.md ``` +## Documenting Subgroups + + +To document pattern subgroups, you need to create a companion `.md` file for that subgroup. For example create `_patters/atoms/buttons/_buttons.md` for a pattern subgroup. In the `.md` file, the above concept can be applied. The doc-file resolving works the following `{patternsRoot}/{pattern-group folder name}/{pattern-sub-group folder name}/_{pattern-sub-group raw name without prefixes}.md` + + +```markdown + +This is a *Markdown* description of the subgroup button. +``` + +In the future we'll even also provide the possibility to document groups as well. + ## Adding More Attributes to the Front Matter A future update of Pattern Lab will support more front matter attributes including: excludeFromStyleguide and links. diff --git a/packages/starterkit-handlebars-demo/dist/_patterns/molecules/buttons/_buttons.md b/packages/starterkit-handlebars-demo/dist/_patterns/molecules/buttons/_buttons.md new file mode 100644 index 000000000..dbdcdcbd6 --- /dev/null +++ b/packages/starterkit-handlebars-demo/dist/_patterns/molecules/buttons/_buttons.md @@ -0,0 +1,5 @@ +--- +order: 0 +--- + +A graphical element that indicates interactivity.