feat: script

latus.yml

@@ -13,6 +13,7 @@
 '@avocado/react': {}
 '@avocado/resource': {
   'persea.controllers': [
+    '@avocado/behavior/persea',
     '@avocado/graphics/persea',
     '@avocado/entity/persea',
     '@avocado/sound/persea',

packages/core/src/components/persea/index.scss

@@ -147,7 +147,7 @@ a {
   color: lighten($color-active, 20%);
 }
 
-input {
+input, textarea {
   background: #333;
 	border: 1px solid rgba(255, 255, 255, 0.1);
   color: #ffffff;
@@ -155,6 +155,43 @@ input {
   padding: 0.5em;
 }
 
+textarea {
+  overflow: hidden;
+  resize: none;
+}
+
+.grow-wrap {
+  /* easy way to plop the elements on top of each other and have them both sized based on the tallest one's height */
+  display: grid;
+}
+.grow-wrap::after {
+  /* Note the weird space! Needed to preventy jumpy behavior */
+  content: attr(data-replicated-value) " ";
+
+  /* This is how textarea text behaves */
+  white-space: pre-wrap;
+
+  /* Hidden from view, clicks, and screen readers */
+  visibility: hidden;
+}
+.grow-wrap > textarea {
+  /* You could leave this, but after a user resizes, then it ruins the auto sizing */
+  resize: none;
+
+  /* Firefox shows scrollbar on growth, you can hide like this. */
+  overflow: hidden;
+}
+.grow-wrap > textarea,
+.grow-wrap::after {
+  /* Identical styling required!! */
+  border: 1px solid black;
+  padding: 0.5rem;
+  font: inherit;
+
+  /* Place on top of each other */
+  grid-area: 1 / 1 / 2 / 2;
+}
+
 fieldset {
   background-color: #151515;
 	border: 1px solid rgba(255, 255, 255, 0.1);

packages/core/src/components/project/sidebar/index.scss

@@ -28,6 +28,9 @@ $sidebar-basis: 12rem;
     &.ImageComponent {
       background-image: url('./img/image.png');
     }
+    &.ScriptComponent {
+      background-image: url('./img/script.png');
+    }
     &.SoundComponent {
       background-image: url('./img/music.png');
     }

yarn.lock

@@ -115,11 +115,13 @@
 
 "@avocado/persea@^1.0.0":
   version "1.0.0"
-  resolved "http://npm.cha0sdev/@avocado%2fpersea/-/persea-1.0.0.tgz#818d2b04456d9e5f1ca797b314725b48259ffcbe"
-  integrity sha512-p4Ra3u9Q3ieWM/oKmDnGVaW8TMPfskX7KAm/Fnll31lNjvIJnC7/nJa18iPLrAxs99UQJI6ilE/XyF+EMOmYCw==
+  resolved "http://npm.cha0sdev/@avocado%2fpersea/-/persea-1.0.0.tgz#1a307b6c4b0d49db5295d2d1233773cd3c1c2f51"
+  integrity sha512-Hw9rcNR+yRMuVPCqJTGNbZY+nKZJDvGhDBnARjFtC8fnv4GfYSa+4HwpBi0qyuWHGKLjHYXO4UsB26nK3VZUlA==
   dependencies:
     "@latus/react" "^2.0.0"
+    ace-builds "^1.4.12"
     deepmerge "^4.2.2"
+    react-ace "^9.4.0"
     react-json-editor-ajrm "^2.5.13"
     react-modal "^3.12.1"
 
@@ -2945,6 +2947,11 @@ accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7:
     mime-types "~2.1.24"
     negotiator "0.6.2"
 
+ace-builds@^1.4.12:
+  version "1.4.12"
+  resolved "http://npm.cha0sdev/ace-builds/-/ace-builds-1.4.12.tgz#888efa386e36f4345f40b5233fcc4fe4c588fae7"
+  integrity sha512-G+chJctFPiiLGvs3+/Mly3apXTcfgE45dT5yp12BcWZ1kUs+gm0qd3/fv4gsz6fVag4mM0moHVpjHDIgph6Psg==
+
 acorn-jsx@^5.3.1:
   version "5.3.1"
   resolved "http://npm.cha0sdev/acorn-jsx/-/acorn-jsx-5.3.1.tgz#fc8661e11b7ac1539c47dbfea2e72b3af34d267b"
@@ -4909,6 +4916,11 @@ dezalgo@^1.0.0:
     asap "^2.0.0"
     wrappy "1"
 
+diff-match-patch@^1.0.4:
+  version "1.0.5"
+  resolved "http://npm.cha0sdev/diff-match-patch/-/diff-match-patch-1.0.5.tgz#abb584d5f10cd1196dfc55aa03701592ae3f7b37"
+  integrity sha512-IayShXAgj/QMXgB0IWmKx+rOPuGMhqm5w6jvFxmVenXKIzRqTAAsbBPT3kWQeGANj3jGgvcvv4yK6SxqYmikgw==
+
 diff@5.0.0:
   version "5.0.0"
   resolved "http://npm.cha0sdev/diff/-/diff-5.0.0.tgz#7ed6ad76d859d030787ec35855f5b1daf31d852b"
@@ -7684,6 +7696,11 @@ lodash.get@^4.4.2:
   resolved "http://npm.cha0sdev/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
   integrity sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=
 
+lodash.isequal@^4.5.0:
+  version "4.5.0"
+  resolved "http://npm.cha0sdev/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
+  integrity sha1-QVxEePK8wwEgwizhDtMib30+GOA=
+
 lodash.ismatch@^4.4.0:
   version "4.4.0"
   resolved "http://npm.cha0sdev/lodash.ismatch/-/lodash.ismatch-4.4.0.tgz#756cb5150ca3ba6f11085a78849645f188f85f37"
@@ -9802,6 +9819,17 @@ rc@^1.2.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
+react-ace@^9.4.0:
+  version "9.4.0"
+  resolved "http://npm.cha0sdev/react-ace/-/react-ace-9.4.0.tgz#5c68423b5c7d4bc9332fc8b651187799c0bc97f6"
+  integrity sha512-fpY3AGViE1OglXThgn3wZWcPoAxr0bqRYqeG3jY3m1L7OIHo0GfZ3bJI0grhrADDy2i9jQoip9xZfpOFupQCsw==
+  dependencies:
+    ace-builds "^1.4.12"
+    diff-match-patch "^1.0.4"
+    lodash.get "^4.4.2"
+    lodash.isequal "^4.5.0"
+    prop-types "^15.7.2"
+
 react-autosuggest@^10.1.0:
   version "10.1.0"
   resolved "http://npm.cha0sdev/react-autosuggest/-/react-autosuggest-10.1.0.tgz#4d25b8acc78bb518eb70189bb96bcd777dc71ffb"