1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-10-13 22:41:57 +00:00

Make JS X Again

* Configure the project to allow the use of JSX in .jsx files.
* Add linting for JSX.
* Rewrite most existing code that uses `createElement` to use JSX syntax.
* Stop importing `createElement as e`. That's what the minifier is for. And we don't have to write it manually so much now because of JSX syntax.
This commit is contained in:
SirStendec 2018-04-01 18:24:08 -04:00
parent 57152e8ed5
commit f506b512b4
31 changed files with 514 additions and 322 deletions

View file

@ -30,9 +30,12 @@ function camelCase(name) {
}
export function createElement(tag, props, children, no_sanitize) {
export function createElement(tag, props, ...children) {
const el = document.createElement(tag);
if ( children.length === 1)
children = children[0];
if ( typeof props === 'string' )
el.className = props;
else if ( props )
@ -73,7 +76,7 @@ export function createElement(tag, props, children, no_sanitize) {
}
if ( children )
setChildren(el, children, no_sanitize);
setChildren(el, children);
return el;
}

View file

@ -521,7 +521,9 @@ export class Module extends EventEmitter {
for(const raw_path of ctx.keys()) {
const raw_module = ctx(raw_path),
module = raw_module.module || raw_module.default,
name = raw_path.slice(2, raw_path.length - (raw_path.endsWith('/index.js') ? 9 : 3));
name = raw_path.slice(2, raw_path.length - (raw_path.endsWith('/index.jsx') ? 10 : raw_path.endsWith('/index.js') ? 9 : raw_path.endsWith('.jsx') ? 4 : 3));
// TODO: rewrite the name code to not have like 4 endsWith in it.
try {
added[name] = this.register(name, module);

View file

@ -8,7 +8,7 @@
// Better because they aren't hidden by parents with overflow: hidden;
// ============================================================================
import {createElement as e, setChildren} from 'utilities/dom';
import {createElement, setChildren} from 'utilities/dom';
import {maybe_call} from 'utilities/object';
import Popper from 'popper.js';
@ -208,17 +208,17 @@ export class Tooltip {
return;
// Build the DOM.
const arrow = e('div', opts.arrowClass),
inner = tip.element = e('div', opts.innerClass),
const arrow = createElement('div', opts.arrowClass),
inner = tip.element = createElement('div', opts.innerClass),
el = tip.outer = e('div', {
el = tip.outer = createElement('div', {
className: opts.tooltipClass
}, [inner, arrow]);
arrow.setAttribute('x-arrow', true);
if ( opts.arrowInner )
arrow.appendChild(e('div', opts.arrowInner));
arrow.appendChild(createElement('div', opts.arrowInner));
if ( tip.add_class ) {
inner.classList.add(tip.add_class);