Skip to content
This repository has been archived by the owner on May 19, 2023. It is now read-only.

Commit

Permalink
style: organize imports
Browse files Browse the repository at this point in the history
  • Loading branch information
aidenybai committed Apr 12, 2021
1 parent a21d969 commit a9165c9
Show file tree
Hide file tree
Showing 26 changed files with 105 additions and 70 deletions.
2 changes: 1 addition & 1 deletion .babelrc
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"presets": ["@babel/preset-typescript", "@babel/preset-env"],
"plugins": ["@babel/plugin-proposal-class-properties"],
"plugins": ["@babel/plugin-proposal-class-properties", "babel-plugin-loop-optimizer"],
"comments": false
}
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,7 @@
"@types/jest": "^26.0.22",
"@typescript-eslint/eslint-plugin": "^4.21.0",
"@typescript-eslint/parser": "^4.21.0",
"babel-plugin-loop-optimizer": "^1.4.1",
"del-cli": "^3.0.1",
"esbuild": "^0.11.1",
"eslint": "^7.24.0",
Expand Down
2 changes: 1 addition & 1 deletion src/__test__/component.spec.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { component, Component } from '../component';
import reactive from '../core/reactive';
import { directives } from '../core/directive';
import reactive from '../core/reactive';
import { getElementCustomProp } from '../core/utils/elementCustomProp';

describe('.component', () => {
Expand Down
2 changes: 1 addition & 1 deletion src/__test__/index.spec.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { init } from '../index';
import { Component } from '../component';
import { getElementCustomProp } from '../core/utils/elementCustomProp';
import { init } from '../index';

// @ts-expect-error: callback doesn't exist on window, but good enough for test
window.callback = jest.fn();
Expand Down
6 changes: 2 additions & 4 deletions src/component.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,11 @@
/* istanbul ignore file */

import { Directives, DirectiveProps, Watchers, State, ASTNode } from './models/structs';

import { directives } from './core/directive';
import compile from './core/compile';
import { directives } from './core/directive';
import reactive from './core/reactive';
import render from './core/render';

import { setElementCustomProp } from './core/utils/elementCustomProp';
import { ASTNode, DirectiveProps, Directives, State, Watchers } from './models/structs';

export class Component {
public state: State;
Expand Down
4 changes: 2 additions & 2 deletions src/core/__test__/compile.spec.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
import compute from '../../core/utils/computeExpression';
import {
compile,
createASTNode,
flattenNodeChildren,
isListRenderScope,
isUnderListRenderScope,
flattenNodeChildren,
} from '../compile';
import compute from '../../core/utils/computeExpression';

describe('.compile', () => {
it('should not return anything', () => {
Expand Down
6 changes: 3 additions & 3 deletions src/core/compile.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { DIRECTIVE_PREFIX, DIRECTIVE_SHORTHANDS } from '../models/generics';
import { State, DirectiveKV, Refs, ASTNode, ASTNodeType } from '../models/structs';
import { expressionPropRE, hasDirectiveRE, eventDirectivePrefixRE } from './utils/patterns';
import { ASTNode, ASTNodeType, DirectiveKV, Refs, State } from '../models/structs';
import compute from './utils/computeExpression';
import { getElementCustomProp, setElementCustomProp } from './utils/elementCustomProp';
import { eventDirectivePrefixRE, expressionPropRE, hasDirectiveRE } from './utils/patterns';
import removeDupesFromArray from './utils/removeDupesFromArray';
import compute from './utils/computeExpression';

export const isListRenderScope = (el: HTMLElement): boolean => {
return el.hasAttribute(`${DIRECTIVE_PREFIX}for`);
Expand Down
7 changes: 3 additions & 4 deletions src/core/directive.ts
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
import { Directives, DirectiveProps } from '../models/structs';

import { DirectiveProps, Directives } from '../models/structs';
import { bindDirective } from './directives/bind';
import { forDirective } from './directives/for';
import { htmlDirective } from './directives/html';
import { modelDirective } from './directives/model';
import { showDirective } from './directives/show';
import { onDirective } from './directives/on';
import { showDirective } from './directives/show';
import { textDirective } from './directives/text';
import { forDirective } from './directives/for';

export const directives: Directives = {
BIND: bindDirective,
Expand Down
2 changes: 1 addition & 1 deletion src/core/directives/__test__/bind.spec.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { bindDirective } from '../bind';
import compute from '../../utils/computeExpression';
import { bindDirective } from '../bind';

describe('.bindDirective', () => {
it('should bind class based on state boolean value', () => {
Expand Down
30 changes: 25 additions & 5 deletions src/core/directives/__test__/for.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,11 @@ describe('.forDirective', () => {
const el = document.createElement('ul');
const expression = `bar in foo`;
const state = { foo: ['bar', 'bar', 'bar'] };
const data = { value: expression, compute: compute(expression, el), deps: ['foo'] };
const data = {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
};

setElementCustomProp(el, '__for_template', '<li l-text="this.bar"></li>');
el.innerHTML = '<li l-text="this.bar"></li>';
Expand All @@ -33,7 +37,11 @@ describe('.forDirective', () => {
const el = document.createElement('table');
const expression = `(bar, i) in foo`;
const state = { foo: ['bar', 'bar', 'bar'] };
const data = { value: expression, compute: compute(expression, el), deps: ['foo'] };
const data = {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
};

setElementCustomProp(el, '__for_template', '<tbody l-text="this.bar + this.i"></tbody>');

Expand All @@ -55,7 +63,11 @@ describe('.forDirective', () => {
const el = document.createElement('p');
const expression = `_ in foo`;
const state = { foo: ['bar', 'bar', 'bar'] };
const data = { value: expression, compute: compute(expression, el), deps: ['foo'] };
const data = {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
};

setElementCustomProp(el, '__for_template', '<li></li>');

Expand All @@ -74,7 +86,11 @@ describe('.forDirective', () => {
const el = document.createElement('p');
const expression = `_ in foo`;
const state = { foo: ['bar', 'bar'] };
const data = { value: expression, compute: compute(expression, el), deps: ['foo'] };
const data = {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
};

setElementCustomProp(el, '__for_template', '<li></li>');
setElementCustomProp(el, '__for_state', ['bar', 'bar']);
Expand All @@ -95,7 +111,11 @@ describe('.forDirective', () => {
const el = document.createElement('p');
const expression = `_ in foo`;
const state = { foo: ['bar', 'bar', 'bar'] };
const data = { value: expression, compute: compute(expression, el), deps: ['foo'] };
const data = {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
};

setElementCustomProp(el, '__for_template', '<li></li>');
setElementCustomProp(el, '__for_state', ['bar', 'bar', 'bar']);
Expand Down
20 changes: 16 additions & 4 deletions src/core/directives/__test__/html.spec.ts
Original file line number Diff line number Diff line change
@@ -1,12 +1,16 @@
import { htmlDirective } from '../html';
import compute from '../../utils/computeExpression';
import { htmlDirective } from '../html';

describe('.htmlDirective', () => {
it('should interpolate state into interHTML', () => {
const el = document.createElement('div');
const expression = 'foo';
const state = { foo: 'bar' };
const data = { value: expression, compute: compute(expression, el), deps: ['foo'] };
const data = {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
};
const node = {
el,
directives: { html: data },
Expand All @@ -27,7 +31,11 @@ describe('.htmlDirective', () => {
const el = document.createElement('div');
const expression = '<p>foo</p>';
const state = {};
const data = { value: expression, compute: compute(expression, el), deps: [] };
const data = {
value: expression,
compute: compute(expression, el),
deps: [],
};
const node = {
el,
directives: { html: data },
Expand All @@ -48,7 +56,11 @@ describe('.htmlDirective', () => {
const el = document.createElement('div');
const expression = `foo`;
const state = { foo: '<p l-text="bar"></p>' };
const data = { value: expression, compute: compute(expression, el), deps: ['foo'] };
const data = {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
};
const node = {
el,
directives: { html: data },
Expand Down
3 changes: 1 addition & 2 deletions src/core/directives/__test__/model.spec.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { fireEvent } from '@testing-library/dom';

import { modelDirective, inputCallback } from '../model';
import compute from '../../utils/computeExpression';
import { inputCallback, modelDirective } from '../model';

describe('.modelDirective', () => {
it('should attach and model input', () => {
Expand Down
3 changes: 1 addition & 2 deletions src/core/directives/__test__/on.spec.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import { fireEvent } from '@testing-library/dom';

import { onDirective } from '../on';
import compute from '../../utils/computeExpression';
import { getElementCustomProp } from '../../utils/elementCustomProp';
import { onDirective } from '../on';

describe('.onDirective', () => {
it('should attach click event listener', () => {
Expand Down
14 changes: 11 additions & 3 deletions src/core/directives/__test__/show.spec.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { showDirective } from '../show';
import compute from '../../utils/computeExpression';
import { showDirective } from '../show';

describe('.showDirective', () => {
it('should interpolate state into textContent', () => {
Expand All @@ -10,7 +10,11 @@ describe('.showDirective', () => {
showDirective({
el,
parts: [`show`],
data: { value: expression, compute: compute(expression, el), deps: ['foo'] },
data: {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
},
state,
});
expect(el.style.display).toEqual('');
Expand All @@ -20,7 +24,11 @@ describe('.showDirective', () => {
showDirective({
el,
parts: [`show`],
data: { value: expression, compute: compute(expression, el), deps: ['foo'] },
data: {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
},
state,
});
expect(el.style.display).toEqual('none');
Expand Down
8 changes: 6 additions & 2 deletions src/core/directives/__test__/text.spec.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { textDirective } from '../text';
import compute from '../../utils/computeExpression';
import { textDirective } from '../text';

describe('.textDirective', () => {
it('should interpolate state into textContent', () => {
Expand All @@ -10,7 +10,11 @@ describe('.textDirective', () => {
textDirective({
el,
parts: [`text`],
data: { value: expression, compute: compute(expression, el), deps: ['foo'] },
data: {
value: expression,
compute: compute(expression, el),
deps: ['foo'],
},
state,
});
expect(el.textContent).toEqual('bar');
Expand Down
12 changes: 5 additions & 7 deletions src/core/directives/for.ts
Original file line number Diff line number Diff line change
@@ -1,16 +1,14 @@
/* istanbul ignore file */

import { DIRECTIVE_PREFIX } from '../../models/generics';
import { ASTNode, DirectiveProps } from '../../models/structs';

import compile from '../../core/compile';
import render from '../../core/render';
import { directives } from '../../core/directive';

import { expressionPropRE, parenthesisWrapReplaceRE } from '../utils/patterns';
import { getElementCustomProp, setElementCustomProp } from '../utils/elementCustomProp';
import render from '../../core/render';
import { DIRECTIVE_PREFIX } from '../../models/generics';
import { ASTNode, DirectiveProps } from '../../models/structs';
import adjustDeps from '../utils/adjustDeps';
import computeExpression from '../utils/computeExpression';
import { getElementCustomProp, setElementCustomProp } from '../utils/elementCustomProp';
import { expressionPropRE, parenthesisWrapReplaceRE } from '../utils/patterns';

// This directive is size-based, not content-based, since everything is compiled and rerendered

Expand Down
8 changes: 3 additions & 5 deletions src/core/directives/html.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
import { DirectiveProps } from '../../models/structs';

import compile from '../../core/compile';
import render from '../../core/render';
import { directives } from '../../core/directive';

import { getElementCustomProp, setElementCustomProp } from '../utils/elementCustomProp';
import render from '../../core/render';
import { DirectiveProps } from '../../models/structs';
import adjustDeps from '../utils/adjustDeps';
import { getElementCustomProp, setElementCustomProp } from '../utils/elementCustomProp';

export const htmlDirective = ({ el, data, state, node }: DirectiveProps): void => {
node = node!;
Expand Down
5 changes: 2 additions & 3 deletions src/core/directives/model.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { DirectiveProps, DirectiveData, State } from '../../models/structs';

import { getElementCustomProp, setElementCustomProp } from '../utils/elementCustomProp';
import { DirectiveData, DirectiveProps, State } from '../../models/structs';
import computeExpression from '../utils/computeExpression';
import { getElementCustomProp, setElementCustomProp } from '../utils/elementCustomProp';

export const inputCallback = (
el: HTMLInputElement,
Expand Down
1 change: 0 additions & 1 deletion src/core/directives/on.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import { DirectiveProps } from '../../models/structs';

import { getElementCustomProp, setElementCustomProp } from '../utils/elementCustomProp';

export const onDirective = ({ el, parts, data, state }: DirectiveProps): void => {
Expand Down
11 changes: 5 additions & 6 deletions src/core/render.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,8 @@
import { DIRECTIVE_PREFIX, UnknownKV } from '../models/generics';
import { Directives, ASTNode, ASTNodeType } from '../models/structs';
import { rawDirectiveSplitRE } from './utils/patterns';
import concurrent from './utils/concurrent';

import { ASTNode, ASTNodeType, Directives } from '../models/structs';
import { renderDirective } from './directive';
import concurrent from './utils/concurrent';
import { rawDirectiveSplitRE } from './utils/patterns';

const render = (
ast: ASTNode[],
Expand All @@ -13,7 +12,7 @@ const render = (
): void => {
const legalDirectiveNames = Object.keys(directives);

concurrent(true, function* () {
concurrent(25, function* () {
for (const node of ast) {
yield;
const isStatic = node.type === ASTNodeType.STATIC;
Expand Down Expand Up @@ -55,7 +54,7 @@ const render = (
}
}
}
})();
});
};

export default render;
4 changes: 2 additions & 2 deletions src/core/utils/__test__/patterns.spec.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import {
eventDirectivePrefixRE,
expressionPropRE,
rawDirectiveSplitRE,
hasDirectiveRE,
eventDirectivePrefixRE,
parenthesisWrapReplaceRE,
rawDirectiveSplitRE,
} from '../patterns';

describe('.patterns', () => {
Expand Down
5 changes: 2 additions & 3 deletions src/core/utils/concurrent.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,17 @@
// This is kind of like time slicing in React but less advanced

export const concurrent = (
limit = true,
threshold: number,
generatorFunction: () => Generator<undefined, void, unknown>
// eslint-disable-next-line @typescript-eslint/ban-types
): Function => {
const generator = generatorFunction();
const ms = limit ? 25 : 1000;
return function next() {
const start = performance.now();
let task = null;
do {
task = generator.next();
} while (performance.now() - start < ms && !task.done);
} while (performance.now() - start < threshold && !task.done);

if (task.done) return;
/* istanbul ignore next */
Expand Down
Loading

0 comments on commit a9165c9

Please # to comment.