diff --git a/client/admin/brewUtils/brewCleanup/brewCleanup.jsx b/client/admin/brewUtils/brewCleanup/brewCleanup.jsx index 1675bdc95..6cec01178 100644 --- a/client/admin/brewUtils/brewCleanup/brewCleanup.jsx +++ b/client/admin/brewUtils/brewCleanup/brewCleanup.jsx @@ -1,7 +1,8 @@ -import React, {createClass} from 'react'; +import React from 'react'; +import createReactClass from 'create-react-class'; import request from 'superagent'; -const BrewCleanup = createClass({ +const BrewCleanup = createReactClass({ displayName : 'BrewCleanup', getDefaultProps(){ return {}; diff --git a/client/admin/brewUtils/brewCompress/brewCompress.jsx b/client/admin/brewUtils/brewCompress/brewCompress.jsx index 2aee2a511..181315fce 100644 --- a/client/admin/brewUtils/brewCompress/brewCompress.jsx +++ b/client/admin/brewUtils/brewCompress/brewCompress.jsx @@ -1,7 +1,8 @@ -import React, {createClass} from 'react'; +import React from 'react'; +import createReactClass from 'create-react-class'; import request from 'superagent'; -const BrewCompress = createClass({ +const BrewCompress = createReactClass({ displayName : 'BrewCompress', getDefaultProps(){ return {}; diff --git a/client/admin/brewUtils/brewLookup/brewLookup.jsx b/client/admin/brewUtils/brewLookup/brewLookup.jsx index 3211b43aa..6b725198c 100644 --- a/client/admin/brewUtils/brewLookup/brewLookup.jsx +++ b/client/admin/brewUtils/brewLookup/brewLookup.jsx @@ -1,10 +1,11 @@ -import React, {createClass} from 'react'; +import React from 'react'; +import createReactClass from 'create-react-class'; import request from 'superagent'; import cx from 'classnames'; import Moment from 'moment'; -const BrewLookup = createClass({ +const BrewLookup = createReactClass({ getDefaultProps() { return {}; }, diff --git a/client/admin/brewUtils/stats/stats.jsx b/client/admin/brewUtils/stats/stats.jsx index 988bfbdfb..b05d3afd5 100644 --- a/client/admin/brewUtils/stats/stats.jsx +++ b/client/admin/brewUtils/stats/stats.jsx @@ -1,7 +1,8 @@ -import React, {createClass} from 'react'; +import React from 'react'; +import createReactClass from 'create-react-class'; import request from 'superagent'; -const Stats = createClass({ +const Stats = createReactClass({ displayName : 'Stats', getDefaultProps(){ return {}; diff --git a/client/admin/lockTools/lockTools.jsx b/client/admin/lockTools/lockTools.jsx index f2701c47e..8144d5d11 100644 --- a/client/admin/lockTools/lockTools.jsx +++ b/client/admin/lockTools/lockTools.jsx @@ -1,10 +1,11 @@ /*eslint max-lines: ["warn", {"max": 500, "skipBlankLines": true, "skipComments": true}]*/ -require('./lockTools.less'); -import React, {createClass} from 'react'; +import './lockTools.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; import request from '../../homebrew/utils/request-middleware.js'; -const LockTools = createClass({ +const LockTools = createReactClass({ displayName : 'LockTools', getInitialState : function() { return { @@ -54,7 +55,7 @@ const LockTools = createClass({ } }); -const LockBrew = createClass({ +const LockBrew = createReactClass({ displayName : 'LockBrew', getInitialState : function() { // Default values @@ -182,7 +183,7 @@ const LockBrew = createClass({ } }); -const LockTable = createClass({ +const LockTable = createReactClass({ displayName : 'LockTable', getDefaultProps : function() { return { @@ -272,7 +273,7 @@ const LockTable = createClass({ } }); -const LockLookup = createClass({ +const LockLookup = createReactClass({ displayName : 'LockLookup', getDefaultProps : function() { return { diff --git a/client/admin/notificationUtils/notificationAdd/notificationAdd.jsx b/client/admin/notificationUtils/notificationAdd/notificationAdd.jsx index 122b0320c..3a64d4bf7 100644 --- a/client/admin/notificationUtils/notificationAdd/notificationAdd.jsx +++ b/client/admin/notificationUtils/notificationAdd/notificationAdd.jsx @@ -1,4 +1,4 @@ -require('./notificationAdd.less'); +import './notificationAdd.less'; import React, { useState, useRef } from 'react'; import request from 'superagent'; diff --git a/client/admin/notificationUtils/notificationLookup/notificationLookup.jsx b/client/admin/notificationUtils/notificationLookup/notificationLookup.jsx index e3c0e0ae4..25d864274 100644 --- a/client/admin/notificationUtils/notificationLookup/notificationLookup.jsx +++ b/client/admin/notificationUtils/notificationLookup/notificationLookup.jsx @@ -1,5 +1,4 @@ -require('./notificationLookup.less'); - +import './notificationLookup.less'; import React, { useState} from 'react'; import request from 'superagent'; import Moment from 'moment'; diff --git a/client/components/codeEditor/codeEditor.jsx b/client/components/codeEditor/codeEditor.jsx index cd759463f..aa5b6b737 100644 --- a/client/components/codeEditor/codeEditor.jsx +++ b/client/components/codeEditor/codeEditor.jsx @@ -1,51 +1,58 @@ /* eslint-disable max-lines */ -require('./codeEditor.less'); -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); -const closeTag = require('./close-tag'); -const autoCompleteEmoji = require('./autocompleteEmoji'); +import './codeEditor.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; +import _ from 'lodash'; +import closeTag from './close-tag'; +import autoCompleteEmoji from './autocompleteEmoji'; +import Codemirror from 'codemirror'; -let CodeMirror; -if(typeof window !== 'undefined'){ - CodeMirror = require('codemirror'); +// ================= Language Modes ================= +// Github flavoured markdown +import 'codemirror/mode/gfm/gfm.js'; +import 'codemirror/mode/css/css.js'; +import 'codemirror/mode/javascript/javascript.js'; - //Language Modes - require('codemirror/mode/gfm/gfm.js'); //Github flavoured markdown - require('codemirror/mode/css/css.js'); - require('codemirror/mode/javascript/javascript.js'); +// ================= Addons ================= - //Addons - //Code folding - require('codemirror/addon/fold/foldcode.js'); - require('codemirror/addon/fold/foldgutter.js'); - //Search and replace - require('codemirror/addon/search/search.js'); - require('codemirror/addon/search/searchcursor.js'); - require('codemirror/addon/search/jump-to-line.js'); - require('codemirror/addon/search/match-highlighter.js'); - require('codemirror/addon/search/matchesonscrollbar.js'); - require('codemirror/addon/dialog/dialog.js'); - //Trailing space highlighting - // require('codemirror/addon/edit/trailingspace.js'); - //Active line highlighting - // require('codemirror/addon/selection/active-line.js'); - //Scroll past last line - require('codemirror/addon/scroll/scrollpastend.js'); - //Auto-closing - //XML code folding is a requirement of the auto-closing tag feature and is not enabled - require('codemirror/addon/fold/xml-fold.js'); - require('codemirror/addon/edit/closetag.js'); - //Autocompletion - require('codemirror/addon/hint/show-hint.js'); +// ---- Code folding ---- +import 'codemirror/addon/fold/foldcode.js'; +import 'codemirror/addon/fold/foldgutter.js'; +import 'codemirror/addon/fold/xml-fold.js'; - const foldPagesCode = require('./fold-pages'); - foldPagesCode.registerHomebreweryHelper(CodeMirror); - const foldCSSCode = require('./fold-css'); - foldCSSCode.registerHomebreweryHelper(CodeMirror); -} +// ---- Search and replace ---- +import 'codemirror/addon/search/search.js'; +import 'codemirror/addon/search/searchcursor.js'; +import 'codemirror/addon/search/jump-to-line.js'; +import 'codemirror/addon/search/match-highlighter.js'; +import 'codemirror/addon/search/matchesonscrollbar.js'; +import 'codemirror/addon/dialog/dialog.js'; -const CodeEditor = createClass({ +// Trailing space highlighting +// import 'codemirror/addon/edit/trailingspace.js'; +// Active line highlighting +// import 'codemirror/addon/selection/active-line.js'; +// Scroll past last line +import 'codemirror/addon/scroll/scrollpastend.js'; + +// ---- Auto-closing ---- +import 'codemirror/addon/edit/closetag.js'; + +// ---- Autocompletion ---- +import 'codemirror/addon/hint/show-hint.js'; + +// ================= Custom Fold Helpers ================= +import foldPagesCode from './fold-pages'; +import foldCSSCode from './fold-css'; + +let CodeMirror = Codemirror; + +// register helpers +foldPagesCode.registerHomebreweryHelper(CodeMirror); +foldCSSCode.registerHomebreweryHelper(CodeMirror); + + +const CodeEditor = createReactClass({ displayName : 'CodeEditor', getDefaultProps : function() { return { diff --git a/client/components/combobox.jsx b/client/components/combobox.jsx index 22afab766..fc08cfcdb 100644 --- a/client/components/combobox.jsx +++ b/client/components/combobox.jsx @@ -1,9 +1,9 @@ -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); -require('./combobox.less'); +import React from 'react'; +import request from 'superagent'; +import _ from 'lodash'; +import './combobox.less'; -const Combobox = createClass({ +const Combobox = createReactClass({ displayName : 'Combobox', getDefaultProps : function() { return { diff --git a/client/components/renderWarnings/renderWarnings.jsx b/client/components/renderWarnings/renderWarnings.jsx index b1e93acc8..75fdb8ff4 100644 --- a/client/components/renderWarnings/renderWarnings.jsx +++ b/client/components/renderWarnings/renderWarnings.jsx @@ -1,11 +1,11 @@ -require('./renderWarnings.less'); -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); +import './renderWarnings.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; +import _ from 'lodash'; import Dialog from '../dialog.jsx'; -const RenderWarnings = createClass({ +const RenderWarnings = createReactClass({ displayName : 'RenderWarnings', getInitialState : function() { return { diff --git a/client/components/splitPane/splitPane.jsx b/client/components/splitPane/splitPane.jsx index c92cc5c5f..7a5d28103 100644 --- a/client/components/splitPane/splitPane.jsx +++ b/client/components/splitPane/splitPane.jsx @@ -1,6 +1,5 @@ -require('./splitPane.less'); -const React = require('react'); -const { useState, useEffect } = React; +import './splitPane.less'; +import React, { useEffect, useState} from 'react'; const PANE_WIDTH_KEY = 'HB_editor_splitWidth'; const LIVE_SCROLL_KEY = 'HB_editor_liveScroll'; diff --git a/client/components/svg/cauldron.svg.jsx b/client/components/svg/cauldron.svg.jsx index e57d50f48..c396dd05e 100644 --- a/client/components/svg/cauldron.svg.jsx +++ b/client/components/svg/cauldron.svg.jsx @@ -1,5 +1,4 @@ -const React = require('react'); -const createClass = require('create-react-class'); +import React from 'react'; export default function(props){ return diff --git a/client/components/svg/naturalcrit-d20.svg.jsx b/client/components/svg/naturalcrit-d20.svg.jsx index 1a8b81d3d..9109d6e91 100644 --- a/client/components/svg/naturalcrit-d20.svg.jsx +++ b/client/components/svg/naturalcrit-d20.svg.jsx @@ -1,5 +1,4 @@ -const React = require('react'); -const createClass = require('create-react-class'); +import React from 'react'; export default function(props){ return ; diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx index c98993816..ebf008dd1 100644 --- a/client/homebrew/brewRenderer/brewRenderer.jsx +++ b/client/homebrew/brewRenderer/brewRenderer.jsx @@ -1,20 +1,19 @@ /*eslint max-lines: ["warn", {"max": 300, "skipBlankLines": true, "skipComments": true}]*/ -require('./brewRenderer.less'); -const React = require('react'); -const { useState, useRef, useMemo, useEffect } = React; -const _ = require('lodash'); +import './brewRenderer.less'; +import React, { useState, useRef, useMemo, useEffect } from 'react'; +import _ from 'lodash'; -const MarkdownLegacy = require('markdownLegacy.js'); +import MarkdownLegacy from 'markdownLegacy.js'; import Markdown from 'markdown.js'; -const ErrorBar = require('./errorBar/errorBar.jsx'); -const ToolBar = require('./toolBar/toolBar.jsx'); +import ErrorBar from './errorBar/errorBar.jsx'; +import ToolBar from './toolBar/toolBar.jsx'; //TODO: move to the brew renderer -const RenderWarnings = require('client/components/renderWarnings/renderWarnings.jsx'); -const NotificationPopup = require('./notificationPopup/notificationPopup.jsx'); -const Frame = require('react-frame-component').default; -const dedent = require('dedent-tabs').default; -const { printCurrentBrew } = require('../../../shared/helpers.js'); +import RenderWarnings from 'client/components/renderWarnings/renderWarnings.jsx'; +import NotificationPopup from './notificationPopup/notificationPopup.jsx'; +import Frame from 'react-frame-component'; +import dedent from 'dedent-tabs'; +import { printCurrentBrew } from '../../../shared/helpers.js'; import HeaderNav from './headerNav/headerNav.jsx'; import { safeHTML } from './safeHTML.js'; diff --git a/client/homebrew/brewRenderer/errorBar/errorBar.jsx b/client/homebrew/brewRenderer/errorBar/errorBar.jsx index f8ab03ede..b4522d759 100644 --- a/client/homebrew/brewRenderer/errorBar/errorBar.jsx +++ b/client/homebrew/brewRenderer/errorBar/errorBar.jsx @@ -1,5 +1,5 @@ -require('./errorBar.less'); -const React = require('react'); +import './errorBar.less'; +import React from 'react'; import Dialog from '../../../components/dialog.jsx'; diff --git a/client/homebrew/brewRenderer/headerNav/headerNav.jsx b/client/homebrew/brewRenderer/headerNav/headerNav.jsx index 04ced2585..3b184aff0 100644 --- a/client/homebrew/brewRenderer/headerNav/headerNav.jsx +++ b/client/homebrew/brewRenderer/headerNav/headerNav.jsx @@ -1,7 +1,7 @@ -require('./headerNav.less'); +import './headerNav.less'; -import * as React from 'react'; -import * as _ from 'lodash'; +import React from 'react'; +import _ from 'lodash'; const MAX_TEXT_LENGTH = 40; diff --git a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx index e51fe5db2..dd05391f0 100644 --- a/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx +++ b/client/homebrew/brewRenderer/notificationPopup/notificationPopup.jsx @@ -1,4 +1,4 @@ -require('./notificationPopup.less'); +import './notificationPopup.less'; import React, { useEffect, useState } from 'react'; import request from '../../utils/request-middleware.js'; import Markdown from 'markdown.js'; diff --git a/client/homebrew/brewRenderer/toolBar/toolBar.jsx b/client/homebrew/brewRenderer/toolBar/toolBar.jsx index ace6ab113..27a190d0f 100644 --- a/client/homebrew/brewRenderer/toolBar/toolBar.jsx +++ b/client/homebrew/brewRenderer/toolBar/toolBar.jsx @@ -1,8 +1,7 @@ /* eslint-disable max-lines */ -require('./toolBar.less'); -const React = require('react'); -const { useState, useEffect } = React; -const _ = require('lodash'); +import '.toolBar.less'; +import React, { useState, useEffect } from 'react'; +import _ from 'lodash'; import { Anchored, AnchoredBox, AnchoredTrigger } from '../../../components/Anchored.jsx'; diff --git a/client/homebrew/editor/editor.jsx b/client/homebrew/editor/editor.jsx index 7c0b881ed..1f19a14c8 100644 --- a/client/homebrew/editor/editor.jsx +++ b/client/homebrew/editor/editor.jsx @@ -1,14 +1,14 @@ /*eslint max-lines: ["warn", {"max": 500, "skipBlankLines": true, "skipComments": true}]*/ -require('./editor.less'); -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); -const dedent = require('dedent-tabs').default; +import './editor.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; +import _ from 'lodash'; +import dedent from 'dedent-tabs'; import Markdown from '../../../shared/markdown.js'; -const CodeEditor = require('client/components/codeEditor/codeEditor.jsx'); -const SnippetBar = require('./snippetbar/snippetbar.jsx'); -const MetadataEditor = require('./metadataEditor/metadataEditor.jsx'); +import CodeEditor from 'client/components/codeEditor/codeEditor.jsx'; +import SnippetBar from './snippetbar/snippetbar.jsx'; +import MetadataEditor from './metadataEditor/metadataEditor.jsx'; const EDITOR_THEME_KEY = 'HB_editor_theme'; @@ -31,7 +31,7 @@ const DEFAULT_SNIPPET_TEXT = dedent` `; let isJumping = false; -const Editor = createClass({ +const Editor = createReactClass({ displayName : 'Editor', getDefaultProps : function() { return { diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.jsx b/client/homebrew/editor/metadataEditor/metadataEditor.jsx index f41328b8e..21fdca646 100644 --- a/client/homebrew/editor/metadataEditor/metadataEditor.jsx +++ b/client/homebrew/editor/metadataEditor/metadataEditor.jsx @@ -1,19 +1,19 @@ /* eslint-disable max-lines */ -require('./metadataEditor.less'); -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); +import './metadataEditor.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; +import _ from 'lodash'; import request from '../../utils/request-middleware.js'; -const Combobox = require('client/components/combobox.jsx'); -const TagInput = require('../tagInput/tagInput.jsx'); +import Combobox from 'client/components/combobox.jsx'; +import TagInput from '../tagInput/tagInput.jsx'; -const Themes = require('themes/themes.json'); -const validations = require('./validations.js'); +import Themes from 'themes/themes.json'; +import validations from './validations.js'; const SYSTEMS = ['5e', '4e', '3.5e', 'Pathfinder']; -const homebreweryThumbnail = require('../../thumbnail.png'); +import homebreweryThumbnail from '../../thumbnail.png'; const callIfExists = (val, fn, ...args)=>{ if(val[fn]) { @@ -21,7 +21,7 @@ const callIfExists = (val, fn, ...args)=>{ } }; -const MetadataEditor = createClass({ +const MetadataEditor = createReactClass({ displayName : 'MetadataEditor', getDefaultProps : function() { return { diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx index 9da299b52..73c8e2f5b 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.jsx +++ b/client/homebrew/editor/snippetbar/snippetbar.jsx @@ -1,29 +1,36 @@ /*eslint max-lines: ["warn", {"max": 350, "skipBlankLines": true, "skipComments": true}]*/ -require('./snippetbar.less'); -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); -const cx = require('classnames'); +import './snippetbar.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; + +import _ from 'lodash'; +import cx from 'classnames'; import { loadHistory } from '../../utils/versionHistory.js'; import { brewSnippetsToJSON } from '../../../../shared/helpers.js'; -//Import all themes -const ThemeSnippets = {}; -ThemeSnippets['Legacy_5ePHB'] = require('themes/Legacy/5ePHB/snippets.js'); -ThemeSnippets['V3_5ePHB'] = require('themes/V3/5ePHB/snippets.js'); -ThemeSnippets['V3_5eDMG'] = require('themes/V3/5eDMG/snippets.js'); -ThemeSnippets['V3_Journal'] = require('themes/V3/Journal/snippets.js'); -ThemeSnippets['V3_Blank'] = require('themes/V3/Blank/snippets.js'); +import Legacy5ePHB from 'themes/Legacy/5ePHB/snippets.js'; +import V3_5ePHB from 'themes/V3/5ePHB/snippets.js'; +import V3_5eDMG from 'themes/V3/5eDMG/snippets.js'; +import V3_Journal from 'themes/V3/Journal/snippets.js'; +import V3_Blank from 'themes/V3/Blank/snippets.js'; -const EditorThemes = require('build/homebrew/codeMirror/editorThemes.json'); +const ThemeSnippets = { + Legacy_5ePHB: Legacy5ePHB, + V3_5ePHB: V3_5ePHB, + V3_5eDMG: V3_5eDMG, + V3_Journal: V3_Journal, + V3_Blank: V3_Blank, +}; + +import EditorThemes from 'build/homebrew/codeMirror/editorThemes.json'; const execute = function(val, props){ if(_.isFunction(val)) return val(props); return val; }; -const Snippetbar = createClass({ +const Snippetbar = createReactClass({ displayName : 'SnippetBar', getDefaultProps : function() { return { @@ -283,7 +290,7 @@ const Snippetbar = createClass({ export default Snippetbar; -const SnippetGroup = createClass({ +const SnippetGroup = createReactClass({ displayName : 'SnippetGroup', getDefaultProps : function() { return { diff --git a/client/homebrew/editor/tagInput/tagInput.jsx b/client/homebrew/editor/tagInput/tagInput.jsx index e3e750263..8ed006283 100644 --- a/client/homebrew/editor/tagInput/tagInput.jsx +++ b/client/homebrew/editor/tagInput/tagInput.jsx @@ -1,7 +1,6 @@ -require('./tagInput.less'); -const React = require('react'); -const { useState, useEffect } = React; -const _ = require('lodash'); +import './tagInput.less'; +import React, { useState, useEffect } from 'react'; +import _ from 'lodash'; const TagInput = ({ unique = true, values = [], ...props })=>{ const [tempInputText, setTempInputText] = useState(''); diff --git a/client/homebrew/navbar/account.navitem.jsx b/client/homebrew/navbar/account.navitem.jsx index e0ebc82cb..0bec1d27d 100644 --- a/client/homebrew/navbar/account.navitem.jsx +++ b/client/homebrew/navbar/account.navitem.jsx @@ -1,9 +1,9 @@ -const React = require('react'); -const createClass = require('create-react-class'); -const Nav = require('client/homebrew/navbar/nav.jsx'); -const request = require('superagent'); +import React from 'react'; +import createReactClass from 'create-react-class'; +import request from 'superagent'; +import Nav from 'client/homebrew/navbar/nav.jsx'; -const Account = createClass({ +const Account = createReactClass({ displayName : 'AccountNavItem', getInitialState : function() { return { diff --git a/client/homebrew/navbar/error-navitem.jsx b/client/homebrew/navbar/error-navitem.jsx index 1dea63ddd..01e1ca516 100644 --- a/client/homebrew/navbar/error-navitem.jsx +++ b/client/homebrew/navbar/error-navitem.jsx @@ -1,6 +1,6 @@ -require('./error-navitem.less'); -const React = require('react'); -const Nav = require('client/homebrew/navbar/nav.jsx'); +import './error-navitem.less'; +import React from 'react'; +import Nav from 'client/homebrew/navbar/nav.jsx'; const ErrorNavItem = ({ error = '', clearError })=>{ const response = error.response; diff --git a/client/homebrew/navbar/help.navitem.jsx b/client/homebrew/navbar/help.navitem.jsx index 1487f0c8b..145d5bda4 100644 --- a/client/homebrew/navbar/help.navitem.jsx +++ b/client/homebrew/navbar/help.navitem.jsx @@ -1,7 +1,7 @@ -const React = require('react'); -const dedent = require('dedent-tabs').default; +import React from 'react'; +import dedent from 'dedent-tabs'; -const Nav = require('client/homebrew/navbar/nav.jsx'); +import Nav from 'client/homebrew/navbar/nav.jsx'; export default function(props){ return diff --git a/client/homebrew/navbar/metadata.navitem.jsx b/client/homebrew/navbar/metadata.navitem.jsx index d5277dfa7..09800391d 100644 --- a/client/homebrew/navbar/metadata.navitem.jsx +++ b/client/homebrew/navbar/metadata.navitem.jsx @@ -1,11 +1,11 @@ -const React = require('react'); -const createClass = require('create-react-class'); -const Moment = require('moment'); +import React from 'react'; +import createReactClass from 'create-react-class'; +import Moment from 'moment'; -const Nav = require('client/homebrew/navbar/nav.jsx'); +import Nav from 'client/homebrew/navbar/nav.jsx'; -const MetadataNav = createClass({ +const MetadataNav = createReactClass({ displayName : 'MetadataNav', getDefaultProps : function() { return { diff --git a/client/homebrew/navbar/nav.jsx b/client/homebrew/navbar/nav.jsx index 9dba70167..6b73b921d 100644 --- a/client/homebrew/navbar/nav.jsx +++ b/client/homebrew/navbar/nav.jsx @@ -1,14 +1,13 @@ -require('client/homebrew/navbar/navbar.less'); -const React = require('react'); -const { useState, useRef, useEffect } = React; -const createClass = require('create-react-class'); -const _ = require('lodash'); -const cx = require('classnames'); +import 'client/homebrew/navbar/navbar.less'; +import React, { useState, useRef, useEffect} from 'react'; +import createReactClass from 'create-react-class'; +import _ from 'lodash'; +import cx from 'classnames'; -const NaturalCritIcon = require('client/components/svg/naturalcrit-d20.svg.jsx'); +import NaturalCritIcon from 'client/components/svg/naturalcrit-d20.svg.jsx'; const Nav = { - base : createClass({ + base : createReactClass({ displayName : 'Nav.base', render : function(){ return
@@ -34,7 +33,7 @@ const Nav = { } }), - item : createClass({ + item : createReactClass({ displayName : 'Nav.item', getDefaultProps : function() { return { diff --git a/client/homebrew/navbar/navbar.jsx b/client/homebrew/navbar/navbar.jsx index 07e84d178..234580fb4 100644 --- a/client/homebrew/navbar/navbar.jsx +++ b/client/homebrew/navbar/navbar.jsx @@ -1,11 +1,11 @@ -require('./navbar.less'); -const React = require('react'); -const createClass = require('create-react-class'); +import './navbar.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; -const Nav = require('client/homebrew/navbar/nav.jsx'); -const PatreonNavItem = require('./patreon.navitem.jsx'); +import Nav from 'client/homebrew/navbar/nav.jsx'; +import PatreonNavItem from './patreon.navitem.jsx'; -const Navbar = createClass({ +const Navbar = createReactClass({ displayName : 'Navbar', getInitialState : function() { return { diff --git a/client/homebrew/navbar/newbrew.navitem.jsx b/client/homebrew/navbar/newbrew.navitem.jsx index 7fe5d67c4..3af2b6acf 100644 --- a/client/homebrew/navbar/newbrew.navitem.jsx +++ b/client/homebrew/navbar/newbrew.navitem.jsx @@ -1,7 +1,7 @@ -const React = require('react'); -const _ = require('lodash'); -const Nav = require('client/homebrew/navbar/nav.jsx'); -const { splitTextStyleAndMetadata } = require('../../../shared/helpers.js'); // Importing the function from helpers.js +import React from 'react'; +import _ from 'lodash'; +import Nav from 'client/homebrew/navbar/nav.jsx'; +import { splitTextStyleAndMetadata } from '../../../shared/helpers.js'; const BREWKEY = 'HB_newPage_content'; const STYLEKEY = 'HB_newPage_style'; diff --git a/client/homebrew/navbar/patreon.navitem.jsx b/client/homebrew/navbar/patreon.navitem.jsx index 6edf780e5..7eb7daee8 100644 --- a/client/homebrew/navbar/patreon.navitem.jsx +++ b/client/homebrew/navbar/patreon.navitem.jsx @@ -1,5 +1,5 @@ -const React = require('react'); -const Nav = require('client/homebrew/navbar/nav.jsx'); +import React from 'react'; +import Nav from 'client/homebrew/navbar/nav.jsx'; export default function(props){ return diff --git a/client/homebrew/navbar/recent.navitem.jsx b/client/homebrew/navbar/recent.navitem.jsx index c1337ea4e..5a40ce645 100644 --- a/client/homebrew/navbar/recent.navitem.jsx +++ b/client/homebrew/navbar/recent.navitem.jsx @@ -1,15 +1,15 @@ -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); -const Moment = require('moment'); +import React from 'react'; +import createReactClass from 'create-react-class'; +import _ from 'lodash'; +import Moment from 'moment'; -const Nav = require('client/homebrew/navbar/nav.jsx'); +import Nav from 'client/homebrew/navbar/nav.jsx'; const EDIT_KEY = 'HB_nav_recentlyEdited'; const VIEW_KEY = 'HB_nav_recentlyViewed'; -const RecentItems = createClass({ +const RecentItems = createReactClass({ DisplayName : 'RecentItems', getDefaultProps : function() { return { diff --git a/client/homebrew/navbar/vault.navitem.jsx b/client/homebrew/navbar/vault.navitem.jsx index dff401525..9e4305811 100644 --- a/client/homebrew/navbar/vault.navitem.jsx +++ b/client/homebrew/navbar/vault.navitem.jsx @@ -1,6 +1,6 @@ -const React = require('react'); +import React from 'react'; -const Nav = require('client/homebrew/navbar/nav.jsx'); +import Nav from 'client/homebrew/navbar/nav.jsx'; export default function (props) { return ( diff --git a/client/homebrew/pages/accountPage/accountPage.jsx b/client/homebrew/pages/accountPage/accountPage.jsx index 91f8daa05..015106628 100644 --- a/client/homebrew/pages/accountPage/accountPage.jsx +++ b/client/homebrew/pages/accountPage/accountPage.jsx @@ -1,7 +1,7 @@ -const React = require('react'); -const moment = require('moment'); -const UIPage = require('../basePages/uiPage/uiPage.jsx'); -const NaturalCritIcon = require('client/components/svg/naturalcrit-d20.svg.jsx'); +import React from 'react'; +import moment from 'moment'; +import UIPage from '../basePages/uiPage/uiPage.jsx'; +import NaturalCritIcon from 'client/components/svg/naturalcrit-d20.svg.jsx'; let SAVEKEY = ''; diff --git a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx index 4f952f01e..41d992b9d 100644 --- a/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx +++ b/client/homebrew/pages/basePages/listPage/brewItem/brewItem.jsx @@ -1,12 +1,11 @@ -require('./brewItem.less'); -const React = require('react'); -const { useCallback } = React; -const moment = require('moment'); +import './brewItem.less'; +import React, { useCallback } from 'react'; +import moment from 'moment'; import request from '../../../../utils/request-middleware.js'; -const googleDriveIcon = require('../../../../googleDrive.svg'); -const homebreweryIcon = require('../../../../thumbnail.svg'); -const dedent = require('dedent-tabs').default; +import googleDriveIcon from '../../../../googleDrive.svg'; +import homebreweryIcon from '../../../../thumbnail.svg'; +import dedent from 'dedent-tabs'; const BrewItem = ({ brew = { diff --git a/client/homebrew/pages/basePages/listPage/listPage.jsx b/client/homebrew/pages/basePages/listPage/listPage.jsx index 9589956d5..e5a662aa6 100644 --- a/client/homebrew/pages/basePages/listPage/listPage.jsx +++ b/client/homebrew/pages/basePages/listPage/listPage.jsx @@ -1,11 +1,11 @@ /*eslint max-lines: ["warn", {"max": 300, "skipBlankLines": true, "skipComments": true}]*/ -require('./listPage.less'); -const React = require('react'); -const createClass = require('create-react-class'); -const _ = require('lodash'); -const moment = require('moment'); +import './listPage.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; +import _ from 'lodash'; +import moment from 'moment;' -const BrewItem = require('./brewItem/brewItem.jsx'); +import BrewItem from './brewItem/brewItem.jsx'; const USERPAGE_SORT_DIR = 'HB_listPage_sortDir'; const USERPAGE_SORT_TYPE = 'HB_listPage_sortType'; @@ -14,7 +14,7 @@ const USERPAGE_GROUP_VISIBILITY_PREFIX = 'HB_listPage_visibility_group'; const DEFAULT_SORT_TYPE = 'alpha'; const DEFAULT_SORT_DIR = 'asc'; -const ListPage = createClass({ +const ListPage = createReactClass({ displayName : 'ListPage', getDefaultProps : function() { return { diff --git a/client/homebrew/pages/basePages/uiPage/uiPage.jsx b/client/homebrew/pages/basePages/uiPage/uiPage.jsx index 7a95748aa..c15f69d04 100644 --- a/client/homebrew/pages/basePages/uiPage/uiPage.jsx +++ b/client/homebrew/pages/basePages/uiPage/uiPage.jsx @@ -1,16 +1,16 @@ -require('./uiPage.less'); -const React = require('react'); -const createClass = require('create-react-class'); +import './uiPage.less'; +import React from 'react'; +import createReactClass from 'create-react-class'; -const Nav = require('client/homebrew/navbar/nav.jsx'); -const Navbar = require('client/homebrew/navbar/navbar.jsx'); -const NewBrewItem = require('client/homebrew/navbar/newbrew.navitem.jsx'); -const HelpNavItem = require('client/homebrew/navbar/help.navitem.jsx'); -const RecentNavItem = require('client/homebrew/navbar/recent.navitem.jsx').both; -const Account = require('client/homebrew/navbar/account.navitem.jsx'); +import Nav from 'client/homebrew/navbar/nav.jsx'; +import Navbar from 'client/homebrew/navbar/navbar.jsx'; +import NewBrewItem from 'client/homebrew/navbar/newbrew.navitem.jsx'; +import HelpNavItem from 'client/homebrew/navbar/help.navitem.jsx'; +import { both as RecentNavItem } from 'client/homebrew/navbar/recent.navitem.jsx'; +import Account from 'client/homebrew/navbar/account.navitem.jsx'; -const UIPage = createClass({ +const UIPage = createReactClass({ displayName : 'UIPage', render : function(){ diff --git a/client/homebrew/pages/errorPage/errorPage.jsx b/client/homebrew/pages/errorPage/errorPage.jsx index e90ceb742..ffbfc43bb 100644 --- a/client/homebrew/pages/errorPage/errorPage.jsx +++ b/client/homebrew/pages/errorPage/errorPage.jsx @@ -1,8 +1,8 @@ -require('./errorPage.less'); -const React = require('react'); -const UIPage = require('../basePages/uiPage/uiPage.jsx'); -import Markdown from '../../../../shared/markdown.js'; -const ErrorIndex = require('./errors/errorIndex.js'); +import './errorPage.less'; +import React from 'react'; +import UIPage from '../basePages/uiPage/uiPage.jsx'; +import Markdown from '../../../../shared/markdown.js'; +import ErrorIndex from './errors/errorIndex.js'; const ErrorPage = ({ brew })=>{ // Retrieving the error text based on the brew's error code from ErrorIndex diff --git a/client/homebrew/pages/errorPage/errors/errorIndex.js b/client/homebrew/pages/errorPage/errors/errorIndex.js index 9ca37a854..67b658325 100644 --- a/client/homebrew/pages/errorPage/errors/errorIndex.js +++ b/client/homebrew/pages/errorPage/errors/errorIndex.js @@ -1,4 +1,4 @@ -const dedent = require('dedent-tabs').default; +import dedent from 'dedent-tabs'; const loginUrl = 'https://www.naturalcrit.com/login'; diff --git a/client/homebrew/pages/sharePage/sharePage.jsx b/client/homebrew/pages/sharePage/sharePage.jsx index 48bed1655..ccd6533e5 100644 --- a/client/homebrew/pages/sharePage/sharePage.jsx +++ b/client/homebrew/pages/sharePage/sharePage.jsx @@ -1,18 +1,19 @@ -require('./sharePage.less'); -const React = require('react'); -const { useState, useEffect, useCallback } = React; -const { Meta } = require('vitreum/headtags'); +import './sharePage.less'; +import React, { useState, useEffect, useCallback } from 'react'; +import HeadTags from '../../../../vitreum/headtags.js'; +const { Meta } = HeadTags; -const Nav = require('client/homebrew/navbar/nav.jsx'); -const Navbar = require('client/homebrew/navbar/navbar.jsx'); -const MetadataNav = require('client/homebrew/navbar/metadata.navitem.jsx'); -const PrintNavItem = require('client/homebrew/navbar/print.navitem.jsx'); -const RecentNavItem = require('client/homebrew/navbar/recent.navitem.jsx').both; -const Account = require('client/homebrew/navbar/account.navitem.jsx'); -const BrewRenderer = require('../../brewRenderer/brewRenderer.jsx'); -const { DEFAULT_BREW_LOAD } = require('../../../../server/brewDefaults.js'); -const { printCurrentBrew, fetchThemeBundle } = require('../../../../shared/helpers.js'); +import Nav from 'client/homebrew/navbar/nav.jsx'; +import Navbar from 'client/homebrew/navbar/navbar.jsx'; +import MetadataNav from 'client/homebrew/navbar/metadata.navitem.jsx'; +import PrintNavItem from 'client/homebrew/navbar/print.navitem.jsx'; +import { both as RecentNavItem } from 'client/homebrew/navbar/recent.navitem.jsx'; +import Account from 'client/homebrew/navbar/account.navitem.jsx'; +import BrewRenderer from '../../brewRenderer/brewRenderer.jsx'; + +import { DEFAULT_BREW_LOAD } from '../../../../server/brewDefaults.js'; +import { printCurrentBrew, fetchThemeBundle } from '../../../../shared/helpers.js'; const SharePage = (props)=>{ const { brew = DEFAULT_BREW_LOAD, disableMeta = false } = props; diff --git a/client/homebrew/pages/userPage/userPage.jsx b/client/homebrew/pages/userPage/userPage.jsx index ac4257124..f6f0cfa38 100644 --- a/client/homebrew/pages/userPage/userPage.jsx +++ b/client/homebrew/pages/userPage/userPage.jsx @@ -1,17 +1,16 @@ -const React = require('react'); -const { useState } = React; -const _ = require('lodash'); +import React, { useState} from 'react'; +import _ from 'lodash'; -const ListPage = require('../basePages/listPage/listPage.jsx'); +import ListPage from '../basePages/listPage/listPage.jsx'; -const Nav = require('client/homebrew/navbar/nav.jsx'); -const Navbar = require('client/homebrew/navbar/navbar.jsx'); -const RecentNavItem = require('client/homebrew/navbar/recent.navitem.jsx').both; -const Account = require('client/homebrew/navbar/account.navitem.jsx'); -const NewBrew = require('client/homebrew/navbar/newbrew.navitem.jsx'); -const HelpNavItem = require('client/homebrew/navbar/help.navitem.jsx'); -const ErrorNavItem = require('client/homebrew/navbar/error-navitem.jsx'); -const VaultNavitem = require('client/homebrew/navbar/vault.navitem.jsx'); +import Nav from 'client/homebrew/navbar/nav.jsx'; +import Navbar from 'client/homebrew/navbar/navbar.jsx'; +import { both as RecentNavItem } from 'client/homebrew/navbar/recent.navitem.jsx'; +import Account from 'client/homebrew/navbar/account.navitem.jsx'; +import NewBrew from 'client/homebrew/navbar/newbrew.navitem.jsx'; +import HelpNavItem from 'client/homebrew/navbar/help.navitem.jsx'; +import ErrorNavItem from 'client/homebrew/navbar/error-navitem.jsx'; +import VaultNavitem from 'client/homebrew/navbar/vault.navitem.jsx'; const UserPage = (props)=>{ props = { diff --git a/client/homebrew/pages/vaultPage/vaultPage.jsx b/client/homebrew/pages/vaultPage/vaultPage.jsx index a9c316d8a..fd2dff064 100644 --- a/client/homebrew/pages/vaultPage/vaultPage.jsx +++ b/client/homebrew/pages/vaultPage/vaultPage.jsx @@ -1,19 +1,17 @@ /*eslint max-lines: ["warn", {"max": 400, "skipBlankLines": true, "skipComments": true}]*/ /*eslint max-params:["warn", { max: 10 }], */ -require('./vaultPage.less'); +import './vaultPage.less'; +import React, { useState, useEffect, useRef } from 'react'; -const React = require('react'); -const { useState, useEffect, useRef } = React; - -const Nav = require('client/homebrew/navbar/nav.jsx'); -const Navbar = require('client/homebrew/navbar/navbar.jsx'); -const RecentNavItem = require('client/homebrew/navbar/recent.navitem.jsx').both; -const Account = require('client/homebrew/navbar/account.navitem.jsx'); -const NewBrew = require('client/homebrew/navbar/newbrew.navitem.jsx'); -const HelpNavItem = require('client/homebrew/navbar/help.navitem.jsx'); -const BrewItem = require('../basePages/listPage/brewItem/brewItem.jsx'); -const SplitPane = require('client/components/splitPane/splitPane.jsx'); -const ErrorIndex = require('../errorPage/errors/errorIndex.js'); +import Nav from 'client/homebrew/navbar/nav.jsx'; +import Navbar from 'client/homebrew/navbar/navbar.jsx'; +import { both as RecentNavItem } from 'client/homebrew/navbar/recent.navitem.jsx'; +import Account from 'client/homebrew/navbar/account.navitem.jsx'; +import NewBrew from 'client/homebrew/navbar/newbrew.navitem.jsx'; +import HelpNavItem from 'client/homebrew/navbar/help.navitem.jsx'; +import BrewItem from '../basePages/listPage/brewItem/brewItem.jsx'; +import SplitPane from 'client/components/splitPane/splitPane.jsx'; +import ErrorIndex from '../errorPage/errors/errorIndex.js'; import request from '../../utils/request-middleware.js'; diff --git a/eslint.config.mjs b/eslint.config.mjs index 25d0395c7..549ba2536 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -32,7 +32,7 @@ export default [{ "max-depth" : ["warn", { max: 4 }], "max-params" : ["warn", { max: 5 }], "no-restricted-syntax" : ["warn", "ClassDeclaration", "SwitchStatement"], - "no-unused-vars" : ["warn", { vars: "all", args: "none", varsIgnorePattern: "config|_|cx|createClass" }], + "no-unused-vars" : ["warn", { vars: "all", args: "none", varsIgnorePattern: "config|_|cx|createReactClass" }], "react/jsx-uses-vars" : "warn", /** Fixable **/ diff --git a/shared/markdownLegacy.js b/shared/markdownLegacy.js index 0dfd46320..9cea8dbb2 100644 --- a/shared/markdownLegacy.js +++ b/shared/markdownLegacy.js @@ -1,5 +1,5 @@ -const _ = require('lodash'); -const Markdown = require('markedLegacy'); +import _ from 'lodash'; +import Markdown from 'markedLegacy'; const renderer = new Markdown.Renderer(); //Processes the markdown within an HTML block if it's just a class-wrapper diff --git a/tests/html/safeHTML.test.js b/tests/html/safeHTML.test.js index cb5466a48..d1bb2b539 100644 --- a/tests/html/safeHTML.test.js +++ b/tests/html/safeHTML.test.js @@ -1,6 +1,5 @@ - - -require('jsdom-global')(); +import jsdomGlobal from 'jsdom-global'; +jsdomGlobal(); import { safeHTML } from '../../client/homebrew/brewRenderer/safeHTML'; diff --git a/tests/markdown/emojis.test.js b/tests/markdown/emojis.test.js index e21eec414..e5b6ecd47 100644 --- a/tests/markdown/emojis.test.js +++ b/tests/markdown/emojis.test.js @@ -1,5 +1,5 @@ import Markdown from 'markdown.js'; -const dedent = require('dedent-tabs').default; +import dedent from 'dedent-tabs'; // Marked.js adds line returns after closing tags on some default tokens. // This removes those line returns for comparison sake. diff --git a/tests/markdown/mustache-syntax.test.js b/tests/markdown/mustache-syntax.test.js index 5743f7903..bdf368414 100644 --- a/tests/markdown/mustache-syntax.test.js +++ b/tests/markdown/mustache-syntax.test.js @@ -1,6 +1,6 @@ /* eslint-disable max-lines */ -const dedent = require('dedent-tabs').default; +import dedent from 'dedent-tabs'; import Markdown from 'markdown.js'; // Marked.js adds line returns after closing tags on some default tokens. diff --git a/tests/markdown/variables.test.js b/tests/markdown/variables.test.js index 64232078f..aa2117f31 100644 --- a/tests/markdown/variables.test.js +++ b/tests/markdown/variables.test.js @@ -1,6 +1,6 @@ /* eslint-disable max-lines */ -const dedent = require('dedent-tabs').default; +import dedent from 'dedent-tabs'; import Markdown from 'markdown.js'; // Marked.js adds line returns after closing tags on some default tokens. diff --git a/themes/Legacy/5ePHB/snippets.js b/themes/Legacy/5ePHB/snippets.js index e1665b47c..3bcdac50e 100644 --- a/themes/Legacy/5ePHB/snippets.js +++ b/themes/Legacy/5ePHB/snippets.js @@ -1,12 +1,12 @@ /* eslint-disable max-lines */ -const MagicGen = require('./snippets/magic.gen.js'); -const ClassTableGen = require('./snippets/classtable.gen.js'); -const MonsterBlockGen = require('./snippets/monsterblock.gen.js'); -const ClassFeatureGen = require('./snippets/classfeature.gen.js'); -const CoverPageGen = require('./snippets/coverpage.gen.js'); -const TableOfContentsGen = require('./snippets/tableOfContents.gen.js'); -const dedent = require('dedent-tabs').default; +import MagicGen from './snippets/magic.gen.js'; +import ClassTableGen from './snippets/classtable.gen.js'; +import MonsterBlockGen from './snippets/monsterblock.gen.js'; +import ClassFeatureGen from './snippets/classfeature.gen.js'; +import CoverPageGen from './snippets/coverpage.gen.js'; +import TableOfContentsGen from './snippets/tableOfContents.gen.js'; +import dedent from 'dedent-tabs'; export default [ diff --git a/themes/Legacy/5ePHB/snippets/classfeature.gen.js b/themes/Legacy/5ePHB/snippets/classfeature.gen.js index 53e989dcc..b92d527f9 100644 --- a/themes/Legacy/5ePHB/snippets/classfeature.gen.js +++ b/themes/Legacy/5ePHB/snippets/classfeature.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; export default function(classname){ diff --git a/themes/Legacy/5ePHB/snippets/classtable.gen.js b/themes/Legacy/5ePHB/snippets/classtable.gen.js index 69ded1b19..3444de38f 100644 --- a/themes/Legacy/5ePHB/snippets/classtable.gen.js +++ b/themes/Legacy/5ePHB/snippets/classtable.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; const features = [ 'Astrological Botany', diff --git a/themes/Legacy/5ePHB/snippets/coverpage.gen.js b/themes/Legacy/5ePHB/snippets/coverpage.gen.js index 8d66c4391..0cd0e50d5 100644 --- a/themes/Legacy/5ePHB/snippets/coverpage.gen.js +++ b/themes/Legacy/5ePHB/snippets/coverpage.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; const titles = [ 'The Burning Gallows', diff --git a/themes/Legacy/5ePHB/snippets/fullclass.gen.js b/themes/Legacy/5ePHB/snippets/fullclass.gen.js index 68fc81ac3..50d1ef578 100644 --- a/themes/Legacy/5ePHB/snippets/fullclass.gen.js +++ b/themes/Legacy/5ePHB/snippets/fullclass.gen.js @@ -1,8 +1,8 @@ -const _ = require('lodash'); +import _ from 'lodash'; -const ClassFeatureGen = require('./classfeature.gen.js'); +import ClassFeatureGen from './classfeature.gen.js'; -const ClassTableGen = require('./classtable.gen.js'); +import ClassTableGen from './classtable.gen.js'; export default function(){ diff --git a/themes/Legacy/5ePHB/snippets/magic.gen.js b/themes/Legacy/5ePHB/snippets/magic.gen.js index 832ad2a84..cea4ac1a8 100644 --- a/themes/Legacy/5ePHB/snippets/magic.gen.js +++ b/themes/Legacy/5ePHB/snippets/magic.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; const spellNames = [ 'Astral Rite of Acne', diff --git a/themes/Legacy/5ePHB/snippets/monsterblock.gen.js b/themes/Legacy/5ePHB/snippets/monsterblock.gen.js index 3279fa995..9c241a7ae 100644 --- a/themes/Legacy/5ePHB/snippets/monsterblock.gen.js +++ b/themes/Legacy/5ePHB/snippets/monsterblock.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; const genList = function(list, max){ return _.sampleSize(list, _.random(0, max)).join(', ') || 'None'; diff --git a/themes/Legacy/5ePHB/snippets/tableOfContents.gen.js b/themes/Legacy/5ePHB/snippets/tableOfContents.gen.js index 3873eb400..b37cca9ee 100644 --- a/themes/Legacy/5ePHB/snippets/tableOfContents.gen.js +++ b/themes/Legacy/5ePHB/snippets/tableOfContents.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; const getTOC = (pages)=>{ const add1 = (title, page)=>{ diff --git a/themes/V3/5ePHB/snippets.js b/themes/V3/5ePHB/snippets.js index afa789af5..9ab81b2c0 100644 --- a/themes/V3/5ePHB/snippets.js +++ b/themes/V3/5ePHB/snippets.js @@ -1,15 +1,12 @@ /* eslint-disable max-lines */ - -const MagicGen = require('./snippets/magic.gen.js'); -const ClassTableGen = require('./snippets/classtable.gen.js'); -const MonsterBlockGen = require('./snippets/monsterblock.gen.js'); -const scriptGen = require('./snippets/script.gen.js'); -const ClassFeatureGen = require('./snippets/classfeature.gen.js'); -const CoverPageGen = require('./snippets/coverpage.gen.js'); -const QuoteGen = require('./snippets/quote.gen.js'); -const dedent = require('dedent-tabs').default; - - +import MagicGen from './snippets/magic.gen.js'; +import ClassTableGen from './snippets/classtable.gen.js'; +import MonsterBlockGen from './snippets/monsterblock.gen.js'; +import scriptGen from './snippets/script.gen.js'; +import ClassFeatureGen from './snippets/classfeature.gen.js'; +import CoverPageGen from './snippets/coverpage.gen.js'; +import QuoteGen from './snippets/quote.gen.js'; +import dedent from 'dedent-tabs'; export default [ { diff --git a/themes/V3/5ePHB/snippets/classfeature.gen.js b/themes/V3/5ePHB/snippets/classfeature.gen.js index 794545920..9ea46785a 100644 --- a/themes/V3/5ePHB/snippets/classfeature.gen.js +++ b/themes/V3/5ePHB/snippets/classfeature.gen.js @@ -1,5 +1,5 @@ -const _ = require('lodash'); -const dedent = require('dedent-tabs').default; +import _ from 'lodash'; +import dedent from 'dedent-tabs'; export default function(classname){ diff --git a/themes/V3/5ePHB/snippets/classtable.gen.js b/themes/V3/5ePHB/snippets/classtable.gen.js index 469ed5193..0f2d2371a 100644 --- a/themes/V3/5ePHB/snippets/classtable.gen.js +++ b/themes/V3/5ePHB/snippets/classtable.gen.js @@ -1,5 +1,5 @@ -const _ = require('lodash'); -const dedent = require('dedent-tabs').default; +import _ from 'lodash'; +import dedent from 'dedent-tabs'; const features = [ 'Astrological Botany', 'Biochemical Sorcery', 'Civil Divination', diff --git a/themes/V3/5ePHB/snippets/coverpage.gen.js b/themes/V3/5ePHB/snippets/coverpage.gen.js index 20ef3c3f8..7cf9cf5cf 100644 --- a/themes/V3/5ePHB/snippets/coverpage.gen.js +++ b/themes/V3/5ePHB/snippets/coverpage.gen.js @@ -1,5 +1,5 @@ -const _ = require('lodash'); -const dedent = require('dedent-tabs').default; +import _ from 'lodash'; +import dedent from 'dedent-tabs'; const titles = [ 'The Burning Gallows', 'The Ring of Nenlast', diff --git a/themes/V3/5ePHB/snippets/fullclass.gen.js b/themes/V3/5ePHB/snippets/fullclass.gen.js index 68fc81ac3..16cf5854a 100644 --- a/themes/V3/5ePHB/snippets/fullclass.gen.js +++ b/themes/V3/5ePHB/snippets/fullclass.gen.js @@ -1,8 +1,7 @@ -const _ = require('lodash'); +import _ from 'lodash'; -const ClassFeatureGen = require('./classfeature.gen.js'); - -const ClassTableGen = require('./classtable.gen.js'); +import ClassFeatureGen from './classfeature.gen.js'; +import ClassTableGen from './classtable.gen.js'; export default function(){ diff --git a/themes/V3/5ePHB/snippets/magic.gen.js b/themes/V3/5ePHB/snippets/magic.gen.js index 745d86695..11a8011e7 100644 --- a/themes/V3/5ePHB/snippets/magic.gen.js +++ b/themes/V3/5ePHB/snippets/magic.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; const spellNames = [ 'Astral Rite of Acne', diff --git a/themes/V3/5ePHB/snippets/monsterblock.gen.js b/themes/V3/5ePHB/snippets/monsterblock.gen.js index 1f3b37736..483c9016d 100644 --- a/themes/V3/5ePHB/snippets/monsterblock.gen.js +++ b/themes/V3/5ePHB/snippets/monsterblock.gen.js @@ -1,5 +1,5 @@ -const _ = require('lodash'); -const dedent = require('dedent-tabs').default; +import _ from 'lodash'; +import dedent from 'dedent-tabs'; const genList = function(list, max){ return _.sampleSize(list, _.random(0, max)).join(', ') || 'None'; diff --git a/themes/V3/5ePHB/snippets/quote.gen.js b/themes/V3/5ePHB/snippets/quote.gen.js index f7c9c7414..4f52ea4c5 100644 --- a/themes/V3/5ePHB/snippets/quote.gen.js +++ b/themes/V3/5ePHB/snippets/quote.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; const quotes = [ 'The sword glinted in the dim light, its edges keen and deadly. As the adventurer reached for it, he couldn\'t help but feel a surge of excitement mixed with fear. This was no ordinary blade.', diff --git a/themes/V3/5ePHB/snippets/script.gen.js b/themes/V3/5ePHB/snippets/script.gen.js index 44573958f..ace330255 100644 --- a/themes/V3/5ePHB/snippets/script.gen.js +++ b/themes/V3/5ePHB/snippets/script.gen.js @@ -1,5 +1,5 @@ -const _ = require('lodash'); -const dedent = require('dedent-tabs').default; +import _ from 'lodash'; +import dedent from 'dedent-tabs'; export default { dwarvish : ()=>{ diff --git a/themes/V3/5ePHB/snippets/watercolor.gen.js b/themes/V3/5ePHB/snippets/watercolor.gen.js index 3d8c81f8b..25ce84aa9 100644 --- a/themes/V3/5ePHB/snippets/watercolor.gen.js +++ b/themes/V3/5ePHB/snippets/watercolor.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; export default ()=>{ return `{{watercolor${_.random(1, 12)},top:20px,left:30px,width:300px,background-color:#BBAD82,opacity:80%}}\n\n`; diff --git a/themes/V3/Blank/snippets.js b/themes/V3/Blank/snippets.js index 3b443740e..3f7dd1c19 100644 --- a/themes/V3/Blank/snippets.js +++ b/themes/V3/Blank/snippets.js @@ -1,17 +1,16 @@ /* eslint-disable max-lines */ - -const WatercolorGen = require('./snippets/watercolor.gen.js'); -const ImageMaskGen = require('./snippets/imageMask.gen.js'); -const FooterGen = require('./snippets/footer.gen.js'); -const LicenseGenWotC = require('./snippets/licenseWotC.gen.js'); -const LicenseGenGNU = require('./snippets/licenseGNU.gen.js'); -const LicenseGen = require('./snippets/license.gen.js'); -const LicenseGenAelf = require('./snippets/licenseAELF.js'); -const LicenseDTTRPGGCC = require('./snippets/licenseDTRPGCC.gen.js'); -const LicenseMongoosePublishing = require('./snippets/licenseMongoose.gen.js'); -const dedent = require('dedent-tabs').default; -const TableOfContentsGen = require('./snippets/tableOfContents.gen.js'); -const indexGen = require('./snippets/index.gen.js'); +import dedent from 'dedent-tabs'; +import WatercolorGen from './snippets/watercolor.gen.js'; +import ImageMaskGen from './snippets/imageMask.gen.js'; +import FooterGen from './snippets/footer.gen.js'; +import LicenseGenWotC from './snippets/licenseWotC.gen.js'; +import LicenseGenGNU from './snippets/licenseGNU.gen.js'; +import LicenseGen from './snippets/license.gen.js'; +import LicenseGenAelf from './snippets/licenseAELF.js'; +import LicenseDTTRPGGCC from './snippets/licenseDTRPGCC.gen.js'; +import LicenseMongoosePublishing from './snippets/licenseMongoose.gen.js'; +import TableOfContentsGen from './snippets/tableOfContents.gen.js'; +import indexGen from './snippets/index.gen.js'; export default [ diff --git a/themes/V3/Blank/snippets/imageMask.gen.js b/themes/V3/Blank/snippets/imageMask.gen.js index 9127b826b..761259c19 100644 --- a/themes/V3/Blank/snippets/imageMask.gen.js +++ b/themes/V3/Blank/snippets/imageMask.gen.js @@ -1,5 +1,5 @@ -const _ = require('lodash'); -const dedent = require('dedent-tabs').default; +import _ from 'lodash'; +import dedent from 'dedent-tabs'; export default { center : ()=>{ diff --git a/themes/V3/Blank/snippets/index.gen.js b/themes/V3/Blank/snippets/index.gen.js index 5a10f67f4..1321762e9 100644 --- a/themes/V3/Blank/snippets/index.gen.js +++ b/themes/V3/Blank/snippets/index.gen.js @@ -1,4 +1,4 @@ -const dedent = require('dedent-tabs').default; +import dedent from 'dedent-tabs'; export default ()=>{ return dedent` diff --git a/themes/V3/Blank/snippets/license.gen.js b/themes/V3/Blank/snippets/license.gen.js index b8f0778c5..2bb3b9daa 100644 --- a/themes/V3/Blank/snippets/license.gen.js +++ b/themes/V3/Blank/snippets/license.gen.js @@ -1,5 +1,5 @@ /* eslint-disable max-lines */ -const dedent = require('dedent'); +import dedent from 'dedent'; // Small and one-off licenses // Licenses in this file consist of one or two functions at most. If something is larger, diff --git a/themes/V3/Blank/snippets/licenseAELF.js b/themes/V3/Blank/snippets/licenseAELF.js index 12e45a3f9..0df1d8028 100644 --- a/themes/V3/Blank/snippets/licenseAELF.js +++ b/themes/V3/Blank/snippets/licenseAELF.js @@ -1,5 +1,5 @@ /* eslint-disable max-lines */ -const dedent = require('dedent'); +import dedent from 'dedent'; // AELF License diff --git a/themes/V3/Blank/snippets/licenseDTRPGCC.gen.js b/themes/V3/Blank/snippets/licenseDTRPGCC.gen.js index 98377651a..8febabfbb 100644 --- a/themes/V3/Blank/snippets/licenseDTRPGCC.gen.js +++ b/themes/V3/Blank/snippets/licenseDTRPGCC.gen.js @@ -1,5 +1,5 @@ /* eslint-disable max-lines */ -const dedent = require('dedent'); +import dedent from 'dedent'; // DriveThruRPG/OneBookShelf Community Content Programs diff --git a/themes/V3/Blank/snippets/licenseGNU.gen.js b/themes/V3/Blank/snippets/licenseGNU.gen.js index 4952ee7de..e09a0d2df 100644 --- a/themes/V3/Blank/snippets/licenseGNU.gen.js +++ b/themes/V3/Blank/snippets/licenseGNU.gen.js @@ -1,5 +1,5 @@ /* eslint-disable max-lines */ -const dedent = require('dedent'); +import dedent from 'dedent'; // GNU Licenses diff --git a/themes/V3/Blank/snippets/licenseMongoose.gen.js b/themes/V3/Blank/snippets/licenseMongoose.gen.js index bc8e58148..c89ae6429 100644 --- a/themes/V3/Blank/snippets/licenseMongoose.gen.js +++ b/themes/V3/Blank/snippets/licenseMongoose.gen.js @@ -1,5 +1,5 @@ /* eslint-disable max-lines */ -const dedent = require('dedent'); +import dedent from 'dedent'; // Mongoose Publishing Licenses diff --git a/themes/V3/Blank/snippets/licenseWotC.gen.js b/themes/V3/Blank/snippets/licenseWotC.gen.js index a33bb4c46..543255540 100644 --- a/themes/V3/Blank/snippets/licenseWotC.gen.js +++ b/themes/V3/Blank/snippets/licenseWotC.gen.js @@ -1,5 +1,5 @@ /* eslint-disable max-lines */ -const dedent = require('dedent'); +import dedent from 'dedent'; export default { ogl1a : function () { diff --git a/themes/V3/Blank/snippets/tableOfContents.gen.js b/themes/V3/Blank/snippets/tableOfContents.gen.js index 45dca126c..d093d574a 100644 --- a/themes/V3/Blank/snippets/tableOfContents.gen.js +++ b/themes/V3/Blank/snippets/tableOfContents.gen.js @@ -1,4 +1,4 @@ -const dedent = require('dedent-tabs').default; +import dedent from 'dedent-tabs'; // Map each actual page to its footer label, accounting for skips or numbering resets const mapPages = (pages)=>{ diff --git a/themes/V3/Blank/snippets/watercolor.gen.js b/themes/V3/Blank/snippets/watercolor.gen.js index 3d8c81f8b..25ce84aa9 100644 --- a/themes/V3/Blank/snippets/watercolor.gen.js +++ b/themes/V3/Blank/snippets/watercolor.gen.js @@ -1,4 +1,4 @@ -const _ = require('lodash'); +import _ from 'lodash'; export default ()=>{ return `{{watercolor${_.random(1, 12)},top:20px,left:30px,width:300px,background-color:#BBAD82,opacity:80%}}\n\n`; diff --git a/vitreum/headtags.js b/vitreum/headtags.js new file mode 100644 index 000000000..8e0d06523 --- /dev/null +++ b/vitreum/headtags.js @@ -0,0 +1,79 @@ +import React from 'react'; + +const obj2props = (obj)=>Object.entries(obj).map(([k,v])=>`${k}="${v}"`).join(' '); +const toStr = (chld)=>Array.isArray(chld) ? chld.join('') : chld; +const onServer = (typeof window === 'undefined'); + +const injectTag = (tag, props, children)=>{ + const injectNode = document.createElement(tag); + Object.entries(props).map(([key, val])=>injectNode[key]=val); + if(children) injectNode.appendChild(document.createTextNode(children)); + document.getElementsByTagName('head')[0].appendChild(injectNode); +}; + + +let NamedTags = {}; +let UnnamedTags = []; + + +const HeadComponents = { + Title({ children }){ + if(onServer) NamedTags.title = `${toStr(children)}`; + React.useEffect(()=>{document.title = toStr(children)}, [children]); + return null; + }, + Favicon({ type = 'image/png', href = '', rel='icon', id= 'favicon'}){ + if(onServer) NamedTags.favicon = `` + React.useEffect(()=>{document.getElementById(id).href=href}, [id, href]); + return null; + }, + + Description({ children }){ + if(onServer) NamedTags.description = `` + return null; + }, + + Noscript({ children }){ + if(onServer) UnnamedTags.push(`