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:
parent
57152e8ed5
commit
f506b512b4
31 changed files with 514 additions and 322 deletions
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -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);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue