feat: auto styles

config/.neutrinorc.js

@@ -45,6 +45,11 @@ module.exports = {
         const testEntry = neutrino.config.entry('test').clear();
         testPaths.forEach((path) => testEntry.add(path));
       }
+      const cssPaths = glob.sync('./src/**/*.{css,scss}');
+      if (cssPaths.length > 0) {
+        const cssEntry = neutrino.config.entry('index.css').clear();
+        cssPaths.forEach((path) => cssEntry.add(path));
+      }
       neutrino.options.output = '.';
       react({
         clean: false,

packages/core/src/client/index.js

@@ -1,26 +0,0 @@
-import flatten from 'lodash.flatten';
-
-import BinaryResourceRenderer from './renderers/binary';
-import ImageResourceRenderer from './renderers/image';
-import TextResourceRenderer from './renderers/text';
-
-export {default as Number} from './components/number';
-export {default as Range, rangePropType} from './components/range';
-export {default as Vector, vectorPropType} from './components/vector';
-export {default as VectorRange, vectorRangePropType} from './components/vector-range';
-export {default as Stage} from './stage';
-
-export default {
-  hooks: {
-    '@latus/core/starting': async (latus) => {
-      const Renderers = flatten(await latus.invokeOrdered('@persea/core/resource-renderers'));
-      Renderers.push(
-        ImageResourceRenderer,
-        TextResourceRenderer,
-        BinaryResourceRenderer,
-      );
-      const Renderer = (uri) => Renderers.find(({matcher}) => uri.match(matcher)).Component;
-      latus.set('%resource-renderers', Renderer);
-    },
-  },
-};

packages/core/src/components/number/index.jsx

@@ -1,5 +1,3 @@
-import './index.scss';
-
 import {
   PropTypes,
   React,

packages/core/src/components/range/index.jsx

@@ -1,5 +1,3 @@
-import './index.scss';
-
 import {
   PropTypes,
   React,

packages/core/src/components/stage/index.jsx

@@ -1,5 +1,3 @@
-import './index.scss';
-
 import {Renderer} from '@avocado/graphics';
 import {
   PropTypes,

packages/core/src/components/vector-range/index.jsx

@@ -1,5 +1,3 @@
-import './index.scss';
-
 import {
   PropTypes,
   React,

packages/core/src/components/vector/index.jsx

@@ -1,6 +1,8 @@
-import './index.scss';
+import {
+  PropTypes,
+  React,
+} from '@latus/react';
 
-import {PropTypes, React} from '@latus/react';
 import Number from '../number';
 
 const Vector = ({

packages/core/src/index.js

@@ -1,5 +1,15 @@
+import flatten from 'lodash.flatten';
+
+import BinaryResourceRenderer from './resource-renderers/binary';
+import ImageResourceRenderer from './resource-renderers/image';
+import TextResourceRenderer from './resource-renderers/text';
 import {projects, user} from './state';
 
+export {default as Number} from './components/number';
+export {default as Range, rangePropType} from './components/range';
+export {default as Vector, vectorPropType} from './components/vector';
+export {default as VectorRange, vectorRangePropType} from './components/vector-range';
+export {default as Stage} from './components/stage';
 export {default as ProjectContext} from './context/project';
 export {default as UriContext} from './context/uri';
 export {default as useProject} from './hooks/use-project';
@@ -11,6 +21,16 @@ export default {
     '@latus/core/config': () => ({
       'resource-renderers': [],
     }),
+    '@latus/core/starting': async (latus) => {
+      const Renderers = flatten(await latus.invokeOrdered('@persea/core/resource-renderers'));
+      Renderers.push(
+        ImageResourceRenderer,
+        TextResourceRenderer,
+        BinaryResourceRenderer,
+      );
+      const Renderer = (uri) => Renderers.find(({matcher}) => uri.match(matcher)).Component;
+      latus.set('%resource-renderers', Renderer);
+    },
     '@latus/redux/slices': () => ({
       projects,
       user,

packages/core/src/resource-renderers/binary/index.jsx

@@ -1,6 +1,7 @@
-import './index.scss';
-
-import {PropTypes, React} from '@latus/react';
+import {
+  PropTypes,
+  React,
+} from '@latus/react';
 import HexEditor from 'react-hex-editor';
 import oneDarkPro from 'react-hex-editor/themes/oneDarkPro';
 
@@ -32,8 +33,16 @@ export default class BinaryResourceRenderer {
     );
   }
 
+  static encode(buffer) {
+    return buffer.toString('base64');
+  }
+
   static get matcher() {
     return /.*/;
   }
 
+  static decode(encoded) {
+    return Buffer.from(encoded, 'base64');
+  }
+
 }

packages/core/src/resource-renderers/image/index.jsx

@@ -1,6 +1,7 @@
-import './index.scss';
-
-import {PropTypes, React} from '@latus/react';
+import {
+  PropTypes,
+  React,
+} from '@latus/react';
 
 const ImageRendererComponent = ({buffer}) => (
   <div className="image-renderer">

packages/core/src/resource-renderers/text/index.jsx

@@ -1,6 +1,7 @@
-import './index.scss';
-
-import {PropTypes, React} from '@latus/react';
+import {
+  PropTypes,
+  React,
+} from '@latus/react';
 
 const TextRendererComponent = ({buffer}) => (
   <div className="text-renderer">{buffer.toString()}</div>

packages/entity/.neutrinorc.js

@@ -1 +1,5 @@
 module.exports = require('../../config/.neutrinorc');
+
+module.exports.use.push((neutrino) => {
+  neutrino.config.entry('index.css').prepend('react-tabs/style/react-tabs.scss');
+});

packages/entity/src/client/index.js

@@ -1,26 +0,0 @@
-import 'react-tabs/style/react-tabs.css';
-
-import {basename, extname} from 'path';
-
-import {camelCase} from '@latus/core';
-
-import EntityRenderer from '../entity-renderer';
-
-export default {
-  hooks: {
-    '@latus/core/starting': async (latus) => {
-      const TraitRenderers = latus.invokeReduce('@persea/entity/trait-renderers');
-      latus.set('%trait-renderers', TraitRenderers);
-    },
-    '@persea/core/resource-renderers': () => [
-      EntityRenderer,
-    ],
-    '@persea/entity/trait-renderers': () => {
-      const context = require.context('../trait-renderers', false, /\.jsx$/);
-      return context.keys().reduce((r, key) => ({
-        ...r,
-        [camelCase(basename(key, extname(key)))]: context(key).default,
-      }), {});
-    },
-  },
-};

packages/entity/src/index.js

@@ -0,0 +1,24 @@
+import {basename, extname} from 'path';
+
+import {camelCase} from '@latus/core';
+
+import EntityRenderer from './resource-renderers/entity';
+
+export default {
+  hooks: {
+    '@latus/core/starting': async (latus) => {
+      const TraitRenderers = latus.invokeReduce('@persea/entity/trait-renderers');
+      latus.set('%trait-renderers', TraitRenderers);
+    },
+    '@persea/core/resource-renderers': () => [
+      EntityRenderer,
+    ],
+    '@persea/entity/trait-renderers': () => {
+      const context = require.context('./trait-renderers', false, /\.jsx$/);
+      return context.keys().reduce((r, key) => ({
+        ...r,
+        [camelCase(basename(key, extname(key)))]: context(key).default,
+      }), {});
+    },
+  },
+};

packages/entity/src/resource-renderers/entity/index.jsx

@@ -1,8 +1,9 @@
-import './index.scss';
-
 import {join} from 'path';
 
-import {PropTypes, React} from '@latus/react';
+import {
+  PropTypes,
+  React,
+} from '@latus/react';
 import {
   Tab,
   Tabs,

packages/entity/src/resource-renderers/entity/stage/index.jsx

@@ -1,5 +1,3 @@
-import './index.scss';
-
 import {Rectangle, Vector} from '@avocado/math';
 import {
   PropTypes,
@@ -7,7 +5,7 @@ import {
   useEffect,
   useState,
 } from '@latus/react';
-import {Stage} from '@persea/core/client';
+import {Stage} from '@persea/core';
 
 const EntityStage = ({entity}) => {
   const [size, setSize] = useState([0, 0]);

packages/entity/src/resource-renderers/entity/traits/index.jsx

@@ -1,5 +1,3 @@
-import './index.scss';
-
 import {join} from 'path';
 
 import {Trait as BaseTrait} from '@avocado/traits';

packages/entity/src/resource-renderers/entity/view/index.jsx

@@ -1,8 +1,9 @@
-import './index.scss';
+import {
+  PropTypes,
+  React,
+} from '@latus/react';
 
-import {PropTypes, React} from '@latus/react';
-
-import useEntity from '../../hooks/use-entity';
+import useEntity from '../../../hooks/use-entity';
 import EntityStage from '../stage';
 
 const View = ({json}) => {

packages/entity/src/trait-renderers/emitted.jsx

@@ -1,5 +1,3 @@
-import './emitted.scss';
-
 import {join} from 'path';
 
 import {
@@ -13,7 +11,7 @@ import {
   rangePropType,
   VectorRange,
   vectorRangePropType,
-} from '@persea/core/client';
+} from '@persea/core';
 import {useJsonPatcher} from '@persea/json';
 
 const Emitted = ({json, path}) => {

packages/entity/src/trait-renderers/emitter.jsx

@@ -1,5 +1,3 @@
-import './emitter.scss';
-
 import {join} from 'path';
 
 import {PropTypes, React} from '@latus/react';

packages/entity/src/trait-renderers/emitter/particle.jsx

@@ -1,15 +1,13 @@
-import './particle.scss';
-
 import {EntityListView} from '@avocado/entity';
 import {
   PropTypes,
   React,
   useLatus,
 } from '@latus/react';
-import {Number, Stage} from '@persea/core/client';
+import {Number, Stage} from '@persea/core';
 import {useJsonPatcher} from '@persea/json';
 
-import Entity from '../../entity-renderer';
+import Entity from '../../resource-renderers/entity';
 import useEntity from '../../hooks/use-entity';
 
 const emitterJson = {

packages/entity/src/trait-renderers/existent.jsx

@@ -1,5 +1,3 @@
-import './existent.scss';
-
 import {join} from 'path';
 
 import {PropTypes, React} from '@latus/react';