From f7ea49c88717c0c15835c9024c84a95678836a30 Mon Sep 17 00:00:00 2001 From: Akshay Nair Date: Fri, 25 Aug 2023 11:38:01 +0530 Subject: refactor: refactors declarations --- src/declarations.ts | 141 +++++++++++++++++++++------------------------------- src/index.ts | 13 ++--- 2 files changed, 65 insertions(+), 89 deletions(-) (limited to 'src') diff --git a/src/declarations.ts b/src/declarations.ts index c0966fa..a82f42f 100644 --- a/src/declarations.ts +++ b/src/declarations.ts @@ -1,37 +1,14 @@ -import { EvalActions, evalExprAsString } from './eval' +import { EvalActions, EvalValue, evalExpr } from './eval' import { Expr, Selector, SelectorComp, parseDeclarations } from './parser' import { match, matchString } from './utils/adt' export interface Declaration { selector: Selector - properties: Map + properties: Map + children: Array isInstance: boolean } -export interface DeclarationEval { - selector: Selector - properties: Array -} - -export const evaluateDeclaration = async ( - { selector, properties }: Declaration, - actions: EvalActions, -): Promise => { - if (properties.size === 0) return { selector, properties: [] } - - const props = await Promise.all( - [...properties.entries()].map(async ([key, expr]) => { - // Ignore errors? - const result = await evalExprAsString(expr, actions).catch((e: any) => - console.warn(e), - ) - return [key, result ?? ''] as const - }), - ) - - return { selector, properties: props } -} - const instanceCountMap = new Map() const getUniqueInstanceId = (id: string) => { const instanceCount = instanceCountMap.get(id) ?? 0 @@ -39,78 +16,76 @@ const getUniqueInstanceId = (id: string) => { return `${id}--index-${instanceCount}` } -export const toDeclaration = (expr: Expr): Declaration | undefined => { - let selector: Selector | undefined - const properties: Map = new Map() - let isInstance = false +export const toDeclaration = + (actions: EvalActions) => + async (expr: Expr): Promise => { + let selector: Selector | undefined + const properties: Map = new Map() + const children: Array = [] + let isInstance = false - match(expr, { - Selector: sel => { - selector = sel - }, - Call: ({ name, args }) => { - matchString(name, { - instance: () => { - isInstance = true - const [sel, map] = args + await match(expr, { + Selector: async sel => { + selector = sel + }, + Call: async ({ name, args }) => { + return matchString(name, { + // h: () => { + // + // }, + instance: async () => { + isInstance = true + const [sel, map] = args - // Selector - match(sel, { - Selector: sel => { - selector = sel - }, - _: _ => {}, - }) + // Selector + match(sel, { + Selector: sel => { + selector = sel + }, + _: _ => {}, + }) - // TODO: Refactor with eval - match(map, { - Call: ({ name, args }) => { - if (name !== 'map') return - for (const arg of args) { - match(arg, { - Pair: ({ key, value }) => properties.set(key, value), - _: _ => {}, - }) - } - }, - }) - }, - _: () => { - throw new Error(`weird function in cssx-chi9ldren: ${name}`) - }, - }) - }, - _: () => {}, - }) + const props = await evalExpr(map, actions) + match(props, { + Map: props => { + for (const [key, value] of Object.entries(props)) { + properties.set(key, value) + } + }, + _: _ => {}, + }) + }, + _: async () => { + throw new Error(`weird function in cssx-chi9ldren: ${name}`) + }, + }) + }, + _: async () => {}, + }) - if (!selector) return undefined + if (!selector) return undefined - if (isInstance) { - const baseId = selector.id - selector.id = getUniqueInstanceId(selector.id) - selector.selectors.push(SelectorComp.Attr(['data-instance', baseId])) - } + if (isInstance) { + const baseId = selector.id + selector.id = getUniqueInstanceId(selector.id) + selector.selectors.push(SelectorComp.Attr(['data-instance', baseId])) + } - return { selector, properties, isInstance } -} + return { selector, properties, children, isInstance } + } export const expressionsToDeclrs = async ( exprs: Array, actions: EvalActions, -): Promise> => { - const declrs = await Promise.all( - exprs - .map(toDeclaration) - .filter(declr => !!declr) - .map(declr => declr && evaluateDeclaration(declr, actions)), - ) - return declrs.filter(declr => !!declr) as Array +): Promise> => { + const declrs = await Promise.all(exprs.map(toDeclaration(actions))) + return declrs.filter(declr => !!declr) as Array } export const extractDeclaration = async ( input: string, actions: EvalActions, -): Promise> => { +): Promise> => { const exprs = parseDeclarations(input) return expressionsToDeclrs(exprs, actions) } diff --git a/src/index.ts b/src/index.ts index e5803d2..69d1fea 100644 --- a/src/index.ts +++ b/src/index.ts @@ -7,8 +7,8 @@ import { } from './eval' import { extractDeclaration, - DeclarationEval, expressionsToDeclrs, + Declaration, } from './declarations' import { Expr, parse } from './parser' import { match, matchString } from './utils/adt' @@ -68,7 +68,7 @@ export const getPropertyValue = ($element: HTMLElement, prop: string) => { export const getDeclarations = ( $element: HTMLElement, actions: EvalActions, -): Promise> => { +): Promise> => { const value = getPropertyValue($element, PROPERTIES.CHILDREN) return extractDeclaration(value, actions) } @@ -248,7 +248,7 @@ export const handleEvents = async ( } const declarationToElement = ( - declaration: DeclarationEval, + declaration: Declaration, $parent?: HTMLElement, ): { node: HTMLElement; isNewElement: boolean } => { const { tag, id, selectors } = declaration.selector @@ -270,15 +270,16 @@ const declarationToElement = ( }) } - for (const [key, value] of declaration.properties) { - $child?.style.setProperty(key, JSON.stringify(value)) + for (const [key, evalValue] of declaration.properties) { + const value = evalValueToString(evalValue) + $child?.style.setProperty(key, JSON.stringify(value || '')) } return { node: $child, isNewElement } } const createLayer = async ( - declarations: Array, + declarations: Array, $parent: HTMLElement, ) => { const $childrenRoot = -- cgit v1.3.1