Merge pull request #10 from InDIOS/development

Bump to version 0.2.2

.npmignore

@@ -5,6 +5,7 @@
 examples/
 src/
 test/
+spec/
 tools/index.ts
 tools/tsconfig.json
 package-lock.json

CHANGELOG.md

@@ -1,3 +1,9 @@
+0.2.2
+- Added Sequence expression to context generation.
+- Fixed missing attributes generating elements in slots.
+- Fixed bug generating code for component event attributes.
+- Fixed internal errors passing children in loops and conditions.
+
 0.2.1
 - Fixed issue analyzing slots.
 - Fixed bug mounting components.

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "trebor",
-	"version": "0.2.1",
+	"version": "0.2.2",
 	"description": "A node js module to make standalone web components.",
 	"main": "./build/index.js",
 	"bin": {

src/generators/commons.ts

@@ -103,7 +103,8 @@ export function genBlockAreas(node: NodeElement, areas: BlockAreas, scope: strin
 
 export function genBody(funcName: string, scope: string, areas: BlockAreas, condType?: string) {
   return `${!areas.outer.length ? '' : `${areas.outer.join('\n')}
-	`}function ${funcName}(${scope}, children) {
+	`}function ${funcName}(${scope}) {
+    let { children } = ${scope.split(',')[0]}.$options;
 		${!areas.variables.length ? '' : `let ${areas.variables.join(', ')}`};${!areas.extras.length ? '' : `
 		${areas.extras.join('\n')}`}
 		return {

src/generators/components.ts

@@ -1,5 +1,6 @@
 import { genBlockAreas } from './commons';
 import { ctx } from '../utilities/context';
+import { genSetAttrs } from './attributes';
 import { genDirective } from './directives';
 import { NodeElement, BlockAreas } from '../utilities/classes';
 import { kebabToCamelCases, getVarName, capitalize, createElement, filterParser } from '../utilities/tools';
@@ -12,18 +13,13 @@ export function genTag(node: NodeElement, areas: BlockAreas, scope: string) {
   if (node.childNodes.length) node.dymTag = element;
   if (expression) {
     const setElement = `setTag${capitalize(element)}`;
-    const updateTag = `updateTag${capitalize(element)}`;
     areas.variables.push(setElement);
     const code = ctx(filterParser(expression), scope, areas.globals);
     let params = areas.globals && areas.globals.length > 0 ? `, ${areas.globals.join(', ')}` : '';
     const setTag = `${setElement}(${scope}${params})`;
     areas.extras.push(`${setElement} = (${scope}${params}) => ${code};`);
     areas.create.push(`${element} = _$ce(${setTag});`);
-    areas.update.push(`let ${updateTag} = ${setTag};
-		if (${updateTag}.toUpperCase() !== ${element}.tagName) {
-			${element} = _$as(${element}, _$ce(${updateTag}));
-		}
-		${updateTag} = void 0;`);
+    areas.update.push(`${element} = _$nu(${element}, ${setTag});`);
   } else {
     element = getVarName(areas.variables, node.tagName);
   }
@@ -69,8 +65,8 @@ export function genComponent(node: NodeElement, areas: BlockAreas, scope: string
     if (name[0] === '@') {
       const eventVar = `event${capitalize(kebabToCamelCases(name.slice(1)))}${capitalize(variable)}`;
       areas.variables.push(eventVar);
-      extras.push(`${eventVar} = ${variable}.$on('${name.slice(1)}', ${ctx(value, scope, params)});`);
-      areas.destroy.push(`${eventVar}.off();`);
+      extras.push(`${eventVar} = ${variable}.$on('${name.slice(1)}', $data => { ${ctx(value, scope, params)}; });`);
+      areas.destroy.push(`${eventVar}.$off();`);
     } else if (name[0] === ':') {
       attrs += `${kebabToCamelCases(name.slice(1))}() { return ${ctx(value, scope, params)}; },`;
     } else if (name[0] === '$' && !/model|show/.test(name.slice(1))) {
@@ -137,6 +133,10 @@ export function genComponent(node: NodeElement, areas: BlockAreas, scope: string
           areas.unmount.push(`_$a(${slot}, ${el});`);
         }
       });
+      const attr = genSetAttrs(slot, n, scope, areas);
+      if (attr) {
+        areas.hydrate.push(attr);
+      }
       areas.unmount.push(`if (${slotDec}) {
 			_$a(${slotDec}, ${slot});
 		}`);

src/index.ts

@@ -9,7 +9,7 @@ import { basename, extname, dirname, join } from 'path';
 import { genTemplate, CompilerOptions } from './generators';
 import { kebabToCamelCases, capitalize, camelToKebabCase } from './utilities/tools';
 
-const dest = `{ _$CompCtr, _$, _$d, _$a, _$add, _$remove, _$as, _$r, _$ce, _$cse, _$ct, _$bu, _$tu,
+const dest = `{ _$CompCtr, _$, _$d, _$a, _$add, _$remove, _$as, _$r, _$ce, _$cse, _$ct, _$bu, _$tu, _$nu,
  _$cm, _$sa, _$ga, _$al, _$ul, _$rl, _$bc, _$bs, _$f, _$e, _$is, _$ds, _$toStr, _$bindMultiSelect, _$gv,
  _$setRef, _$noop, _$isType, _$isKey, _$bindGroup, _$cu, _$emptyElse, _$extends, _$updateMultiSelect }`;
 const esDeps = `import ${dest} from 'trebor/tools';`;

src/types/recast.d.ts

@@ -1,6 +1,6 @@
 import {
   Node, BinaryExpression, Literal, CallExpression,
-  MemberExpression, Identifier, Expression, BinaryOperator, Program, Property, ExpressionStatement, TemplateLiteral, ArrayExpression, ConditionalExpression, SpreadElement, UnaryExpression, LogicalExpression, UpdateExpression, AssignmentExpression, ImportDeclaration, ExportDefaultDeclaration, VariableDeclaration, FunctionDeclaration, FunctionExpression, SwitchStatement, WhileStatement, IfStatement, TryStatement
+  MemberExpression, Identifier, Expression, BinaryOperator, Program, Property, ExpressionStatement, TemplateLiteral, ArrayExpression, ConditionalExpression, SpreadElement, UnaryExpression, LogicalExpression, UpdateExpression, AssignmentExpression, ImportDeclaration, ExportDefaultDeclaration, VariableDeclaration, FunctionDeclaration, FunctionExpression, SwitchStatement, WhileStatement, IfStatement, TryStatement, SequenceExpression
 } from 'estree';
 
 interface NamedType {
@@ -91,6 +91,7 @@ interface Types {
     visitUpdateExpression?(this: Visitor, path: Path<UpdateExpression>, ...args: any[]): boolean | void;
     visitLogicalExpression?(this: Visitor, path: Path<LogicalExpression>, ...args: any[]): boolean | void;
     visitImportDeclaration?(this: Visitor, path: Path<ImportDeclaration>, ...args: any[]): boolean | void;
+    visitSequenceExpression?(this: Visitor, path: Path<SequenceExpression>, ...args: any[]): boolean | void;
     visitFunctionExpression?(this: Visitor, path: Path<FunctionExpression>, ...args: any[]): boolean | void;
     visitFunctionDeclaration?(this: Visitor, path: Path<FunctionDeclaration>, ...args: any[]): boolean | void;
     visitExpressionStatement?(this: Visitor, path: Path<ExpressionStatement>, ...args: any[]): boolean | void;