Skip to content

Commit

Permalink
trying to run ember-eui
Browse files Browse the repository at this point in the history
trying to run ember-eui

+

+

+

+

+

+

word boundary replacement

+

+

+

+

fix compiler, add helper/modifier/component helpers

+

better modifiers

+
  • Loading branch information
lifeart committed Jan 21, 2024
1 parent c109b66 commit 95acffc
Show file tree
Hide file tree
Showing 50 changed files with 4,393 additions and 160 deletions.
1 change: 1 addition & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
{
"prettier.enable": true,
"editor.maxTokenizationLineLength": 100000,
"[glimmer-js]": {
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode"
Expand Down
3 changes: 3 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,9 @@
<link rel="stylesheet" href="/src/style.css" />
</head>
<body>
<script>
window.global = window;
</script>
<div id="app"><!--ssr-outlet--></div>
<script type="module">
import App from "/src/index.ts";
Expand Down
19 changes: 12 additions & 7 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,12 @@
}
},
"devDependencies": {
"@babel/core": "^7.23.6",
"@babel/plugin-syntax-decorators": "^7.23.3",
"@babel/preset-typescript": "^7.23.3",
"@babel/standalone": "^7.23.8",
"@ember-eui/core": "^8.0.4",
"@esbuild-plugins/node-globals-polyfill": "^0.2.3",
"@glint/core": "^1.2.1",
"@glint/environment-ember-template-imports": "^1.2.1",
"@glint/environment-glimmerx": "^1.2.1",
Expand All @@ -73,7 +79,10 @@
"@types/babel__core": "^7.20.5",
"@types/qunit": "^2.19.9",
"autoprefixer": "^10.4.16",
"babel-import-util": "^2.0.1",
"backburner.js": "^2.8.0",
"express": "^4.18.2",
"happy-dom": "^13.0.6",
"nyc": "^15.1.0",
"postcss": "^8.4.33",
"prettier": "^3.1.1",
Expand All @@ -91,15 +100,11 @@
"vite-plugin-circular-dependency": "^0.2.1",
"vite-plugin-dts": "^3.7.0",
"vitest": "^1.1.1",
"zx": "^7.2.3",
"express": "^4.18.2",
"happy-dom": "^13.0.6"
"zx": "^7.2.3"
},
"dependencies": {
"@babel/core": "^7.23.6",
"decorator-transforms": "^1.0.3",
"@babel/preset-typescript": "^7.23.3",
"@glimmer/syntax": "^0.87.1",
"content-tag": "^1.2.2"
"content-tag": "^1.2.2",
"decorator-transforms": "^1.1.0"
}
}
21 changes: 20 additions & 1 deletion plugins/babel.ts
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,8 @@ export function processTemplate(
);
}
},
CallExpression(path: any) {
// @ts-expect-error context is not used
CallExpression(path: any, context: Context) {
if (path.node.callee && path.node.callee.type === 'Identifier') {
if (path.node.callee.name === 'scope') {
path.remove();
Expand All @@ -111,6 +112,24 @@ export function processTemplate(
path.node.arguments.pop();
}
}
} else if (path.node.callee.name === 'precompileTemplate') {
// const template = path.node.arguments[0].quasis[0].value
// .raw as string;
// const isInsideClassBody = context.isInsideClassBody === true;
// const hasThisInTemplate = template.includes('this');
// let hasThisAccess =
// isInsideClassBody === true || hasThisInTemplate;
// // looks like it's function based template, we don't need to mess with it's context hell
// if (context.isInsideReturnStatement === true) {
// hasThisAccess = true;
// }
// hbsToProcess.push({
// template,
// flags: {
// hasThisAccess: hasThisAccess,
// },
// });
// path.replaceWith(t.identifier('$placeholder'));
}
}
},
Expand Down
13 changes: 9 additions & 4 deletions plugins/compiler.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { type Plugin } from 'vite';
import { Preprocessor } from 'content-tag';
import { transform } from './test';
import { MAIN_IMPORT } from './symbols';
// import { MAIN_IMPORT } from './symbols';
import { type Flags, defaultFlags } from './flags.ts';
import { HMR, fixExportsForHMR, shouldHotReloadFile } from './hmr.ts';

Expand Down Expand Up @@ -46,6 +46,8 @@ export function compiler(mode: string, options: Options = {}): Plugin {
if (!isLibBuild) {
defineValues['IS_DEV_MODE'] = mode.mode === 'development';
}
defineValues['process.env.BABEL_TYPES_8_BREAKING'] = false;

return {
define: defineValues,
resolve: {
Expand Down Expand Up @@ -78,12 +80,15 @@ export function compiler(mode: string, options: Options = {}): Plugin {
);
}
}
if (!code.includes(MAIN_IMPORT)) {
return;
}
// if (!code.includes(MAIN_IMPORT)) {
// return;
// }
let result: string | undefined = undefined;
if (scriptFileRegex.test(file)) {
const source = code;
// if (code.includes('precompileTemplate')) {
// console.log(code);
// }
const result = transform(
source,
file,
Expand Down
64 changes: 48 additions & 16 deletions plugins/converter.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import type { ASTv1 } from '@glimmer/syntax';
import { type ASTv1 } from '@glimmer/syntax';
import {
type HBSControlExpression,
type HBSNode,
Expand All @@ -18,6 +18,10 @@ function patchNodePath(node: ASTv1.MustacheStatement | ASTv1.SubExpression) {
if (node.path.type !== 'PathExpression') {
return;
}
if (node.path.data === true) {
// debugger;
node.path.original = `this.args.${node.path.original.replace('@', '')}`;
}
// replacing builtin helpers
if (node.path.original === 'unless') {
node.path.original = SYMBOLS.$__if;
Expand Down Expand Up @@ -71,6 +75,9 @@ export type ComplexJSType = PrimitiveJSType | HBSControlExpression | HBSNode;
export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
setFlags(flags);
function ToJSType(node: ASTv1.Node, wrap = true): ComplexJSType {
if (node === undefined) {
debugger;
}
seenNodes.add(node);
if (node.type === 'ConcatStatement') {
return `$:() => [${node.parts
Expand Down Expand Up @@ -119,7 +126,7 @@ export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
);
return `$:${SYMBOLS.$__hash}(${toObject(hashArgs)})`;
}
return `$:${resolvePath(node.path.original)}(${node.params
return `$:${SYMBOLS.$_maybeHelper}(${resolvePath(node.path.original)})(${node.params
.map((p) => ToJSType(p))
.join(',')})`;
} else if (node.type === 'NumberLiteral') {
Expand Down Expand Up @@ -184,7 +191,9 @@ export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
}
return ToJSType(node.path);
} else {
return `${wrap ? `$:() => ` : ''}${ToJSType(node.path)}(${node.params
return `${wrap ? `$:() => ` : ''}${SYMBOLS.$_maybeHelper}(${ToJSType(
node.path,
)})(${node.params
.map((p) => ToJSType(p))
.map((el) => {
if (typeof el !== 'string') {
Expand Down Expand Up @@ -255,37 +264,52 @@ export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
key: keyValue,
} as HBSControlExpression;
} else if (name === 'let') {
const varScopeName = Math.random().toString(36).substring(7);
const namesToReplace: Record<string, string> = {};
const vars = node.params.map((p, index) => {
let isSubExpression = p.type === 'SubExpression';
let isString = p.type === 'StringLiteral';
let isBoolean = p.type === 'BooleanLiteral';
let isNull = p.type === 'NullLiteral';
let isUndefined = p.type === 'UndefinedLiteral';
let originalName = node.program.blockParams[index];
let newName = `S${originalName}_${varScopeName}`;
namesToReplace[originalName] = `${newName}`;
if (
isSubExpression ||
isString ||
isBoolean ||
isNull ||
isUndefined
) {
return `let ${node.program.blockParams[index]} = ${ToJSType(
p,
false,
)};`;
return `let ${newName} = ${ToJSType(p, false)};`;
} else {
return `let ${node.program.blockParams[index]} = $:() => ${ToJSType(
p,
)};`;
return `let ${newName} = $:() => ${ToJSType(p)};`;
}
});
// note, at the moment nested let's works fine if no name overlap,
// looks like fix for other case should be on babel level;
const result = `$:...(() => {${vars.join(
'',
)}return [${serializeChildren(
children as unknown as [string | HBSNode | HBSControlExpression],
'this', // @todo - fix possible context floating here
// @todo - likely should be a babel work
function fixChildScopes(str: string) {
// console.log('fixChildScopes', str, JSON.stringify(namesToReplace));
Object.keys(namesToReplace).forEach((key) => {
// we need to replace keys by word boundary
// not like this:
// str = str.split(key).join(namesToReplace[key]);
// but like this:
const re = new RegExp(`\\b${key}\\b`, 'g');
str = str.replace(re, namesToReplace[key]);
});
return str;
}
const result = `$:...(() => {${vars.join('')}return [${fixChildScopes(
serializeChildren(
children as unknown as [string | HBSNode | HBSControlExpression],
'this', // @todo - fix possible context floating here
),
)}]})()`;
// console.log(namesToReplace);
// console.log(result);
return result;
}

Expand Down Expand Up @@ -405,9 +429,17 @@ export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
return null;
}
} else {
const hashArgs: [string, PrimitiveJSType][] = mod.hash.pairs.map(
(pair) => {
return [
pair.key,
ToJSType(pair.value) as unknown as PrimitiveJSType,
];
},
);
return [
EVENT_TYPE.ON_CREATED,
`$:($n) => $:${mod.path.original}($n, ${mod.params
`$:($n) => $:${SYMBOLS.$_modifier}(${resolvePath(mod.path.original)}, ${toObject(hashArgs)})($n, ${mod.params
.map((p) => ToJSType(p))
.join(',')})`,
];
Expand Down
2 changes: 2 additions & 0 deletions plugins/decorator-transforms/globals.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
import * as runtime from './runtime.ts';
(globalThis as any)['dt7948'] = runtime;
Loading

0 comments on commit 95acffc

Please sign in to comment.