a small incremental UI library for the web
javascript web ui
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

Add CSS generator

garrison f918e851 be513964

+41 -6
+39 -5
js/css.ts
··· 1 1 import { assert } from './utils'; 2 2 3 + export function generateCSS(stylesheet) { 4 + const output = generateStylesheet(stylesheet); 5 + return output; 6 + } 7 + 8 + function generateStylesheet(stylesheet) { 9 + const state = { 10 + output: '', 11 + }; 12 + 13 + for (const ruleset of stylesheet.rulesets) { 14 + generateRuleset(ruleset, state); 15 + } 16 + 17 + return state.output; 18 + } 19 + 20 + function generateRuleset(ruleset, state) { 21 + let firstSelector = true; 22 + for (const complexSelector of ruleset.selectorList.selectors) { 23 + if (firstSelector) firstSelector = false; 24 + else state.output += ', '; 25 + 26 + let firstEntry = true; 27 + for (const entry of complexSelector.entries) { 28 + if (firstEntry) firstEntry = false; 29 + else state.output += ' '; 30 + state.output += entry.text; 31 + } 32 + } 33 + 34 + const body = ruleset.body.text.trim().replace(/\n\s*/, '\n '); 35 + state.output += (' {\n ' + body + '\n}\n\n'); 36 + } 37 + 3 38 export function parseCSS(input) { 4 39 const stylesheet = parseStylesheet(input); 5 - console.log(JSON.stringify(stylesheet, null, 2)); 6 40 return stylesheet; 7 41 } 8 42 ··· 88 122 89 123 function parseComplexSelector(state) { 90 124 const {input} = state; 91 - const selectors = []; 125 + const entries = []; 92 126 while (true) { 93 127 refuteEof(state); 94 128 95 129 const simple = parseCompoundSelector(state); 96 - selectors.push(simple); 130 + entries.push(simple); 97 131 98 132 skipWhitepsace(state); 99 133 const char = input.charAt(state.pos); 100 134 if (char === '{' || char === ',') break; 101 135 102 136 if (isCombinator(char)) { 103 - selectors.push({type: 'combinator', text: char}); 137 + entries.push({type: 'combinator', text: char}); 104 138 state.pos++; 105 139 skipWhitepsace(state); 106 140 } ··· 108 142 109 143 return { 110 144 type: 'complex_selector', 111 - content: selectors, 145 + entries: entries, 112 146 }; 113 147 } 114 148
+2 -1
js/hooks.ts
··· 1 1 import { queueFiberTree } from './render.ts'; 2 2 import { getCurrentFiber } from './current.ts'; 3 3 import { pushSideEffect } from './effects.ts'; 4 - import { parseCSS } from './css.ts'; 4 + import { parseCSS, generateCSS } from './css.ts'; 5 5 6 6 export const Hook = { 7 7 State: 'state', ··· 78 78 79 79 export function useStyle(text) { 80 80 const ast = parseCSS(text); 81 + generateCSS(ast); 81 82 } 82 83 83 84 export function cleanUpEffects(fiber) {