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

trying to run ember-eui

+

+

+

+

+

+

word boundary replacement

+

+

+

+

fix compiler, add helper/modifier/component helpers

+

better modifiers

+

+

+

+

+

EuiAccordion, EuiPanel

+

pretty plugin

+

+

+

+

+

+

+

+
  • Loading branch information
@lifeart
lifeart committed Jan 30, 2024
1 parent 6172e2e commit 8dbf508
Show file tree
Hide file tree
Showing 53 changed files with 4,716 additions and 169 deletions.
3 changes: 3 additions & 0 deletions index.html
View file
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
13 changes: 11 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,12 +66,23 @@
"devDependencies": {
"@glint/core": "^1.3.0",
"@glint/template": "^1.3.0",
"@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/environment-ember-template-imports": "^1.2.1",
"@glint/environment-glimmerx": "^1.2.1",
"@lifeart/tiny-router": "^0.0.8",
"@playwright/test": "^1.40.1",
"@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 @@ -90,8 +101,6 @@
"vite-plugin-dts": "^3.7.0",
"vitest": "^1.1.1",
"zx": "^7.2.3",
"express": "^4.18.2",
"happy-dom": "^13.0.6",
"glint-environment-gxt": "file:./glint-environment-gxt"
},
"dependencies": {
Expand Down
21 changes: 20 additions & 1 deletion plugins/babel.ts
View file
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
12 changes: 8 additions & 4 deletions plugins/compiler.ts
View file
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 @@ -50,6 +50,7 @@ export function compiler(mode: string, options: Options = {}): Plugin {
} else {
defineValues = {};
}
defineValues['process.env.BABEL_TYPES_8_BREAKING'] = false;

return {
define: defineValues,
Expand Down Expand Up @@ -83,12 +84,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
122 changes: 89 additions & 33 deletions plugins/converter.ts
View file
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 @@ -20,6 +20,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 @@ -78,6 +82,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 All @@ -102,7 +109,14 @@ export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
}
// replacing builtin helpers
patchNodePath(node);

const hashArgs: [string, PrimitiveJSType][] = node.hash.pairs.map(
(pair) => {
return [
pair.key,
ToJSType(pair.value, false) as unknown as PrimitiveJSType,
];
},
);
if (node.path.original === 'element') {
// @todo - write test to catch props issue here
return `$:function(args){const $fw = ${
Expand All @@ -115,19 +129,12 @@ export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
SYMBOLS.SLOT
}('default',()=>[],$slots)], this)], ctx: this};}`;
} else if (node.path.original === SYMBOLS.$__hash) {
const hashArgs: [string, PrimitiveJSType][] = node.hash.pairs.map(
(pair) => {
return [
pair.key,
ToJSType(pair.value) as unknown as PrimitiveJSType,
];
},
);

return `$:${SYMBOLS.$__hash}(${toObject(hashArgs)})`;
}
return `$:${resolvePath(node.path.original)}(${node.params
.map((p) => ToJSType(p))
.join(',')})`;
return `$:${SYMBOLS.$_maybeHelper}(${resolvePath(
node.path.original,
)},${toObject(hashArgs)})(${node.params.map((p) => ToJSType(p)).join(',')})`;
} else if (node.type === 'NumberLiteral') {
return node.value;
}
Expand Down Expand Up @@ -179,20 +186,40 @@ export function convert(seenNodes: Set<ASTv1.Node>, flags: Flags) {
} as HBSControlExpression;
}
if (node.params.length === 0) {
const hashArgs: [string, PrimitiveJSType][] = node.hash.pairs.map(
(pair) => {
return [pair.key, ToJSType(pair.value) as PrimitiveJSType];
},
);
// hash case
if (node.path.original === SYMBOLS.$__hash) {
const hashArgs: [string, PrimitiveJSType][] = node.hash.pairs.map(
(pair) => {
return [pair.key, ToJSType(pair.value) as PrimitiveJSType];
},
);

return `${wrap ? `$:() => ` : ''}${ToJSType(node.path)}(${toObject(
hashArgs,
)})`;
}
return ToJSType(node.path);

if (hashArgs.length === 0) {
return ToJSType(node.path);
}

// @me here
return `$:${SYMBOLS.$_maybeHelper}(${resolvePath(
node.path.original,
)},${toObject(hashArgs)})([])`;
//
} else {
return `${wrap ? `$:() => ` : ''}${ToJSType(node.path)}(${node.params
const hashArgs: [string, PrimitiveJSType][] = node.hash.pairs.map(
(pair) => {
return [
pair.key,
ToJSType(pair.value, false) as unknown as PrimitiveJSType,
];
},
);
return `${wrap ? `$:() => ` : ''}${SYMBOLS.$_maybeHelper}(${ToJSType(
node.path,
)},${toObject(hashArgs)})(${node.params
.map((p) => ToJSType(p))
.map((el) => {
if (typeof el !== 'string') {
Expand Down Expand Up @@ -263,37 +290,56 @@ 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:
// we need to replace key, but not key=value
const re = new RegExp(`\\b${key}\\b(?!=[^ ]*)`, 'g');
str = str.replace(re, namesToReplace[key]);
});
return str;
}
const result = `$:...(() => {let self = this;${vars
.join('\n')
.split('this.')
.join('self.')}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 @@ -414,9 +460,19 @@ 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
View file
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 8dbf508

Please sign in to comment.