Merge pull request #129 from qld-gov-au/QOLOE-122-handlebars-helper-fix

QOLOE-122 correct handlebars loading by having an init function to wrap it

.esbuild/plugins/qgds-plugin-clean-output-folders.js

@@ -7,7 +7,7 @@ export default function cleanFoldersPlugin() {
     setup(build) {
       build.onStart(() => {
         //Console feedback
-        log("cyan", `\u{1F4C2} Cleaning /dist and /docs folders\n\n`);
+        log("cyan", `\u{1F4C2} Cleaning /dist folders\n\n`);
 
         // Clean the output folders
         const { outdir, outfile } = build.initialOptions;
@@ -20,11 +20,11 @@ export default function cleanFoldersPlugin() {
           fs.rmSync(outfile);
         }
 
-        // Clean the docs folder
-        const docsdir = "./docs/";
-        if (fs.existsSync(docsdir)) {
-          fs.rmSync(docsdir, { recursive: true });
-        }
+        // // Clean the docs folder
+        // const docsdir = "./docs/";
+        // if (fs.existsSync(docsdir)) {
+        //   fs.rmSync(docsdir, { recursive: true });
+        // }
       });
     },
   };

.esbuild/plugins/qgds-plugin-copy-assets.js

@@ -18,12 +18,14 @@ export default function copyPlugin() {
         to: ["./dist/sample-data/"],
       },
       {
-        from: ["./src/js/handlebars.helpers.js"],
+        from: ["./src/js/handlebars*"],
         to: ["./dist/assets/js"],
       },
+      {
+        from: ["./src/js/handlebars*"],
+        to: ["./dist/components/"],
+      },
       { from: ["./src/assets/img/*"], to: ["./dist/assets/img"] },
-      { from: ["./dist/**/*"], to: ["./docs/"] },
-      { from: ["./storybook-static/**/*"], to: ["./docs/storybook-static/"] },
     ],
   });
 

.github/workflows/Storybook-library-update.yml

@@ -26,7 +26,7 @@ jobs:
 
       - name: Cache node modules
         id: cache-npm
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         env:
           cache-name: cache-node-modules
         with:

.github/workflows/compile.js.yml

@@ -28,7 +28,7 @@ jobs:
 
       - name: Cache node modules
         id: cache-npm
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         env:
           cache-name: cache-node-modules
         with:
@@ -74,21 +74,11 @@ jobs:
       - name: Build 🔧
         run: | # build the files
           npm run build
-#      - name: Build storybook 🔧
-#        run: | # build the Storybook files
-#          npm run build-storybook
-
-      - name: setup Package
-        run: |
-          ls -ltr
-          mkdir -p ./target/docs
-          cp -r ./docs ./target/docs
-          cp -r ./dist ./target/dist
 
       - uses: actions/[email protected]
         with:
           name: Package
-          path: ./target
+          path: ./dist
 
 
       - name: Extract branch name

.github/workflows/githubPackage.yml

@@ -30,7 +30,7 @@ jobs:
 
       - name: Cache node modules
         id: cache-npm
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         env:
           cache-name: cache-node-modules
         with:

.github/workflows/npmjsPackage.yml

@@ -30,7 +30,7 @@ jobs:
 
       - name: Cache node modules
         id: cache-npm
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         env:
           cache-name: cache-node-modules
         with:

.github/workflows/storybook-deploy.js.yml

@@ -35,7 +35,7 @@ jobs:
 
       - name: Cache node modules
         id: cache-npm
-        uses: actions/cache@v3
+        uses: actions/cache@v4
         env:
           cache-name: cache-node-modules
         with:

.gitignore

@@ -9,3 +9,5 @@ docs/
 dist/
 .idea
 *.iml
+docs/storybook-static
+

README.md

@@ -24,8 +24,8 @@ git clone https://github.com/qld-gov-au/qgds-qol-mvp
 
 ### Prerequisites
 
-- Node 18.17.1
-- NPM 10.2.5
+- Node 18.17.1+
+- NPM 10.2.5+
 
 ### Install dependencies
 
@@ -59,7 +59,10 @@ npm run serve
 
 ### Next steps
 
-- HTML templating using drop in components
+- HTML templating using drop in components 
+
+  If you wish to use the includes handle bars, please ensure 
+"handlebars": "4.7.8" + is loaded prior to running handlebars.helpers.bundle.js
 - Dev build and testing branching
 
 ## Documentation

esbuild.js

@@ -41,9 +41,13 @@ const buildConfig = {
       out: "./assets/css/qld.bootstrap",
     },
     {
-      in: "./src/js/handlebars.helpers.js",
+      in: "./src/js/handlebars.init.js",
       out: "./assets/js/handlebars.helpers.bundle",
     },
+    {
+      in: "./src/js/handlebars.init.js",
+      out: "./components/handlebars.helpers.bundle",
+    },
   ],
 
   loader: {

package.json

@@ -20,15 +20,25 @@
   "license": "ISC",
   "type": "module",
   "files": [
+    ".esbuild",
+    ".storybook",
+    ".vscode",
     "dist",
-    "docs"
+    "src",
+    ".eslintrc.cjs",
+    "esbuild.js",
+    "jsconfig.json",
+    "pom.xml",
+    "README.md",
+    "vite.config.js"
   ],
   "dependencies": {
     "@fortawesome/fontawesome-free": "^6.5.2",
     "bootstrap": "^5.3.1",
     "material-symbols": "^0.17.4"
   },
   "devDependencies": {
+    "handlebars": "4.7.8",
     "@chromatic-com/storybook": "^1.3.5",
     "@storybook/addon-essentials": "^8.1.0",
     "@storybook/addon-interactions": "^8.1.0",
@@ -75,6 +85,8 @@
   "exports": {
     "qld.bootstrap.min.js": "./dist/assets/js/qld.bootstrap.min.js",
     "qld.bootstrap.css": "./dist/assets/css/qld.bootstrap.css",
+    "handlebars.helpers.bundle.js": "./dist/components/handlebars.helpers.bundle.js",
+    "handlebars.init.js": "./dist/components/handlebars.init.js",
     "bootstrap.min.js": "./dist/assets/js/boostrap.min.js"
   }
 }

src/js/handlebars.init.js

@@ -0,0 +1,6 @@
+import handlebarsHelpers from "./handlebars.helpers.js";
+import Handlebars from "handlebars";
+export * from "./handlebars.helpers.js";
+
+export const init = () => handlebarsHelpers(Handlebars);
+