leanweb 1.1.1 → 1.1.5

package/README.md

@@ -259,6 +259,7 @@ items = ["one", "two", "three"];
 <br />
 <button lw-on:click="resetName()">Reset Name</button>
 ```
+
 You could bind multiple events like `lw-on:click,change=handler($event, $node)`.
 
 ```javascript
@@ -318,24 +319,26 @@ imageWidth = 400;
 `demo-parent.html`
 
 ```html
-<demo-child lw-input:userData="user"></demo-child>
+<demo-child lw-input:parent="self" lw-input:userData="user"></demo-child>
 ```
 
 `demo-parent.js`
 
 ```javascript
 // ...
+// self is defined in LWElement as `self = this`;
 user = { firstname: "Qian", lastname: "Chen" };
 // ...
 ```
 
-The child is able to access the `user` object passed in with `lw-input:`
-directive from `inputReady()` method.
+The child is able to access the `parent` and `user` object passed in with
+`lw-input:` directive from `inputReady()` method.
 `demo-child.js`
 
 ```javascript
 // ...
 inputReady() {
+  console.log(this.parent);
   console.log(this.userData);
 }
 // ...

package/commands/build.js

@@ -121,18 +121,18 @@ const require = createRequire(import.meta.url);
       const buildHTML = () => {
          project.components.forEach(cmp => {
             const cmpName = utils.getComponentName(cmp);
-            const htmlFilename = `${projectPath}/${buildDir}/components/${cmp}/${cmpName}.html`;
+            const htmlFilename = `${buildDir}/components/${cmp}/${cmpName}.html`;
             const htmlFileExists = fs.existsSync(htmlFilename);
             if (htmlFileExists) {
 
-               const scssFilename = `${projectPath}/${buildDir}/components/${cmp}/${cmpName}.scss`;
+               const scssFilename = `${buildDir}/components/${cmp}/${cmpName}.scss`;
                const scssFileExists = fs.existsSync(scssFilename);
                let cssString = '';
                if (scssFileExists) {
                   let scssString = `@use "global-styles.scss";\n`;
                   scssString += fs.readFileSync(scssFilename, 'utf8');
                   scssString += '\n[lw-false],[lw-for]{display:none !important;}\n';
-                  cssString = utils.buildCSS(scssString, `${projectPath}/${buildDir}/components/${cmp}`);
+                  cssString = utils.buildCSS(scssString, `${buildDir}/components/${cmp}`);
                }
                const styleString = cssString || '';
                const htmlString = fs.readFileSync(htmlFilename, 'utf8');
@@ -144,16 +144,16 @@ const require = createRequire(import.meta.url);
                fs.writeFileSync(`${buildDir}/components/${cmp}/ast.js`, `export default ${JSON.stringify(ast, null, 0)};`);
             }
          });
-         const htmlString = fs.readFileSync(`${projectPath}/${buildDir}/index.html`, 'utf8');
+         const htmlString = fs.readFileSync(`${buildDir}/index.html`, 'utf8');
          fs.writeFileSync(`${buildDir}/index.html`, htmlString);
       };
 
       const buildSCSS = () => {
-         const projectScssFilename = `${projectPath}/src/${project.name}.scss`;
+         const projectScssFilename = `${projectPath}/${utils.dirs.src}/${project.name}.scss`;
          let projectCssString = '';
          if (fs.existsSync(projectScssFilename)) {
             const projectScssString = fs.readFileSync(projectScssFilename, 'utf8');
-            projectCssString += utils.buildCSS(projectScssString, `${projectPath}/${buildDir}`);
+            projectCssString += utils.buildCSS(projectScssString, buildDir);
          }
          fs.writeFileSync(`${buildDir}/${project.name}.css`, projectCssString);
       };

package/commands/generate.js

@@ -52,7 +52,7 @@ const require = createRequire(import.meta.url);
       }
 
       if (!fs.existsSync(`${cmpPath}/${cmpName}.scss`)) {
-         fs.writeFileSync(`${cmpPath}/${cmpName}.scss`, ':host {\n\tdisplay: inline-block;\n\tposition: relative;\n}');
+         fs.writeFileSync(`${cmpPath}/${cmpName}.scss`, '');
       }
    }
 })();

package/commands/init.js

@@ -1,7 +1,7 @@
 import fs from 'fs';
 import fse from 'fs-extra';
 import git from 'isomorphic-git';
-import globby from 'globby';
+import { globby } from 'globby';
 import * as utils from './utils.js';
 
 import path from 'path';

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "leanweb",
-   "version": "1.1.1",
+   "version": "1.1.5",
    "description": "Builds framework agnostic web components.",
    "bin": {
       "leanweb": "leanweb.js",
@@ -20,25 +20,25 @@
    "author": "Qian Chen",
    "license": "MIT",
    "dependencies": {
-      "@babel/core": "^7.16.12",
-      "@babel/parser": "^7.16.12",
-      "@babel/plugin-transform-runtime": "^7.16.10",
+      "@babel/core": "^7.17.0",
+      "@babel/parser": "^7.17.0",
+      "@babel/plugin-transform-runtime": "^7.17.0",
       "@babel/preset-env": "^7.16.11",
       "babel-loader": "^8.2.3",
-      "clean-css": "^5.2.2",
-      "css-loader": "^6.5.1",
+      "clean-css": "^5.2.4",
+      "css-loader": "^6.6.0",
       "fs-extra": "^10.0.0",
-      "globby": "^13.0.0",
+      "globby": "^13.1.1",
       "html-minifier": "^4.0.0",
-      "isomorphic-git": "^1.10.5",
+      "isomorphic-git": "^1.11.2",
       "json5-loader": "^4.0.1",
       "node-watch": "^0.7.3",
       "parse5": "^6.0.1",
       "raw-loader": "^4.0.2",
-      "sass": "^1.49.0",
+      "sass": "^1.49.7",
       "sass-loader": "^12.4.0",
       "semver": "^7.3.5",
-      "webpack": "^5.67.0",
-      "webpack-dev-server": "^4.7.3"
+      "webpack": "^5.68.0",
+      "webpack-dev-server": "^4.7.4"
    }
 }

package/templates/lib/lw-element.js

@@ -97,6 +97,7 @@ const nextAllSiblings = (el, selector) => {
 };
 
 export default class LWElement extends HTMLElement {
+   self = this;
    constructor(ast) {
       super();
       this.ast = ast;