feat: Range for alpha

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

@@ -0,0 +1,69 @@
+import './emitted.scss';
+
+import {join} from 'path';
+
+import {PropTypes, React} from '@latus/react';
+import {Range, rangePropType} from '@persea/core';
+import {useJsonPatcher} from '@persea/json';
+
+const Emitted = ({json, path}) => {
+  const patch = useJsonPatcher();
+  return (
+    <div className="emitted">
+      <label>
+        Alpha
+        <label>
+          Start
+          <Range
+            onChange={(range) => {
+              patch(join(path, 'params/alpha'), json.params.alpha, 'start', range);
+            }}
+            range={json.params.alpha.start}
+          />
+        </label>
+        <label>
+          End
+          <Range
+            onChange={(range) => {
+              patch(join(path, 'params/alpha'), json.params.alpha, 'end', range);
+            }}
+            range={json.params.alpha.end}
+          />
+        </label>
+      </label>
+    </div>
+  );
+};
+
+Emitted.propTypes = {
+  json: PropTypes.shape({
+    params: PropTypes.shape({
+      alpha: PropTypes.shape({
+        start: rangePropType,
+        end: rangePropType,
+      }),
+      force: PropTypes.arrayOf(PropTypes.number),
+      listed: PropTypes.bool,
+      mass: PropTypes.number,
+      // eslint-disable-next-line react/forbid-prop-types
+      position: PropTypes.any,
+      rotation: PropTypes.shape({
+        start: PropTypes.number,
+        add: PropTypes.number,
+      }),
+      scale: PropTypes.shape({
+        start: PropTypes.number,
+        end: PropTypes.number,
+      }),
+      transient: PropTypes.bool,
+      ttl: PropTypes.number,
+      velocity: PropTypes.shape({
+        angle: PropTypes.number,
+        magnitude: PropTypes.number,
+      }),
+    }),
+  }).isRequired,
+  path: PropTypes.string.isRequired,
+};
+
+export default Emitted;