@makano/rew 1.3.5 → 1.3.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/rew/modules/compiler.js +69 -2
- package/lib/rew/pkgs/styleway.js +88 -0
- package/lib/rew/pkgs/web.js +2 -90
- package/main.js +2 -1
- package/package.json +1 -1
| @@ -283,6 +283,40 @@ function useImp(token, options){ | |
| 283 283 | 
             
            	return '';
         | 
| 284 284 | 
             
            }
         | 
| 285 285 |  | 
| 286 | 
            +
            function mapTokensToStrings(tokens) {
         | 
| 287 | 
            +
              const result = [];
         | 
| 288 | 
            +
              let current = '';
         | 
| 289 | 
            +
              let inBrackets = false;
         | 
| 290 | 
            +
             | 
| 291 | 
            +
              tokens.forEach(token => {
         | 
| 292 | 
            +
                if (token.type === 'OTHER' && token.value === '{') {
         | 
| 293 | 
            +
                  if (current) {
         | 
| 294 | 
            +
                    result.push(current.trim());
         | 
| 295 | 
            +
                    current = '';
         | 
| 296 | 
            +
                  }
         | 
| 297 | 
            +
                  inBrackets = true;
         | 
| 298 | 
            +
                  current += token.value + ' ';
         | 
| 299 | 
            +
                } else if (token.type === 'OTHER' && token.value === '}') {
         | 
| 300 | 
            +
                  current += token.value;
         | 
| 301 | 
            +
                  result.push(current.trim());
         | 
| 302 | 
            +
                  current = '';
         | 
| 303 | 
            +
                  inBrackets = false;
         | 
| 304 | 
            +
                } else if(token.type === 'OTHER' && token.value === ',' && !inBrackets){
         | 
| 305 | 
            +
            			return;
         | 
| 306 | 
            +
            		} else {
         | 
| 307 | 
            +
                  current += token.value;
         | 
| 308 | 
            +
                  if (!inBrackets) {
         | 
| 309 | 
            +
                    result.push(current.trim());
         | 
| 310 | 
            +
                    current = '';
         | 
| 311 | 
            +
                  } else {
         | 
| 312 | 
            +
                    current += ' ';
         | 
| 313 | 
            +
                  }
         | 
| 314 | 
            +
                }
         | 
| 315 | 
            +
              });
         | 
| 316 | 
            +
             | 
| 317 | 
            +
              return result;
         | 
| 318 | 
            +
            }
         | 
| 319 | 
            +
             | 
| 286 320 | 
             
            function updateAliases(aliases, o = execOptions._syntaxAliases){
         | 
| 287 321 | 
             
            	for(let h in o){
         | 
| 288 322 | 
             
            		for(let i in o[h]){
         | 
| @@ -293,6 +327,17 @@ function updateAliases(aliases, o = execOptions._syntaxAliases){ | |
| 293 327 | 
             
            	return aliases;
         | 
| 294 328 | 
             
            }
         | 
| 295 329 |  | 
| 330 | 
            +
            function insertAt(array, index, ...values) {
         | 
| 331 | 
            +
              if (index > array.length) {
         | 
| 332 | 
            +
                index = array.length;
         | 
| 333 | 
            +
              } else if (index < 0) {
         | 
| 334 | 
            +
                index = 0;
         | 
| 335 | 
            +
              }
         | 
| 336 | 
            +
              array.splice(index, 0, ...values);
         | 
| 337 | 
            +
             | 
| 338 | 
            +
              return array;
         | 
| 339 | 
            +
            }
         | 
| 340 | 
            +
             | 
| 296 341 | 
             
            function compileRewStuff(content, options) {
         | 
| 297 342 | 
             
            	straceLog('TOKENIZE() for CURRENTFILE');
         | 
| 298 343 | 
             
            	const tokens = tokenizeCoffeeScript(content);
         | 
| @@ -318,7 +363,7 @@ function compileRewStuff(content, options) { | |
| 318 363 | 
             
                if ((token.type === "COMMENT" && multilineDeclare) || (token.type !== "COMMENT" && multilineDeclare)) {
         | 
| 319 364 | 
             
                  if(token.type === "COMMENT"){
         | 
| 320 365 | 
             
            				multilineDeclareBuffer.push(token.value.startsWith('###') ? token.value.slice(3) : token.value.slice(1));
         | 
| 321 | 
            -
            				if (token.value. | 
| 366 | 
            +
            				if (token.value.trim().endsWith(';')) {
         | 
| 322 367 | 
             
            					multilineDeclare = false;
         | 
| 323 368 | 
             
            					const combinedDeclaration = multilineDeclareBuffer.join('\n');
         | 
| 324 369 | 
             
            					declareAlias(aliases, { ...token, value: combinedDeclaration });
         | 
| @@ -454,6 +499,27 @@ function compileRewStuff(content, options) { | |
| 454 499 | 
             
            				if(useImp(nextToken, options)) updateAliases(aliases);
         | 
| 455 500 | 
             
            				result += `inc ${nextToken.value}`;
         | 
| 456 501 | 
             
            				i += n;
         | 
| 502 | 
            +
            			} else if (nextToken.type === 'OTHER' && nextToken.value == "(") {
         | 
| 503 | 
            +
            				const closingBraceToken = fnextToken(ind, tokens, 'OTHER', ')');
         | 
| 504 | 
            +
            				let lastindex = ind;
         | 
| 505 | 
            +
            				if (closingBraceToken) {
         | 
| 506 | 
            +
            					const namesTokens = tokens.slice(ind, closingBraceToken.ti);
         | 
| 507 | 
            +
            					const next = gnextToken(closingBraceToken.ti, 1, tokens);
         | 
| 508 | 
            +
            					let exports = [];
         | 
| 509 | 
            +
            					if(next?.token?.value == 'as'){
         | 
| 510 | 
            +
            						const ebraceOpen = gnextToken(next.token.ti, 1, tokens);
         | 
| 511 | 
            +
            						const ebraceClose = fnextToken(ebraceOpen.ti, tokens, 'OTHER', ')');
         | 
| 512 | 
            +
            						const exportsTokens = tokens.slice(ebraceOpen.ti+1, ebraceClose.ti);
         | 
| 513 | 
            +
            						exports = mapTokensToStrings(exportsTokens.filter(token => token.type !== 'WHITESPACE'));
         | 
| 514 | 
            +
            						lastindex = ebraceClose.ti;
         | 
| 515 | 
            +
            					} else lastindex = closingBraceToken.ti;
         | 
| 516 | 
            +
            					const statements = namesTokens.filter(token => token.type !== 'WHITESPACE').map((token, index) => {
         | 
| 517 | 
            +
            						return tokenizeCoffeeScript(`\nimport `+ (exports[index] ? `${exports[index].startsWith('@') ? '* as '+ exports[index].slice(1) : exports[index]} from ${token.value};` : `${token.value}`))
         | 
| 518 | 
            +
            					});
         | 
| 519 | 
            +
            					i = lastindex+1;
         | 
| 520 | 
            +
            					insertAt(tokens, i, ...statements.flat());
         | 
| 521 | 
            +
            					continue;
         | 
| 522 | 
            +
            				}
         | 
| 457 523 | 
             
            			} else if (nextToken.value === '{') {
         | 
| 458 524 | 
             
            				const closingBraceToken = fnextToken(ind, tokens, 'OTHER', '}');
         | 
| 459 525 | 
             
            				const nameToken = fnextToken(ind, tokens, 'STRING');
         | 
| @@ -617,7 +683,8 @@ function compileRewStuff(content, options) { | |
| 617 683 | 
             
            		options.aliases = aliases;
         | 
| 618 684 | 
             
            	}
         | 
| 619 685 | 
             
            	// console.log(aliases);
         | 
| 620 | 
            -
            	 | 
| 686 | 
            +
            	console.log(result);
         | 
| 687 | 
            +
            	return "";
         | 
| 621 688 | 
             
            	return result;
         | 
| 622 689 | 
             
            }
         | 
| 623 690 |  | 
| @@ -0,0 +1,88 @@ | |
| 1 | 
            +
             | 
| 2 | 
            +
            module.exports = () => ((styles) => {
         | 
| 3 | 
            +
              let css = "";
         | 
| 4 | 
            +
              const variables = {};
         | 
| 5 | 
            +
              const mixins = {};
         | 
| 6 | 
            +
             | 
| 7 | 
            +
              const parseValue = (v, self, name, vars) => {
         | 
| 8 | 
            +
                const vs = {...variables, ...vars, name, ...Object.fromEntries(Object.entries(self).map(i => ['prop_'+i[0], i[1]]))};
         | 
| 9 | 
            +
                return v.startsWith('@v') ? vs[v.split('@v')[1].trim()] : v
         | 
| 10 | 
            +
              .toString()
         | 
| 11 | 
            +
              .replace(/\$([A-Za-z0-9-_]+)/g, (_, name) => (vs)[name])
         | 
| 12 | 
            +
              }
         | 
| 13 | 
            +
             | 
| 14 | 
            +
              const declectProp = (value, name, selector, start, parent, self, vars = {}) => {
         | 
| 15 | 
            +
                let prop = `${name}: `;
         | 
| 16 | 
            +
                self.__parent = parent;
         | 
| 17 | 
            +
                if (typeof value == 'object') {
         | 
| 18 | 
            +
                  prop += parseValue(value.default || 'unset', self, name, vars) + ';';
         | 
| 19 | 
            +
                  prop += '}\n';
         | 
| 20 | 
            +
                  for (let state in value) {
         | 
| 21 | 
            +
                    if (state == 'default') continue;
         | 
| 22 | 
            +
                    else if (state.startsWith('@media')) {
         | 
| 23 | 
            +
                      prop += `${state} { ${start} ${name}: ${parseValue(value[state], self, name, vars)}; } }\n`
         | 
| 24 | 
            +
                    } else if (state.startsWith(':')) {
         | 
| 25 | 
            +
                      prop += `${selector}${state} { ${name}: ${parseValue(value[state], self, name, vars)}; }\n`
         | 
| 26 | 
            +
                    }
         | 
| 27 | 
            +
                  }
         | 
| 28 | 
            +
                  prop += start;
         | 
| 29 | 
            +
                } else {
         | 
| 30 | 
            +
                  let v = parseValue(value, self, name, vars);
         | 
| 31 | 
            +
                  if(typeof v == 'object') return declectProp(v, name, selector, start, parent, self, vars);
         | 
| 32 | 
            +
                  prop += v + ';';
         | 
| 33 | 
            +
                }
         | 
| 34 | 
            +
                return prop;
         | 
| 35 | 
            +
              }
         | 
| 36 | 
            +
             | 
| 37 | 
            +
              const declectNames = (names, $name, parent, values = {}) => {
         | 
| 38 | 
            +
                const start = $name ? $name + ' {' : '';
         | 
| 39 | 
            +
                let nameStyles = start;
         | 
| 40 | 
            +
                for (let name in names) {
         | 
| 41 | 
            +
                  let selector = name.replace(/,/g, ', &').replace(/&/g, $name || '');
         | 
| 42 | 
            +
                  if (name == '@variables') {
         | 
| 43 | 
            +
                    for (let i in names[name]) {
         | 
| 44 | 
            +
                      variables[i] = names[name][i];
         | 
| 45 | 
            +
                    }
         | 
| 46 | 
            +
                  } else if (name.startsWith('@mixin')) {
         | 
| 47 | 
            +
                    const mame = name.split('@mixin')[1].trim();
         | 
| 48 | 
            +
                    const mname = mame.split('(')[0];
         | 
| 49 | 
            +
                    const args = mame.replace(mname, '').slice(1, -1);
         | 
| 50 | 
            +
                    mixins[mname] = {
         | 
| 51 | 
            +
                      args: args.split(','),
         | 
| 52 | 
            +
                      value: names[name]
         | 
| 53 | 
            +
                    }
         | 
| 54 | 
            +
                  } else if (name.startsWith('@keyframes')) {
         | 
| 55 | 
            +
                    nameStyles += $name ? '' : name + '{';
         | 
| 56 | 
            +
             | 
| 57 | 
            +
                    for(let keyFrame in names[name]){
         | 
| 58 | 
            +
                      nameStyles += declectNames(names[name][keyFrame], keyFrame, names[name], values);
         | 
| 59 | 
            +
                    }
         | 
| 60 | 
            +
             | 
| 61 | 
            +
                    if(!$name) nameStyles += '}\n';
         | 
| 62 | 
            +
                  } else if ($name) {
         | 
| 63 | 
            +
                    if (name.startsWith('&')) {
         | 
| 64 | 
            +
                      nameStyles += '}\n';
         | 
| 65 | 
            +
                      nameStyles += declectNames(names[name], selector, names, values);
         | 
| 66 | 
            +
                      nameStyles += start;
         | 
| 67 | 
            +
                    } else if(name.startsWith('@include')) {
         | 
| 68 | 
            +
                      const mame = names[name];
         | 
| 69 | 
            +
                      const mname = mame.split('(')[0];
         | 
| 70 | 
            +
                      const args = mame.replace(mname, '').slice(1, -1).split(',');
         | 
| 71 | 
            +
                      if(mixins[mname]){
         | 
| 72 | 
            +
                        nameStyles += declectNames(mixins[mname].value, selector, names, {...values, ...Object.fromEntries(mixins[mname].args.map((n, i) => [n, args[i]]))}).trim().replace('@include ', '').slice(1, -1);
         | 
| 73 | 
            +
                      }
         | 
| 74 | 
            +
                    } else {
         | 
| 75 | 
            +
                      nameStyles += declectProp(names[name], name, $name, start, parent || styles, names, values);
         | 
| 76 | 
            +
                    }
         | 
| 77 | 
            +
                  } else {
         | 
| 78 | 
            +
                    nameStyles += declectNames(names[name], selector, names, values);
         | 
| 79 | 
            +
                  }
         | 
| 80 | 
            +
                }
         | 
| 81 | 
            +
                if ($name) nameStyles += '}\n';
         | 
| 82 | 
            +
                return nameStyles;
         | 
| 83 | 
            +
              }
         | 
| 84 | 
            +
             | 
| 85 | 
            +
              css += declectNames(styles);
         | 
| 86 | 
            +
             | 
| 87 | 
            +
              return css.replace(/(.+) \{\}/g, '');
         | 
| 88 | 
            +
            })
         | 
    
        package/lib/rew/pkgs/web.js
    CHANGED
    
    | @@ -4,7 +4,7 @@ const { compile } = require("../modules/compiler"); | |
| 4 4 | 
             
            const { wait } = require("../functions/wait");
         | 
| 5 5 | 
             
            const { generateRandomID } = require("../functions/id");
         | 
| 6 6 | 
             
            const { REW_FILE_TYPE } = require("../const/ext");
         | 
| 7 | 
            -
             | 
| 7 | 
            +
            const createStyles = require('./styleway')();
         | 
| 8 8 |  | 
| 9 9 | 
             
            const selfClosingElements = new Set([
         | 
| 10 10 | 
             
              'area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'link', 'meta', 'source', 'track', 'wbr'
         | 
| @@ -245,94 +245,6 @@ function renderToString(element, js = false) { | |
| 245 245 | 
             
              return js ? js === 'raw' ? eltJSON : JSON.stringify(eltJSON) : element instanceof TextNode ? `${type.text}` : `<${type.element}${propsString}>${selfClosingElements.has(type.element) ? '' : childrenHTML}${selfClosingElements.has(type.element) ? '' : `</${type.element}>`}`;
         | 
| 246 246 | 
             
            }
         | 
| 247 247 |  | 
| 248 | 
            -
            function createStyles(styles) {
         | 
| 249 | 
            -
              let css = "";
         | 
| 250 | 
            -
              const variables = {};
         | 
| 251 | 
            -
              const mixins = {};
         | 
| 252 | 
            -
             | 
| 253 | 
            -
              const parseValue = (v, self, name, vars) => {
         | 
| 254 | 
            -
                const vs = {...variables, ...vars, name, ...Object.fromEntries(Object.entries(self).map(i => ['prop_'+i[0], i[1]]))};
         | 
| 255 | 
            -
                return v.startsWith('@v') ? vs[v.split('@v')[1].trim()] : v
         | 
| 256 | 
            -
              .toString()
         | 
| 257 | 
            -
              .replace(/\$([A-Za-z0-9-_]+)/g, (_, name) => (vs)[name])
         | 
| 258 | 
            -
              }
         | 
| 259 | 
            -
             | 
| 260 | 
            -
              const declectProp = (value, name, selector, start, parent, self, vars = {}) => {
         | 
| 261 | 
            -
                let prop = `${name}: `;
         | 
| 262 | 
            -
                self.__parent = parent;
         | 
| 263 | 
            -
                if (typeof value == 'object') {
         | 
| 264 | 
            -
                  prop += parseValue(value.default || 'unset', self, name, vars) + ';';
         | 
| 265 | 
            -
                  prop += '}\n';
         | 
| 266 | 
            -
                  for (let state in value) {
         | 
| 267 | 
            -
                    if (state == 'default') continue;
         | 
| 268 | 
            -
                    else if (state.startsWith('@media')) {
         | 
| 269 | 
            -
                      prop += `${state} { ${start} ${name}: ${parseValue(value[state], self, name, vars)}; } }\n`
         | 
| 270 | 
            -
                    } else if (state.startsWith(':')) {
         | 
| 271 | 
            -
                      prop += `${selector}${state} { ${name}: ${parseValue(value[state], self, name, vars)}; }\n`
         | 
| 272 | 
            -
                    }
         | 
| 273 | 
            -
                  }
         | 
| 274 | 
            -
                  prop += start;
         | 
| 275 | 
            -
                } else {
         | 
| 276 | 
            -
                  let v = parseValue(value, self, name, vars);
         | 
| 277 | 
            -
                  if(typeof v == 'object') return declectProp(v, name, selector, start, parent, self, vars);
         | 
| 278 | 
            -
                  prop += v + ';';
         | 
| 279 | 
            -
                }
         | 
| 280 | 
            -
                return prop;
         | 
| 281 | 
            -
              }
         | 
| 282 | 
            -
             | 
| 283 | 
            -
              const declectNames = (names, $name, parent, values = {}) => {
         | 
| 284 | 
            -
                const start = $name ? $name + ' {' : '';
         | 
| 285 | 
            -
                let nameStyles = start;
         | 
| 286 | 
            -
                for (let name in names) {
         | 
| 287 | 
            -
                  let selector = name.replace(/,/g, ', &').replace(/&/g, $name || '');
         | 
| 288 | 
            -
                  if (name == '@variables') {
         | 
| 289 | 
            -
                    for (let i in names[name]) {
         | 
| 290 | 
            -
                      variables[i] = names[name][i];
         | 
| 291 | 
            -
                    }
         | 
| 292 | 
            -
                  } else if (name.startsWith('@mixin')) {
         | 
| 293 | 
            -
                    const mame = name.split('@mixin')[1].trim();
         | 
| 294 | 
            -
                    const mname = mame.split('(')[0];
         | 
| 295 | 
            -
                    const args = mame.replace(mname, '').slice(1, -1);
         | 
| 296 | 
            -
                    mixins[mname] = {
         | 
| 297 | 
            -
                      args: args.split(','),
         | 
| 298 | 
            -
                      value: names[name]
         | 
| 299 | 
            -
                    }
         | 
| 300 | 
            -
                  } else if (name.startsWith('@keyframes')) {
         | 
| 301 | 
            -
                    nameStyles += $name ? '' : name + '{';
         | 
| 302 | 
            -
             | 
| 303 | 
            -
                    for(let keyFrame in names[name]){
         | 
| 304 | 
            -
                      nameStyles += declectNames(names[name][keyFrame], keyFrame, names[name], values);
         | 
| 305 | 
            -
                    }
         | 
| 306 | 
            -
             | 
| 307 | 
            -
                    if(!$name) nameStyles += '}\n';
         | 
| 308 | 
            -
                  } else if ($name) {
         | 
| 309 | 
            -
                    if (name.startsWith('&')) {
         | 
| 310 | 
            -
                      nameStyles += '}\n';
         | 
| 311 | 
            -
                      nameStyles += declectNames(names[name], selector, names, values);
         | 
| 312 | 
            -
                      nameStyles += start;
         | 
| 313 | 
            -
                    } else if(name.startsWith('@include')) {
         | 
| 314 | 
            -
                      const mame = names[name];
         | 
| 315 | 
            -
                      const mname = mame.split('(')[0];
         | 
| 316 | 
            -
                      const args = mame.replace(mname, '').slice(1, -1).split(',');
         | 
| 317 | 
            -
                      if(mixins[mname]){
         | 
| 318 | 
            -
                        nameStyles += declectNames(mixins[mname].value, selector, names, {...values, ...Object.fromEntries(mixins[mname].args.map((n, i) => [n, args[i]]))}).trim().replace('@include ', '').slice(1, -1);
         | 
| 319 | 
            -
                      }
         | 
| 320 | 
            -
                    } else {
         | 
| 321 | 
            -
                      nameStyles += declectProp(names[name], name, $name, start, parent || styles, names, values);
         | 
| 322 | 
            -
                    }
         | 
| 323 | 
            -
                  } else {
         | 
| 324 | 
            -
                    nameStyles += declectNames(names[name], selector, names, values);
         | 
| 325 | 
            -
                  }
         | 
| 326 | 
            -
                }
         | 
| 327 | 
            -
                if ($name) nameStyles += '}\n';
         | 
| 328 | 
            -
                return nameStyles;
         | 
| 329 | 
            -
              }
         | 
| 330 | 
            -
             | 
| 331 | 
            -
              css += declectNames(styles);
         | 
| 332 | 
            -
             | 
| 333 | 
            -
              return css.replace(/(.+) \{\}/g, '');
         | 
| 334 | 
            -
            }
         | 
| 335 | 
            -
             | 
| 336 248 |  | 
| 337 249 | 
             
            class Page extends Node {
         | 
| 338 250 | 
             
              constructor() {
         | 
| @@ -556,7 +468,7 @@ module.exports = (context, importOptions) => { | |
| 556 468 | 
             
                }
         | 
| 557 469 | 
             
                invokeState(states, callback){
         | 
| 558 470 | 
             
                  const statesMapped = states.map(i => i instanceof State ? `getState('${i.id}')` : (typeof i == "function" ? i.toString() : JSON.stringify(i)));
         | 
| 559 | 
            -
                  return `((${callback})( | 
| 471 | 
            +
                  return `((${callback})((typeof event !== "undefined" ? event : null), ...[${statesMapped}]))`;
         | 
| 560 472 | 
             
                }
         | 
| 561 473 | 
             
                async bundleCode(code, options){
         | 
| 562 474 | 
             
                  return Web.prototype.bundle(generateRandomID(), {
         | 
    
        package/main.js
    CHANGED