From b92e62b6d258a46487a9d6a6e1d1b123fd495ab7 Mon Sep 17 00:00:00 2001 From: Josef Engelfrost Date: Tue, 10 Jul 2018 21:26:56 +0200 Subject: [PATCH 01/12] fix(package): Allow .json extension on annotations file (issue #836) --- ...tion_exporter.js => annotationExporter.js} | 52 +++++++++++-------- packages/core/src/lib/exportData.js | 6 +-- .../core/test/annotation_exporter_tests.js | 6 +-- 3 files changed, 35 insertions(+), 29 deletions(-) rename packages/core/src/lib/{annotation_exporter.js => annotationExporter.js} (70%) diff --git a/packages/core/src/lib/annotation_exporter.js b/packages/core/src/lib/annotationExporter.js similarity index 70% rename from packages/core/src/lib/annotation_exporter.js rename to packages/core/src/lib/annotationExporter.js index 8fb22470d..06b336f6c 100644 --- a/packages/core/src/lib/annotation_exporter.js +++ b/packages/core/src/lib/annotationExporter.js @@ -6,43 +6,49 @@ const _ = require('lodash'); const mp = require('./markdown_parser'); const logger = require('./log'); -const annotations_exporter = function(pl) { +const annotationExporter = function(pl) { const paths = pl.config.paths; - let oldAnnotations; /** * Parses JS annotations. * @returns array of comments that used to be wrapped in raw JS */ - function parseAnnotationsJS() { + function parseAnnotationsJSON() { + const jsonPath = path.resolve(paths.source.annotations, 'annotations.json'); + let annotations; + //attempt to read the file try { - oldAnnotations = fs.readFileSync( - path.resolve(paths.source.annotations, 'annotations.js'), - 'utf8' - ); + if (fs.pathExistsSync(jsonPath)) { + //read the new file + annotations = fs.readFileSync(jsonPath, 'utf8'); + } else { + //read the old file + const jsPath = path.resolve(paths.source.annotations, 'annotations.js'); + + annotations = fs + .readFileSync(jsPath, 'utf8') + .replace(/^\s*var comments ?= ?/, '') + .replace(/};\s*$/, '}'); + + logger.info( + `Please convert ${jsPath} to JSON and rename it annotations.json.` + ); + } } catch (ex) { logger.debug( - `annotations.js file missing from ${ + `annotations.json file missing from ${ paths.source.annotations }. This may be expected if you do not use annotations or are using markdown.` ); return []; } - //parse as JSON by removing the old wrapping js syntax. comments and the trailing semi-colon - oldAnnotations = oldAnnotations.replace('var comments = ', ''); - oldAnnotations = oldAnnotations.replace('};', '}'); - try { - const oldAnnotationsJSON = JSON.parse(oldAnnotations); - return oldAnnotationsJSON.comments; + const annotationsJSON = JSON.parse(annotations); + return annotationsJSON.comments; } catch (ex) { - logger.error( - `There was an error parsing JSON for ${ - paths.source.annotations - }annotations.js` - ); + logger.error(`There was an error parsing JSON for ${jsonPath}`); return []; } } @@ -108,7 +114,7 @@ const annotations_exporter = function(pl) { * @returns array of annotations */ function gatherAnnotations() { - const annotationsJS = parseAnnotationsJS(); + const annotationsJS = parseAnnotationsJSON(); const annotationsMD = parseAnnotationsMD(); return _.unionBy(annotationsJS, annotationsMD, 'el'); } @@ -117,8 +123,8 @@ const annotations_exporter = function(pl) { gather: function() { return gatherAnnotations(); }, - gatherJS: function() { - return parseAnnotationsJS(); + gatherJSON: function() { + return parseAnnotationsJSON(); }, gatherMD: function() { return parseAnnotationsMD(); @@ -126,4 +132,4 @@ const annotations_exporter = function(pl) { }; }; -module.exports = annotations_exporter; +module.exports = annotationExporter; diff --git a/packages/core/src/lib/exportData.js b/packages/core/src/lib/exportData.js index 51b166a08..f0a00cb40 100644 --- a/packages/core/src/lib/exportData.js +++ b/packages/core/src/lib/exportData.js @@ -4,7 +4,7 @@ const eol = require('os').EOL; const path = require('path'); const _ = require('lodash'); -const ae = require('./annotation_exporter'); +const ae = require('./annotationExporter'); let fs = require('fs-extra'); //eslint-disable-line prefer-const @@ -13,7 +13,7 @@ let fs = require('fs-extra'); //eslint-disable-line prefer-const * @param patternlab - global data store */ module.exports = function(patternlab) { - const annotation_exporter = new ae(patternlab); + const annotationExporter = new ae(patternlab); const paths = patternlab.config.paths; @@ -68,7 +68,7 @@ module.exports = function(patternlab) { eol; //annotations - const annotationsJSON = annotation_exporter.gather(); + const annotationsJSON = annotationExporter.gather(); const annotations = 'var comments = { "comments" : ' + JSON.stringify(annotationsJSON) + '};'; _.each(patternlab.uikits, uikit => { diff --git a/packages/core/test/annotation_exporter_tests.js b/packages/core/test/annotation_exporter_tests.js index 68c7b2f48..9d8f6b57d 100644 --- a/packages/core/test/annotation_exporter_tests.js +++ b/packages/core/test/annotation_exporter_tests.js @@ -20,12 +20,12 @@ function createFakePatternLab(anPath, customProps) { } var patternlab = createFakePatternLab(anPath); -var ae = require('../src/lib/annotation_exporter')(patternlab); +var ae = require('../src/lib/annotationExporter')(patternlab); tap.test('converts old JS annotations into new format', function(test) { //arrange //act - var annotations = ae.gatherJS(); + var annotations = ae.gatherJSON(); //assert test.equals(annotations.length, 2); @@ -77,7 +77,7 @@ tap.test('merges both annotation methods into one array', function(test) { tap.test('when there are 0 annotation files', function(test) { var emptyAnPath = './test/files/empty/'; var patternlab2 = createFakePatternLab(emptyAnPath); - var ae2 = require('../src/lib/annotation_exporter')(patternlab2); + var ae2 = require('../src/lib/annotationExporter')(patternlab2); var annotations = ae2.gather(); test.equals(annotations.length, 0); From 27bd4cd0d6b1025f32a5affc0964b02d2fffc5e8 Mon Sep 17 00:00:00 2001 From: Brian Muenzenmeyer Date: Fri, 13 Jul 2018 10:18:51 -0500 Subject: [PATCH 02/12] fix(package): update mustache dependency --- packages/engine-mustache/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/engine-mustache/package.json b/packages/engine-mustache/package.json index 024ea8c6b..6116fe60b 100644 --- a/packages/engine-mustache/package.json +++ b/packages/engine-mustache/package.json @@ -5,7 +5,7 @@ "main": "lib/engine_mustache.js", "dependencies": { "fs-extra": "0.30.0", - "mustache": "2.2.0" + "mustache": "2.3.0" }, "keywords": [ "Pattern Lab", From 2b70ff4f2766d6dd8189c2db1f00d31a8d28e333 Mon Sep 17 00:00:00 2001 From: Brian Muenzenmeyer Date: Fri, 13 Jul 2018 10:32:38 -0500 Subject: [PATCH 03/12] fix(package): update tap dependency --- packages/cli/package.json | 2 +- packages/core/package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/cli/package.json b/packages/cli/package.json index a3cd8497a..82da86012 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -30,7 +30,7 @@ "eslint-plugin-prettier": "2.6.0", "prettier": "1.11.1", "proxyquire": "2.0.1", - "tap": "11.1.1" + "tap": "11.1.5" }, "files": [ "bin" diff --git a/packages/core/package.json b/packages/core/package.json index 20b9015bf..d0e5983df 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -30,7 +30,7 @@ "pretty-quick": "1.2.2", "rewire": "2.5.2", "standard-version": "4.3.0", - "tap": "11.1.1" + "tap": "11.1.5" }, "keywords": [ "Pattern Lab", From 207eb5b4e5181ff6bdeadec1cb2066d60e924de0 Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Sat, 21 Jul 2018 11:26:14 -0400 Subject: [PATCH 04/12] refactor: port over Twig partials from Styleguidekit Twig Default's repo, updating to match more recent UIkit JS and CSS updates --- packages/uikit-workshop/views-twig/README | 1 + .../views-twig/partials/general-footer.twig | 56 +++++++++++++++++++ .../views-twig/partials/general-header.twig | 1 + .../views-twig/partials/patternSection.twig | 34 +++++++++++ .../partials/patternSectionSubtype.twig | 11 ++++ .../uikit-workshop/views-twig/viewall.twig | 13 +++++ 6 files changed, 116 insertions(+) create mode 100755 packages/uikit-workshop/views-twig/README create mode 100755 packages/uikit-workshop/views-twig/partials/general-footer.twig create mode 100755 packages/uikit-workshop/views-twig/partials/general-header.twig create mode 100755 packages/uikit-workshop/views-twig/partials/patternSection.twig create mode 100755 packages/uikit-workshop/views-twig/partials/patternSectionSubtype.twig create mode 100755 packages/uikit-workshop/views-twig/viewall.twig diff --git a/packages/uikit-workshop/views-twig/README b/packages/uikit-workshop/views-twig/README new file mode 100755 index 000000000..14208f4c9 --- /dev/null +++ b/packages/uikit-workshop/views-twig/README @@ -0,0 +1 @@ +There should be no reason to touch these files in day-to-day use. \ No newline at end of file diff --git a/packages/uikit-workshop/views-twig/partials/general-footer.twig b/packages/uikit-workshop/views-twig/partials/general-footer.twig new file mode 100755 index 000000000..aca705d9c --- /dev/null +++ b/packages/uikit-workshop/views-twig/partials/general-footer.twig @@ -0,0 +1,56 @@ + + + + + + + diff --git a/packages/uikit-workshop/views-twig/partials/general-header.twig b/packages/uikit-workshop/views-twig/partials/general-header.twig new file mode 100755 index 000000000..6a74a9766 --- /dev/null +++ b/packages/uikit-workshop/views-twig/partials/general-header.twig @@ -0,0 +1 @@ + diff --git a/packages/uikit-workshop/views-twig/partials/patternSection.twig b/packages/uikit-workshop/views-twig/partials/patternSection.twig new file mode 100755 index 000000000..e085c40c4 --- /dev/null +++ b/packages/uikit-workshop/views-twig/partials/patternSection.twig @@ -0,0 +1,34 @@ +
+ +
+

+ + {{ partial.patternName }} + {% if partial.patternState %} + {{ partial.patternState }} + {% endif %} + +

+ + +
+ {{ partial.patternBreadcrumb }} +
+ + + +
+ +
+ +
+ {{ partial.patternPartialCode | raw }} +
+ + + +
diff --git a/packages/uikit-workshop/views-twig/partials/patternSectionSubtype.twig b/packages/uikit-workshop/views-twig/partials/patternSectionSubtype.twig new file mode 100755 index 000000000..ce449c607 --- /dev/null +++ b/packages/uikit-workshop/views-twig/partials/patternSectionSubtype.twig @@ -0,0 +1,11 @@ +
+ +

+ {{ partial.patternName }} +

+ +
+ {{ partial.patternDesc | raw }} +
+ +
diff --git a/packages/uikit-workshop/views-twig/viewall.twig b/packages/uikit-workshop/views-twig/viewall.twig new file mode 100755 index 000000000..42656abed --- /dev/null +++ b/packages/uikit-workshop/views-twig/viewall.twig @@ -0,0 +1,13 @@ + +
+ +
+ {% for partial in partials %} + {% if partial.patternSectionSubtype %} + {% include "@uikit/patternSectionSubtype.twig" %} + {% else %} + {% include "@uikit/patternSection.twig" %} + {% endif %} + {% endfor %} +
+
From 52d0d978e7ff6dc93d739da8c1c4aaf539a77dbe Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Sat, 21 Jul 2018 11:28:46 -0400 Subject: [PATCH 05/12] refactor: add @pattern-lab/starterkit-twig-demo as a dependency to test Twig PHP compiles properly; update demo config to point at assets for the time being --- packages/edition-twig/package-lock.json | 13 +++++++++ packages/edition-twig/package.json | 4 +-- packages/edition-twig/patternlab-config.json | 30 ++++++++++---------- 3 files changed, 30 insertions(+), 17 deletions(-) create mode 100644 packages/edition-twig/package-lock.json diff --git a/packages/edition-twig/package-lock.json b/packages/edition-twig/package-lock.json new file mode 100644 index 000000000..cb30f303e --- /dev/null +++ b/packages/edition-twig/package-lock.json @@ -0,0 +1,13 @@ +{ + "name": "@pattern-lab/edition-twig", + "version": "3.0.0-alpha.1", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "@pattern-lab/starterkit-twig-demo": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/@pattern-lab/starterkit-twig-demo/-/starterkit-twig-demo-4.0.0.tgz", + "integrity": "sha512-GDSKRgDT4BugTcEDRv3oH0+Lc9sUHWbUS6L1GPsLHr5PsJ/AdGdQOqTfrePZJMq2d/4xxGxQLAH2Ua6wagg0eg==" + } + } +} diff --git a/packages/edition-twig/package.json b/packages/edition-twig/package.json index 5c389c034..98aefd27d 100644 --- a/packages/edition-twig/package.json +++ b/packages/edition-twig/package.json @@ -23,9 +23,9 @@ "dependencies": { "@pattern-lab/cli": "^0.0.1-alpha.19", "@pattern-lab/core": "^3.0.0-alpha.13", - "@pattern-lab/engine-mustache": "^2.0.0-alpha.6", "@pattern-lab/engine-twig-php": "^0.1.0", - "@pattern-lab/uikit-workshop": "^1.0.0-alpha.5" + "@pattern-lab/uikit-workshop": "^1.0.0-alpha.5", + "@pattern-lab/starterkit-twig-demo": "^4.0.0" }, "engines": { "node": ">=6.0" diff --git a/packages/edition-twig/patternlab-config.json b/packages/edition-twig/patternlab-config.json index 4c6b2358a..90a028730 100644 --- a/packages/edition-twig/patternlab-config.json +++ b/packages/edition-twig/patternlab-config.json @@ -6,42 +6,42 @@ "id": "atoms", "recursive": true, "paths": [ - "source/_patterns/00-atoms" + "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/00-atoms" ] }, { "id": "molecules", "recursive": true, "paths": [ - "source/_patterns/01-molecules" + "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/01-molecules" ] }, { "id": "organisms", "recursive": true, "paths": [ - "source/_patterns/02-organisms" + "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/02-organisms" ] }, { "id": "templates", "recursive": true, "paths": [ - "source/_patterns/03-templates" + "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/03-templates" ] }, { "id": "pages", "recursive": true, "paths": [ - "source/_patterns/04-pages" + "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/04-pages" ] }, { "id": "macros", "recursive": true, "paths": [ - "source/_macros" + "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_macros" ] } ], @@ -94,11 +94,11 @@ }, "paths": { "source": { - "root": "./source/", - "patterns": "./source/_patterns/", - "data": "./source/_data/", - "meta": "./source/_meta/", - "annotations": "./source/_annotations/", + "root": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/", + "patterns": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/", + "data": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_data/", + "meta": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_meta/", + "annotations": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_annotations/", "styleguide": "dist/", "patternlabFiles": { "general-header": "views/partials/general-header.mustache", @@ -107,10 +107,10 @@ "patternSectionSubtype": "views/partials/patternSectionSubtype.mustache", "viewall": "views/viewall.mustache" }, - "js": "./source/js", - "images": "./source/images", - "fonts": "./source/fonts", - "css": "./source/css" + "js": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/js", + "images": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/images", + "fonts": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/fonts", + "css": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/css" }, "public": { "root": "public/", From 5426bc4c84dfdae65062954af1c7a9ca645f83b7 Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Sat, 21 Jul 2018 11:30:37 -0400 Subject: [PATCH 06/12] refactor: refactor PL node to support the ability to have uikit view templates not be inlined (aka allow Twig namespaced paths to point at these templates vs inlining the contents) --- packages/core/src/lib/buildFooter.js | 19 +++++--- packages/core/src/lib/buildPatterns.js | 25 ++++++++-- packages/core/src/lib/compose.js | 16 ++++++- packages/core/src/lib/loaduikits.js | 49 +++++++++++++------- packages/core/src/lib/ui_builder.js | 40 +++++++++++++--- packages/edition-twig/patternlab-config.json | 32 +++++++++++-- 6 files changed, 141 insertions(+), 40 deletions(-) diff --git a/packages/core/src/lib/buildFooter.js b/packages/core/src/lib/buildFooter.js index 5a3eb6217..8958363c5 100644 --- a/packages/core/src/lib/buildFooter.js +++ b/packages/core/src/lib/buildFooter.js @@ -15,12 +15,19 @@ let render = require('./render'); //eslint-disable-line prefer-const */ module.exports = function(patternlab, patternPartial, uikit) { //first render the general footer - return render(Pattern.createEmpty({ extendedTemplate: uikit.footer }), { - patternData: JSON.stringify({ - patternPartial: patternPartial, - }), - cacheBuster: patternlab.cacheBuster, - }) + return render( + Pattern.createEmpty( + uikit.footer.path + ? { relPath: uikit.footer.path } + : { extendedTemplate: uikit.footer } + ), + { + patternData: JSON.stringify({ + patternPartial: patternPartial, + }), + cacheBuster: patternlab.cacheBuster, + } + ) .then(footerPartial => { let allFooterData; try { diff --git a/packages/core/src/lib/buildPatterns.js b/packages/core/src/lib/buildPatterns.js index 51dcea8b3..22b930190 100644 --- a/packages/core/src/lib/buildPatterns.js +++ b/packages/core/src/lib/buildPatterns.js @@ -100,12 +100,29 @@ module.exports = (deletePatternDir, patternlab, additionalData) => { //cascade any patternStates lineage_hunter.cascade_pattern_states(patternlab); + let plHeader = Pattern.createEmpty({ + extendedTemplate: patternlab.header, + }); + + // because patternlab.header doesn't yet exist, we need to check the first uikit condfig specified to see if a template path is defined there, otherwise use the original default logic. + if ( + patternlab.header === undefined && + patternlab.uikits[Object.keys(patternlab.uikits)[0]] + .header !== undefined && + patternlab.uikits[Object.keys(patternlab.uikits)[0]].header + .path !== undefined + ) { + plHeader = Pattern.createEmpty({ + relPath: + patternlab.uikits[Object.keys(patternlab.uikits)[0]] + .header.path, + }); + } + //set the pattern-specific header by compiling the general-header with data, and then adding it to the meta header return render( - Pattern.createEmpty({ - // todo should this be uikit.header? - extendedTemplate: patternlab.header, - }), + // todo should this be uikit.header? + plHeader, { cacheBuster: patternlab.cacheBuster, } diff --git a/packages/core/src/lib/compose.js b/packages/core/src/lib/compose.js index 86b2f8f91..958c9c853 100644 --- a/packages/core/src/lib/compose.js +++ b/packages/core/src/lib/compose.js @@ -68,7 +68,13 @@ module.exports = function(pattern, patternlab) { headPromise = render(patternlab.userHead, allData); } else { headPromise = render( - Pattern.createEmpty({ extendedTemplate: uikit.header }), + Pattern.createEmpty( + uikit.header.path + ? { + relPath: uikit.header.path, + } + : { extendedTemplate: uikit.header } + ), allData ); } @@ -131,7 +137,13 @@ module.exports = function(pattern, patternlab) { //set the pattern-specific footer by compiling the general-footer with data, and then adding it to the meta footer const footerPartialPromise = render( - Pattern.createEmpty({ extendedTemplate: uikit.footer }), + Pattern.createEmpty( + uikit.footer.path + ? { + relPath: uikit.footer.path, + } + : { extendedTemplate: uikit.footer } + ), { isPattern: pattern.isPattern, patternData: pattern.patternData, diff --git a/packages/core/src/lib/loaduikits.js b/packages/core/src/lib/loaduikits.js index 1f97564a2..c7bb231e9 100644 --- a/packages/core/src/lib/loaduikits.js +++ b/packages/core/src/lib/loaduikits.js @@ -68,23 +68,38 @@ module.exports = patternlab => { outputDir: configEntry.outputDir, excludedPatternStates: configEntry.excludedPatternStates, excludedTags: configEntry.excludedTags, - header: readModuleFile( - kit, - paths.source.patternlabFiles['general-header'] - ), - footer: readModuleFile( - kit, - paths.source.patternlabFiles['general-footer'] - ), - patternSection: readModuleFile( - kit, - paths.source.patternlabFiles.patternSection - ), - patternSectionSubType: readModuleFile( - kit, - paths.source.patternlabFiles.patternSectionSubtype - ), - viewAll: readModuleFile(kit, paths.source.patternlabFiles.viewall), + + /** + * If the uikit asset config isn't a simple string path but an object, + * don't automatically inline the file's contents. This also keeps the + * door open for more advanced configurations down the road! + */ + header: typeof ( + paths.source.patternlabFiles['general-footer'] === 'object' + ) + ? paths.source.patternlabFiles['general-header'] + : readModuleFile(kit, paths.source.patternlabFiles['general-footer']), + footer: typeof ( + paths.source.patternlabFiles['general-footer'] === 'object' + ) + ? paths.source.patternlabFiles['general-footer'] + : readModuleFile(kit, paths.source.patternlabFiles['general-footer']), + patternSection: typeof ( + paths.source.patternlabFiles.patternSection === 'object' + ) + ? paths.source.patternlabFiles.patternSection + : readModuleFile(kit, paths.source.patternlabFiles.patternSection), + patternSectionSubType: typeof ( + paths.source.patternlabFiles.patternSectionSubType === 'object' + ) + ? paths.source.patternlabFiles.patternSectionSubType + : readModuleFile( + kit, + paths.source.patternlabFiles.patternSectionSubType + ), + viewAll: typeof (paths.source.patternlabFiles.viewall === 'object') + ? paths.source.patternlabFiles.viewall + : readModuleFile(kit, paths.source.patternlabFiles.viewall), }; // [3] } catch (ex) { logger.error(ex); diff --git a/packages/core/src/lib/ui_builder.js b/packages/core/src/lib/ui_builder.js index 96229e08c..6194dc7af 100644 --- a/packages/core/src/lib/ui_builder.js +++ b/packages/core/src/lib/ui_builder.js @@ -519,7 +519,13 @@ const ui_builder = function() { */ function buildViewAllHTML(patternlab, patterns, patternPartial, uikit) { return render( - Pattern.createEmpty({ extendedTemplate: uikit.viewAll }), + Pattern.createEmpty( + uikit.viewAll.path + ? { + relPath: uikit.viewAll.path, + } + : { extendedTemplate: uikit.viewAll } + ), { //data partials: patterns, @@ -764,7 +770,15 @@ const ui_builder = function() { return new Promise(resolve => { //set the pattern-specific header by compiling the general-header with data, and then adding it to the meta header const headerPromise = render( - Pattern.createEmpty({ extendedTemplate: uikit.header }), + Pattern.createEmpty( + uikit.header.path + ? { + relPath: uikit.header.path, + } + : { + extendedTemplate: uikit.header, + } + ), { cacheBuster: patternlab.cacheBuster, } @@ -782,7 +796,15 @@ const ui_builder = function() { //set the pattern-specific footer by compiling the general-footer with data, and then adding it to the meta footer const footerPromise = render( - Pattern.createEmpty({ extendedTemplate: uikit.footer }), + Pattern.createEmpty( + uikit.footer.path + ? { + relPath: uikit.footer.path, + } + : { + extendedTemplate: uikit.footer, + } + ), { patternData: '{}', cacheBuster: patternlab.cacheBuster, @@ -824,9 +846,15 @@ const ui_builder = function() { //build the main styleguide page return render( - Pattern.createEmpty({ - extendedTemplate: uikit.viewAll, - }), + Pattern.createEmpty( + uikit.viewAll.path + ? { + relPath: uikit.viewAll.path, + } + : { + extendedTemplate: uikit.viewAll, + } + ), { partials: uniquePatterns, }, diff --git a/packages/edition-twig/patternlab-config.json b/packages/edition-twig/patternlab-config.json index 90a028730..d303344c5 100644 --- a/packages/edition-twig/patternlab-config.json +++ b/packages/edition-twig/patternlab-config.json @@ -2,6 +2,13 @@ "engines": { "twig": { "namespaces": [ + { + "id": "uikit", + "recursive": true, + "paths": [ + "../uikit-workshop/views-twig/" + ] + }, { "id": "atoms", "recursive": true, @@ -101,11 +108,26 @@ "annotations": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_annotations/", "styleguide": "dist/", "patternlabFiles": { - "general-header": "views/partials/general-header.mustache", - "general-footer": "views/partials/general-footer.mustache", - "patternSection": "views/partials/patternSection.mustache", - "patternSectionSubtype": "views/partials/patternSectionSubtype.mustache", - "viewall": "views/viewall.mustache" + "general-header": { + "inline": false, + "path": "@uikit/general-header.twig" + }, + "general-footer": { + "inline": false, + "path": "@uikit/general-footer.twig" + }, + "patternSection": { + "inline": false, + "path": "@uikit/patternSection.twig" + }, + "patternSectionSubtype": { + "inline": false, + "path": "@uikit/patternSectionSubtype.twig" + }, + "viewall": { + "inline": false, + "path": "@uikit/viewall.twig" + } }, "js": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/js", "images": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/images", From 3d0a0ac8a15db9b4d2da60a22547c1e7977035db Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Sat, 21 Jul 2018 11:55:42 -0400 Subject: [PATCH 07/12] chore: remove unused config option --- packages/edition-twig/patternlab-config.json | 5 ----- 1 file changed, 5 deletions(-) diff --git a/packages/edition-twig/patternlab-config.json b/packages/edition-twig/patternlab-config.json index d303344c5..a4d00d3b2 100644 --- a/packages/edition-twig/patternlab-config.json +++ b/packages/edition-twig/patternlab-config.json @@ -109,23 +109,18 @@ "styleguide": "dist/", "patternlabFiles": { "general-header": { - "inline": false, "path": "@uikit/general-header.twig" }, "general-footer": { - "inline": false, "path": "@uikit/general-footer.twig" }, "patternSection": { - "inline": false, "path": "@uikit/patternSection.twig" }, "patternSectionSubtype": { - "inline": false, "path": "@uikit/patternSectionSubtype.twig" }, "viewall": { - "inline": false, "path": "@uikit/viewall.twig" } }, From 0c965cc7f7fca2d5100f2e92438f5799bb934fe7 Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Sat, 21 Jul 2018 20:18:57 -0400 Subject: [PATCH 08/12] fix: clean up Pattern.createEmpty conditionals to improve readability; fix typo / formatting bug causing mustache loader to not compile base UI templates as expected --- packages/core/src/lib/buildFooter.js | 8 ++-- packages/core/src/lib/compose.js | 20 +++------- packages/core/src/lib/loaduikits.js | 55 +++++++++++++++------------- packages/core/src/lib/ui_builder.js | 50 ++++++++----------------- 4 files changed, 54 insertions(+), 79 deletions(-) diff --git a/packages/core/src/lib/buildFooter.js b/packages/core/src/lib/buildFooter.js index 8958363c5..ec839d470 100644 --- a/packages/core/src/lib/buildFooter.js +++ b/packages/core/src/lib/buildFooter.js @@ -16,11 +16,9 @@ let render = require('./render'); //eslint-disable-line prefer-const module.exports = function(patternlab, patternPartial, uikit) { //first render the general footer return render( - Pattern.createEmpty( - uikit.footer.path - ? { relPath: uikit.footer.path } - : { extendedTemplate: uikit.footer } - ), + uikit.footer.path + ? Pattern.createEmpty({ relPath: uikit.footer.path }) + : Pattern.createEmpty({ extendedTemplate: uikit.footer }), { patternData: JSON.stringify({ patternPartial: patternPartial, diff --git a/packages/core/src/lib/compose.js b/packages/core/src/lib/compose.js index 958c9c853..880977286 100644 --- a/packages/core/src/lib/compose.js +++ b/packages/core/src/lib/compose.js @@ -68,13 +68,9 @@ module.exports = function(pattern, patternlab) { headPromise = render(patternlab.userHead, allData); } else { headPromise = render( - Pattern.createEmpty( - uikit.header.path - ? { - relPath: uikit.header.path, - } - : { extendedTemplate: uikit.header } - ), + uikit.header.path + ? Pattern.createEmpty({ relPath: uikit.header.path }) + : Pattern.createEmpty({ extendedTemplate: uikit.header }), allData ); } @@ -137,13 +133,9 @@ module.exports = function(pattern, patternlab) { //set the pattern-specific footer by compiling the general-footer with data, and then adding it to the meta footer const footerPartialPromise = render( - Pattern.createEmpty( - uikit.footer.path - ? { - relPath: uikit.footer.path, - } - : { extendedTemplate: uikit.footer } - ), + uikit.footer.path + ? Pattern.createEmpty({ relPath: uikit.footer.path }) + : Pattern.createEmpty({ extendedTemplate: uikit.footer }), { isPattern: pattern.isPattern, patternData: pattern.patternData, diff --git a/packages/core/src/lib/loaduikits.js b/packages/core/src/lib/loaduikits.js index c7bb231e9..d2025237e 100644 --- a/packages/core/src/lib/loaduikits.js +++ b/packages/core/src/lib/loaduikits.js @@ -74,32 +74,35 @@ module.exports = patternlab => { * don't automatically inline the file's contents. This also keeps the * door open for more advanced configurations down the road! */ - header: typeof ( - paths.source.patternlabFiles['general-footer'] === 'object' - ) - ? paths.source.patternlabFiles['general-header'] - : readModuleFile(kit, paths.source.patternlabFiles['general-footer']), - footer: typeof ( - paths.source.patternlabFiles['general-footer'] === 'object' - ) - ? paths.source.patternlabFiles['general-footer'] - : readModuleFile(kit, paths.source.patternlabFiles['general-footer']), - patternSection: typeof ( - paths.source.patternlabFiles.patternSection === 'object' - ) - ? paths.source.patternlabFiles.patternSection - : readModuleFile(kit, paths.source.patternlabFiles.patternSection), - patternSectionSubType: typeof ( - paths.source.patternlabFiles.patternSectionSubType === 'object' - ) - ? paths.source.patternlabFiles.patternSectionSubType - : readModuleFile( - kit, - paths.source.patternlabFiles.patternSectionSubType - ), - viewAll: typeof (paths.source.patternlabFiles.viewall === 'object') - ? paths.source.patternlabFiles.viewall - : readModuleFile(kit, paths.source.patternlabFiles.viewall), + header: + typeof paths.source.patternlabFiles['general-header'] === 'object' + ? paths.source.patternlabFiles['general-header'] + : readModuleFile( + kit, + paths.source.patternlabFiles['general-header'] + ), + footer: + typeof paths.source.patternlabFiles['general-footer'] === 'object' + ? paths.source.patternlabFiles['general-footer'] + : readModuleFile( + kit, + paths.source.patternlabFiles['general-footer'] + ), + patternSection: + typeof paths.source.patternlabFiles.patternSection === 'object' + ? paths.source.patternlabFiles.patternSection + : readModuleFile(kit, paths.source.patternlabFiles.patternSection), + patternSectionSubType: + typeof paths.source.patternlabFiles.patternSectionSubtype === 'object' + ? paths.source.patternlabFiles.patternSectionSubtype + : readModuleFile( + kit, + paths.source.patternlabFiles.patternSectionSubtype + ), + viewAll: + typeof paths.source.patternlabFiles.viewall === 'object' + ? paths.source.patternlabFiles.viewall + : readModuleFile(kit, paths.source.patternlabFiles.viewall), }; // [3] } catch (ex) { logger.error(ex); diff --git a/packages/core/src/lib/ui_builder.js b/packages/core/src/lib/ui_builder.js index 6194dc7af..7802f81cd 100644 --- a/packages/core/src/lib/ui_builder.js +++ b/packages/core/src/lib/ui_builder.js @@ -519,13 +519,9 @@ const ui_builder = function() { */ function buildViewAllHTML(patternlab, patterns, patternPartial, uikit) { return render( - Pattern.createEmpty( - uikit.viewAll.path - ? { - relPath: uikit.viewAll.path, - } - : { extendedTemplate: uikit.viewAll } - ), + uikit.viewAll.path + ? Pattern.createEmpty({ relPath: uikit.viewAll.path }) + : Pattern.createEmpty({ extendedTemplate: uikit.viewAll }), { //data partials: patterns, @@ -770,15 +766,9 @@ const ui_builder = function() { return new Promise(resolve => { //set the pattern-specific header by compiling the general-header with data, and then adding it to the meta header const headerPromise = render( - Pattern.createEmpty( - uikit.header.path - ? { - relPath: uikit.header.path, - } - : { - extendedTemplate: uikit.header, - } - ), + uikit.header.path + ? Pattern.createEmpty({ relPath: uikit.header.path }) + : Pattern.createEmpty({ extendedTemplate: uikit.header }), { cacheBuster: patternlab.cacheBuster, } @@ -796,15 +786,9 @@ const ui_builder = function() { //set the pattern-specific footer by compiling the general-footer with data, and then adding it to the meta footer const footerPromise = render( - Pattern.createEmpty( - uikit.footer.path - ? { - relPath: uikit.footer.path, - } - : { - extendedTemplate: uikit.footer, - } - ), + uikit.footer.path + ? Pattern.createEmpty({ relPath: uikit.footer.path }) + : Pattern.createEmpty({ extendedTemplate: uikit.footer }), { patternData: '{}', cacheBuster: patternlab.cacheBuster, @@ -846,15 +830,13 @@ const ui_builder = function() { //build the main styleguide page return render( - Pattern.createEmpty( - uikit.viewAll.path - ? { - relPath: uikit.viewAll.path, - } - : { - extendedTemplate: uikit.viewAll, - } - ), + uikit.viewAll.path + ? Pattern.createEmpty({ + relPath: uikit.viewAll.path, + }) + : Pattern.createEmpty({ + extendedTemplate: uikit.viewAll, + }), { partials: uniquePatterns, }, From d5105501cb63cd3ab0e0f0598da189e7e8930372 Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Sun, 22 Jul 2018 09:57:50 -0400 Subject: [PATCH 09/12] Revert "Merge branch 'dev' into feature/engine-twig-php--uikit-twig" This reverts commit 9edae656a8baa159b568c398e2db648c39a37508, reversing changes made to 0c965cc7f7fca2d5100f2e92438f5799bb934fe7. --- packages/cli/package.json | 2 +- packages/core/package.json | 2 +- ...tionExporter.js => annotation_exporter.js} | 52 ++++++++----------- packages/core/src/lib/exportData.js | 6 +-- .../core/test/annotation_exporter_tests.js | 6 +-- packages/engine-mustache/package.json | 2 +- 6 files changed, 32 insertions(+), 38 deletions(-) rename packages/core/src/lib/{annotationExporter.js => annotation_exporter.js} (70%) diff --git a/packages/cli/package.json b/packages/cli/package.json index b92ba64b4..935ea6906 100644 --- a/packages/cli/package.json +++ b/packages/cli/package.json @@ -30,7 +30,7 @@ "eslint-plugin-prettier": "2.6.0", "prettier": "1.11.1", "proxyquire": "2.0.1", - "tap": "11.1.5" + "tap": "11.1.1" }, "files": [ "bin" diff --git a/packages/core/package.json b/packages/core/package.json index d0e5983df..20b9015bf 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -30,7 +30,7 @@ "pretty-quick": "1.2.2", "rewire": "2.5.2", "standard-version": "4.3.0", - "tap": "11.1.5" + "tap": "11.1.1" }, "keywords": [ "Pattern Lab", diff --git a/packages/core/src/lib/annotationExporter.js b/packages/core/src/lib/annotation_exporter.js similarity index 70% rename from packages/core/src/lib/annotationExporter.js rename to packages/core/src/lib/annotation_exporter.js index 06b336f6c..8fb22470d 100644 --- a/packages/core/src/lib/annotationExporter.js +++ b/packages/core/src/lib/annotation_exporter.js @@ -6,49 +6,43 @@ const _ = require('lodash'); const mp = require('./markdown_parser'); const logger = require('./log'); -const annotationExporter = function(pl) { +const annotations_exporter = function(pl) { const paths = pl.config.paths; + let oldAnnotations; /** * Parses JS annotations. * @returns array of comments that used to be wrapped in raw JS */ - function parseAnnotationsJSON() { - const jsonPath = path.resolve(paths.source.annotations, 'annotations.json'); - let annotations; - + function parseAnnotationsJS() { //attempt to read the file try { - if (fs.pathExistsSync(jsonPath)) { - //read the new file - annotations = fs.readFileSync(jsonPath, 'utf8'); - } else { - //read the old file - const jsPath = path.resolve(paths.source.annotations, 'annotations.js'); - - annotations = fs - .readFileSync(jsPath, 'utf8') - .replace(/^\s*var comments ?= ?/, '') - .replace(/};\s*$/, '}'); - - logger.info( - `Please convert ${jsPath} to JSON and rename it annotations.json.` - ); - } + oldAnnotations = fs.readFileSync( + path.resolve(paths.source.annotations, 'annotations.js'), + 'utf8' + ); } catch (ex) { logger.debug( - `annotations.json file missing from ${ + `annotations.js file missing from ${ paths.source.annotations }. This may be expected if you do not use annotations or are using markdown.` ); return []; } + //parse as JSON by removing the old wrapping js syntax. comments and the trailing semi-colon + oldAnnotations = oldAnnotations.replace('var comments = ', ''); + oldAnnotations = oldAnnotations.replace('};', '}'); + try { - const annotationsJSON = JSON.parse(annotations); - return annotationsJSON.comments; + const oldAnnotationsJSON = JSON.parse(oldAnnotations); + return oldAnnotationsJSON.comments; } catch (ex) { - logger.error(`There was an error parsing JSON for ${jsonPath}`); + logger.error( + `There was an error parsing JSON for ${ + paths.source.annotations + }annotations.js` + ); return []; } } @@ -114,7 +108,7 @@ const annotationExporter = function(pl) { * @returns array of annotations */ function gatherAnnotations() { - const annotationsJS = parseAnnotationsJSON(); + const annotationsJS = parseAnnotationsJS(); const annotationsMD = parseAnnotationsMD(); return _.unionBy(annotationsJS, annotationsMD, 'el'); } @@ -123,8 +117,8 @@ const annotationExporter = function(pl) { gather: function() { return gatherAnnotations(); }, - gatherJSON: function() { - return parseAnnotationsJSON(); + gatherJS: function() { + return parseAnnotationsJS(); }, gatherMD: function() { return parseAnnotationsMD(); @@ -132,4 +126,4 @@ const annotationExporter = function(pl) { }; }; -module.exports = annotationExporter; +module.exports = annotations_exporter; diff --git a/packages/core/src/lib/exportData.js b/packages/core/src/lib/exportData.js index f0a00cb40..51b166a08 100644 --- a/packages/core/src/lib/exportData.js +++ b/packages/core/src/lib/exportData.js @@ -4,7 +4,7 @@ const eol = require('os').EOL; const path = require('path'); const _ = require('lodash'); -const ae = require('./annotationExporter'); +const ae = require('./annotation_exporter'); let fs = require('fs-extra'); //eslint-disable-line prefer-const @@ -13,7 +13,7 @@ let fs = require('fs-extra'); //eslint-disable-line prefer-const * @param patternlab - global data store */ module.exports = function(patternlab) { - const annotationExporter = new ae(patternlab); + const annotation_exporter = new ae(patternlab); const paths = patternlab.config.paths; @@ -68,7 +68,7 @@ module.exports = function(patternlab) { eol; //annotations - const annotationsJSON = annotationExporter.gather(); + const annotationsJSON = annotation_exporter.gather(); const annotations = 'var comments = { "comments" : ' + JSON.stringify(annotationsJSON) + '};'; _.each(patternlab.uikits, uikit => { diff --git a/packages/core/test/annotation_exporter_tests.js b/packages/core/test/annotation_exporter_tests.js index 9d8f6b57d..68c7b2f48 100644 --- a/packages/core/test/annotation_exporter_tests.js +++ b/packages/core/test/annotation_exporter_tests.js @@ -20,12 +20,12 @@ function createFakePatternLab(anPath, customProps) { } var patternlab = createFakePatternLab(anPath); -var ae = require('../src/lib/annotationExporter')(patternlab); +var ae = require('../src/lib/annotation_exporter')(patternlab); tap.test('converts old JS annotations into new format', function(test) { //arrange //act - var annotations = ae.gatherJSON(); + var annotations = ae.gatherJS(); //assert test.equals(annotations.length, 2); @@ -77,7 +77,7 @@ tap.test('merges both annotation methods into one array', function(test) { tap.test('when there are 0 annotation files', function(test) { var emptyAnPath = './test/files/empty/'; var patternlab2 = createFakePatternLab(emptyAnPath); - var ae2 = require('../src/lib/annotationExporter')(patternlab2); + var ae2 = require('../src/lib/annotation_exporter')(patternlab2); var annotations = ae2.gather(); test.equals(annotations.length, 0); diff --git a/packages/engine-mustache/package.json b/packages/engine-mustache/package.json index 6116fe60b..024ea8c6b 100644 --- a/packages/engine-mustache/package.json +++ b/packages/engine-mustache/package.json @@ -5,7 +5,7 @@ "main": "lib/engine_mustache.js", "dependencies": { "fs-extra": "0.30.0", - "mustache": "2.3.0" + "mustache": "2.2.0" }, "keywords": [ "Pattern Lab", From 19fd272cce2082ab3a51921e115bbec2dc99093f Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Wed, 25 Jul 2018 07:32:44 -0400 Subject: [PATCH 10/12] chore: remove Twig starterkit dependency per PR feedback --- packages/edition-twig/package.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/edition-twig/package.json b/packages/edition-twig/package.json index 98aefd27d..ff85f95e6 100644 --- a/packages/edition-twig/package.json +++ b/packages/edition-twig/package.json @@ -24,8 +24,7 @@ "@pattern-lab/cli": "^0.0.1-alpha.19", "@pattern-lab/core": "^3.0.0-alpha.13", "@pattern-lab/engine-twig-php": "^0.1.0", - "@pattern-lab/uikit-workshop": "^1.0.0-alpha.5", - "@pattern-lab/starterkit-twig-demo": "^4.0.0" + "@pattern-lab/uikit-workshop": "^1.0.0-alpha.5" }, "engines": { "node": ">=6.0" From 018a9108ded29f4e164f01bbdd27e1a131cf504a Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Wed, 25 Jul 2018 07:36:38 -0400 Subject: [PATCH 11/12] chore: revert Twig starterkit-specific path changes --- packages/edition-twig/patternlab-config.json | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/edition-twig/patternlab-config.json b/packages/edition-twig/patternlab-config.json index a4d00d3b2..d8d448f8a 100644 --- a/packages/edition-twig/patternlab-config.json +++ b/packages/edition-twig/patternlab-config.json @@ -13,42 +13,42 @@ "id": "atoms", "recursive": true, "paths": [ - "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/00-atoms" + "source/_patterns/00-atoms" ] }, { "id": "molecules", "recursive": true, "paths": [ - "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/01-molecules" + "source/_patterns/01-molecules" ] }, { "id": "organisms", "recursive": true, "paths": [ - "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/02-organisms" + "source/_patterns/02-organisms" ] }, { "id": "templates", "recursive": true, "paths": [ - "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/03-templates" + "source/_patterns/03-templates" ] }, { "id": "pages", "recursive": true, "paths": [ - "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/04-pages" + "source/_patterns/04-pages" ] }, { "id": "macros", "recursive": true, "paths": [ - "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_macros" + "source/_macros" ] } ], From 18ac7a5095047aa42a60ed3fd048a6036cf7cf6d Mon Sep 17 00:00:00 2001 From: Salem Ghoweri Date: Wed, 25 Jul 2018 07:40:24 -0400 Subject: [PATCH 12/12] chore: revert remaining Twig starterkit path changes in PL config --- packages/edition-twig/patternlab-config.json | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/edition-twig/patternlab-config.json b/packages/edition-twig/patternlab-config.json index d8d448f8a..b5db79b40 100644 --- a/packages/edition-twig/patternlab-config.json +++ b/packages/edition-twig/patternlab-config.json @@ -101,11 +101,11 @@ }, "paths": { "source": { - "root": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/", - "patterns": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_patterns/", - "data": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_data/", - "meta": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_meta/", - "annotations": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/_annotations/", + "root": "./source/", + "patterns": "./source/_patterns/", + "data": "./source/_data/", + "meta": "./source/_meta/", + "annotations": "./source/_annotations/", "styleguide": "dist/", "patternlabFiles": { "general-header": { @@ -124,10 +124,10 @@ "path": "@uikit/viewall.twig" } }, - "js": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/js", - "images": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/images", - "fonts": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/fonts", - "css": "./node_modules/@pattern-lab/starterkit-twig-demo/dist/css" + "js": "./source/js", + "images": "./source/images", + "fonts": "./source/fonts", + "css": "./source/css" }, "public": { "root": "public/",